/* delivery.ro — design preluat din pagina anterioară a site-ului:
   Reddit Sans (servit local, OFL), bară și footer închise (#303b46),
   accent turcoaz (#5bd9e6), albastru secundar (#3985d4), fundal turcoaz pal
   (#e1f8f7), colțuri asimetrice (0 16px 16px 16px), umbre moi. Fără JS. */
@font-face {
  font-family: "Reddit Sans"; font-style: normal; font-weight: 200 900; font-display: swap;
  src: url(/static/fonts/reddit-sans-latin.3e3b66d208.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Reddit Sans"; font-style: normal; font-weight: 200 900; font-display: swap;
  src: url(/static/fonts/reddit-sans-latin-ext.1f4049cb63.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
:root { --teal: #5bd9e6; --teal-2: #0c7a79; --ink: #0f1a2a; --mute: #5b6878; --bg: #f7f9fc;
  --bg: #fff;
  --fg: #303b46;
  --muted: #6d6e71;
  --line: #dee2e6;
  --accent: #5bd9e6;
  --accent-dark: #3ec9d8;
  --accent-pale: #e1f8f7;
  --accent-card: #f3fcfc;
  --accent-line: #c2f0f0;
  --accent-text: #baf9f8;
  --blue: #2977c6;
  --blue-dark: #1f66ad;
  --dark: #303b46;
  --danger: #d30000;
  --ok: #228b22;
  --soft: #f2f4f8;
  --shadow: 10.725px 8.999px 32px 0 rgba(0, 0, 0, .06);
  --radius: 0 16px 16px 16px;
  --radius-lg: 0 30px 30px 30px;
  --wrap: 1400px;  /* the same container everywhere: the top bar's logo-to-menu width */
  --gutter: 24px;
  color-scheme: light;
}
* { box-sizing: border-box; }
html { font: 16px/1.5 "Reddit Sans", Helvetica, Arial, sans-serif; color: var(--fg); background: var(--bg); -webkit-text-size-adjust: 100%; }
body { margin: 0; min-height: 100vh; display: flex; flex-direction: column; font-size: 16px; }
footer { margin-top: auto; }
a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: underline; }
main.inner { flex: 1; width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 24px var(--gutter) 48px; }
main.wide { flex: 1; width: 100%; }
h1, h2, h3 { line-height: 1.3; font-weight: 800; margin: 0 0 16px; }
h1 { font-size: 26px; }
h2 { font-size: 20px; margin-top: 32px; }
h3 { font-size: 17px; margin-top: 20px; }
p { margin: 0 0 12px; }
code { background: var(--soft); padding: 1px 5px; border-radius: 4px; font-size: .92em; }

/* Butoane și formulare */
main.inner button, main.inner .button, .flash + form button { display: inline-flex; align-items: center; justify-content: center; margin-top: 16px; padding: 10px 26px; border: 0; border-radius: var(--radius-lg); background: var(--accent); color: var(--dark); font: inherit; font-weight: 700; font-size: 16px; cursor: pointer; text-decoration: none; transition: background 150ms ease-out; }
main.inner button:hover, main.inner .button:hover { background: var(--accent-dark); text-decoration: none; }
main.inner button.secondary, main.inner .button.secondary { background: var(--accent-card); border: 2px solid var(--accent-line); color: var(--fg); }
main.inner button.secondary:hover, main.inner .button.secondary:hover { background: #e7f9f8; }
main.inner button.blue, main.inner .button.blue { background: var(--blue); color: #fff; }
main.inner button.blue:hover, main.inner .button.blue:hover { background: var(--blue-dark); }
main.inner button.danger { background: var(--danger); color: #fff; }
main.inner button.danger:hover { background: #b00000; }
.inline-form { display: inline; }
main.inner .inline-form button { margin: 0 6px 6px 0; padding: 6px 16px; font-size: 14px; }
main.inner form { max-width: 520px; }
main.inner form.wide { max-width: 720px; }
main.inner label { display: block; margin: 14px 0 4px; font-weight: 600; }
main.inner label.inline { display: inline-block; margin: 6px 16px 6px 0; font-weight: 500; }
main.inner input[type=text], main.inner input[type=email], main.inner input[type=password], main.inner input[type=number], main.inner select, main.inner textarea {
  width: 100%; padding: 11px 14px; border: 1px solid var(--line); border-radius: var(--radius); font: inherit; background: #fff; color: var(--fg);
}
main.inner input:focus, main.inner select:focus, main.inner textarea:focus { outline: 2px solid var(--accent); outline-offset: 0; border-color: var(--accent); }
main.inner textarea { min-height: 120px; }
input:invalid { box-shadow: none; }
input[type=file] { display: block; margin: 4px 0; }
main.inner fieldset { border: 1px solid var(--line); border-radius: var(--radius); padding: 4px 16px 16px; margin: 18px 0; }
main.inner legend { font-weight: 700; padding: 0 6px; }
.help { color: var(--muted); font-size: .9rem; margin: 6px 0 0; }
.error { color: var(--danger); font-size: .9rem; margin: 4px 0 0; font-weight: 600; }
.flash { position: relative; overflow: hidden; display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: 10px; margin: 0 0 18px; border: 1px solid; font-weight: 600; transition: opacity .4s, translate .4s, margin .4s, max-height .4s; max-height: 200px; }
.flash > svg { flex: none; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.flash > span:not(.flash-count) { flex: 1; }
.flash-count { flex: none; display: flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; padding: 0 6px; border-radius: 8px; background: currentColor; font-size: 12px; font-weight: 800; font-variant-numeric: tabular-nums; }
.flash-count b { color: #fff; }
.flash-close { flex: none; display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: inherit; cursor: pointer; }
main.inner .flash-close { margin: 0; padding: 0; background: transparent; color: inherit; }
.flash-close svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; }
.flash-close:hover { background: rgba(15,26,42,.08); }
.flash-bar { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: currentColor; opacity: .45; transition: width 5s linear; }
.flash.is-counting .flash-bar { width: 0; }
.flash.is-gone { opacity: 0; translate: 0 -8px; max-height: 0; margin: 0; padding-top: 0; padding-bottom: 0; border-width: 0; }
@media (prefers-reduced-motion: reduce) { .flash, .flash-bar { transition: none; } }
.flash.ok { color: var(--ok); border-color: #b7e2b7; background: #eef8f1; }
.flash.err { color: var(--danger); border-color: #f2b8b8; background: #fcefee; }
.box { border: 1px solid var(--line); border-radius: 0 10px 10px 10px; padding: 18px 20px; margin: 0 0 18px; background: #fff; box-shadow: var(--shadow); }
.muted { color: var(--muted); }
.prewrap { white-space: pre-line; }

/* Tabele */
table { border-collapse: collapse; width: 100%; margin: 0 0 18px; font-size: .95rem; }
th, td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
th { background: var(--soft); font-weight: 700; }
tr.disputed td { background: #fcefee; }

/* Anunțuri */
/* Lista de anunțuri (/anunturi, /c/{slug}): antet cu etichetă, bară de filtre, carduri ca pe prima pagină, paginare cu butoane */
.lp-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px; margin: 8px 0 20px; }
.lp-head h1 { margin: 12px 0 8px; font-size: clamp(28px, 3.4vw, 40px); letter-spacing: -.02em; }
.lp-sub { margin: 0; color: var(--muted); max-width: 70ch; }
.lp-crumbs { margin: 0 0 4px; font-size: 14px; color: var(--muted); }
.lp-crumbs a { color: var(--muted); font-weight: 600; }
.lp-crumbs span { color: var(--fg); font-weight: 700; }
main.inner form.lp-filter { max-width: none; display: grid; gap: 12px; margin: 0 0 26px; padding: 16px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 40px -32px rgba(15,26,42,.35); }
.lp-field label { margin: 0 0 6px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.lp-ctl { position: relative; display: flex; align-items: center; }
.lp-ctl > svg { position: absolute; left: 12px; width: 18px; height: 18px; fill: none; stroke: #0c7a79; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.lp-ctl b { position: absolute; right: 12px; font-size: 12px; font-weight: 800; letter-spacing: .08em; color: var(--muted); pointer-events: none; }
main.inner .lp-ctl select, main.inner .lp-ctl input { width: 100%; padding: 12px 40px 12px 14px; border: 1px solid rgba(15,26,42,.14); border-radius: 10px; font: inherit; font-weight: 600; background: #fff; }
main.inner .lp-ctl select { padding-left: 38px; appearance: none; -webkit-appearance: none; cursor: pointer; }
.lp-ctl::after { display: none; }
main.inner .lp-ctl select:focus, main.inner .lp-ctl input:focus { outline: 0; border-color: #5bd9e6; box-shadow: 0 0 0 3px rgba(91,217,230,.25); }
.lp-actions { display: flex; align-items: center; gap: 14px; }
main.inner .lp-actions button { margin: 0; }
.lp-reset { font-weight: 700; color: var(--muted); }
.lp-trail { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 12px; font-size: 13px; }
.lp-trail a, .lp-trail span { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 8px; background: #fff; border: 1px solid rgba(15,26,42,.1); color: var(--muted); font-weight: 700; text-decoration: none; }
.lp-trail a:hover { border-color: var(--teal); color: #0c7a79; text-decoration: none; }
.lp-trail span { color: #fff; background: linear-gradient(135deg, #0c7a79, #18afff); border-color: transparent; }
.lp-trail svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lp-trail i { width: 12px; height: 2px; border-radius: 2px; background: rgba(15,26,42,.2); }
.lp-title { display: grid; grid-template-columns: 64px 1fr; column-gap: 16px; align-items: center; }
.lp-title h1 { margin: 0 0 6px; }
.lp-title .ld-orb svg { width: 34px; height: 34px; }
.lp-tiles { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.lp-tile { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; }
.lp-tile-1 { --lane: #2b7fd6; --lane-2: #1b5aa3; --lane-l: #9dd0ff; } .lp-tile-2 { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
main.inner .lp-tile a { display: grid; grid-template-columns: 44px 1fr; column-gap: 12px; align-items: center; padding: 10px 14px 10px 10px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 16%, #fff), #fff 65%); border: 1px solid color-mix(in srgb, var(--lane) 35%, #e6ebf2); color: var(--fg); text-decoration: none; transition: translate .2s, box-shadow .3s, border-color .3s; }
main.inner .lp-tile a:hover { translate: 0 -3px; border-color: var(--lane); box-shadow: 0 20px 34px -24px color-mix(in srgb, var(--lane) 90%, rgba(15,26,42,.3)); text-decoration: none; }
.lp-tile i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.lp-tile svg { width: 22px; height: 22px; fill: none; stroke: #06201f; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lp-tile b { display: block; font-size: 14.5px; line-height: 1.2; }
.lp-tile span { display: block; font-size: 12px; color: var(--lane-2); font-weight: 700; }
.lp-tile em { font-style: normal; display: inline-block; transition: translate .2s; }
.lp-tile a:hover em { translate: 4px 0; }
@media (min-width: 900px) { .lp-title { grid-template-columns: 84px 1fr; column-gap: 22px; } .lp-title .ld-orb svg { width: 44px; height: 44px; } main.inner form.lp-filter-cat { grid-template-columns: 1fr 1fr auto; } }
.lp-subcats { list-style: none; padding: 0; margin: 0 0 22px; display: flex; flex-wrap: wrap; gap: 8px; }
.lp-subcats a { display: inline-block; padding: 8px 14px; border-radius: 10px; background: #fff; border: 1px solid rgba(91,217,230,.5); color: #0c7a79; font-weight: 700; text-decoration: none; transition: background .2s, color .2s; }
.lp-subcats a:hover { background: #5bd9e6; color: #06201f; text-decoration: none; }
@media (min-width: 900px) { main.inner form.lp-filter { grid-template-columns: 1.6fr 1.2fr .8fr .8fr auto; align-items: end; padding: 18px 20px; } }
.cards { list-style: none; padding: 0; margin: 0 0 24px; display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 22px; }
.card { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid color-mix(in srgb, var(--lane) 22%, #e6ebf2); border-radius: 10px; padding: 10px 10px 0; overflow: hidden; box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 40px -30px color-mix(in srgb, var(--lane) 65%, rgba(15,26,42,.3)); transition: translate .25s, box-shadow .3s, border-color .3s; }
.card::before { content: ""; position: absolute; inset: 0; z-index: 3; border-radius: 10px; padding: 1.5px; background: conic-gradient(from var(--hp-a), var(--lane-l), var(--lane), #fff, var(--lane-l)); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask-composite: exclude; opacity: 0; pointer-events: none; transition: opacity .3s; }
.card:hover::before { opacity: 1; animation: hp-holo 4s linear infinite; }
.card:hover .card-band { background: linear-gradient(90deg, color-mix(in srgb, var(--lane) 24%, #fff), color-mix(in srgb, var(--lane-l) 30%, #fff)); }
.card .card-buy span { display: inline-block; transition: translate .2s; } .card .card-buy:hover span { translate: 3px 0; }
@media (prefers-reduced-motion: reduce) { .card::before { animation: none; } }
.card:hover { translate: 0 -6px; border-color: var(--lane); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 32px 54px -28px color-mix(in srgb, var(--lane) 80%, rgba(15,26,42,.35)), 0 0 0 4px color-mix(in srgb, var(--lane) 14%, transparent); }
.card a { text-decoration: none; color: var(--fg); display: block; }
.card-link { flex: 1; }
.card-media { position: relative; display: block; border-radius: 10px; overflow: hidden; aspect-ratio: 4 / 3; background: #f3f6fa; }
.card img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .7s cubic-bezier(.2,.8,.2,1); }
.card:hover img { transform: scale(1.07); }
/* Fără imagine: iconița categoriei într-un orb cu gradient, ca placeholder reprezentativ */
.card-ill { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: radial-gradient(120% 90% at 50% 100%, color-mix(in srgb, var(--lane) 26%, #fff), color-mix(in srgb, var(--lane) 6%, #fff) 60%); }
.card-ill::before { content: ""; position: absolute; width: 150%; height: 60%; left: -25%; bottom: -30%; border-radius: 10px; background: color-mix(in srgb, var(--lane) 16%, transparent); }
.card-ill i { position: relative; display: flex; align-items: center; justify-content: center; width: 92px; height: 92px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 22px 34px -16px color-mix(in srgb, var(--lane) 90%, transparent), inset 0 2px 0 rgba(255,255,255,.7); transition: transform .4s cubic-bezier(.2,1.2,.3,1); }
.card:hover .card-ill i { transform: translateY(-6px) rotate(-6deg) scale(1.05); }
.card-ill i svg { width: 46px; height: 46px; fill: none; stroke: #06201f; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.card-ill > span { position: relative; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--lane-2); }
.card-price { position: absolute; left: -2px; bottom: 14px; display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px 8px 12px; border-radius: 0 10px 10px 0; background: linear-gradient(90deg, #0f1a2a, #16294a); color: #fff; font-weight: 900; font-size: 16px; letter-spacing: -.01em; font-variant-numeric: tabular-nums; box-shadow: 0 10px 24px -10px rgba(15,26,42,.8); }
.card-price svg { width: 15px; height: 15px; fill: none; stroke: var(--lane-l); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.card-tags { position: absolute; right: 10px; top: 10px; display: flex; gap: 6px; }
.card-tag { display: inline-flex; align-items: center; padding: 5px 10px; border-radius: 10px; background: rgba(255,255,255,.94); color: var(--fg); font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; box-shadow: 0 6px 14px -8px rgba(15,26,42,.4); }
.card-tag-new { color: #06201f; background: linear-gradient(135deg, #9beef5, #5bd9e6); }
.card-tag-status { color: #b45309; }
.card-body { display: block; padding: 12px 8px 4px; }
.card strong { display: block; font-weight: 800; font-size: 16px; line-height: 1.3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.card-meta { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.card-meta em { font-style: normal; font-size: 11.5px; font-weight: 700; color: var(--muted); background: rgba(15,26,42,.05); border-radius: 10px; padding: 3px 9px; }
.card-meta .card-cat { color: var(--lane-2); background: color-mix(in srgb, var(--lane) 12%, transparent); }
.card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 8px 8px 12px; }
.card-seller { display: flex; align-items: center; gap: 8px; min-width: 0; }
.card-seller i { flex: none; width: 30px; height: 30px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-style: normal; font-weight: 900; font-size: 12px; color: #06201f; background: linear-gradient(135deg, var(--lane-l), var(--lane)); text-transform: uppercase; }
.card-seller > span { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.card-seller b { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-seller em { display: inline-flex; align-items: center; gap: 3px; font-style: normal; font-size: 10px; font-weight: 800; color: #0c7a79; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.card-seller em svg { width: 11px; height: 11px; fill: none; stroke: #0c7a79; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.card .card-buy { flex: none; display: inline-flex; align-items: center; gap: 5px; padding: 9px 14px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); color: #06201f; font-weight: 800; font-size: 13px; box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--lane) 90%, transparent); transition: transform .2s, box-shadow .2s; }
.card .card-buy:hover { transform: translateY(-2px); box-shadow: 0 14px 26px -10px color-mix(in srgb, var(--lane) 100%, transparent); text-decoration: none; }
.card-band { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0 -10px; padding: 9px 12px; font-size: 11px; font-weight: 700; color: var(--lane-2); background: color-mix(in srgb, var(--lane) 10%, #fff); border-top: 1px solid color-mix(in srgb, var(--lane) 22%, #e6ebf2); }
.card-band svg { width: 14px; height: 14px; fill: none; stroke: var(--lane-2); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.cards-empty { display: grid; justify-items: center; text-align: center; gap: 8px; padding: 40px 24px; border-radius: 10px; background: #fff; border: 1px dashed rgba(91,217,230,.6); margin-bottom: 24px; }
.cards-empty i { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 10px; background: linear-gradient(135deg, #9beef5, #5bd9e6); box-shadow: 0 12px 24px -10px rgba(91,217,230,.9); margin-bottom: 6px; }
.cards-empty i svg { width: 30px; height: 30px; fill: none; stroke: #06201f; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cards-empty b { font-size: 18px; }
.cards-empty span { color: var(--muted); }
main.inner .cards-empty .hp-btn { margin-top: 10px; }
.pager { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; justify-content: center; margin: 8px 0 16px; }
.pager-btn { display: inline-flex; align-items: center; white-space: nowrap; padding: 10px 18px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.12); font-weight: 700; color: var(--fg); text-decoration: none; transition: border-color .2s, box-shadow .2s, translate .2s; }
a.pager-btn:hover { border-color: #5bd9e6; box-shadow: 0 10px 24px -16px rgba(91,217,230,.8); translate: 0 -2px; text-decoration: none; }
.pager-btn.is-off { opacity: .4; }
.pager-info { flex-basis: 100%; text-align: center; color: var(--muted); font-size: 14px; }
.pager-pages { display: inline-flex; gap: 4px; }
.pager-pages a, .pager-pages b, .pager-pages i { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 8px; border-radius: 10px; font-weight: 800; font-size: 14px; }
.pager-pages a { background: #fff; border: 1px solid rgba(15,26,42,.12); color: var(--fg); text-decoration: none; transition: border-color .2s, translate .2s; }
.pager-pages a:hover { border-color: #5bd9e6; translate: 0 -2px; text-decoration: none; }
.pager-pages b { background: linear-gradient(135deg, #5bd9e6, #18afff); color: #06201f; box-shadow: 0 10px 20px -12px rgba(24,175,255,.9); }
.pager-pages i { color: var(--muted); font-style: normal; }
/* ---- /anunturi (2026-09-24): antet-panou cu fapte, cipuri de categorii, filtre active, bandă escrow ---- */
.lp-hero { position: relative; overflow: hidden; margin: 8px 0 18px; padding: 22px 22px 24px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 30px 60px -44px rgba(15,26,42,.35); }
.lp-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(560px 300px at 88% 0%, rgba(91,217,230,.28), transparent 65%), radial-gradient(460px 280px at 4% 100%, rgba(124,108,255,.18), transparent 65%), radial-gradient(400px 240px at 50% 120%, rgba(24,175,255,.14), transparent 65%); pointer-events: none; }
.lp-hero::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, #5bd9e6, #18afff 50%, #7c6cff); }
.lp-hero > * { position: relative; }
.lp-hero-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
.lp-hero-main { min-width: 0; }
.lp-hero h1 { margin: 12px 0 8px; font-size: clamp(28px, 3.4vw, 42px); letter-spacing: -.02em; }
.lp-hero .hp-eyebrow-fancy b { margin-left: 4px; padding: 2px 8px; border-radius: 6px; background: linear-gradient(135deg, #5bd9e6, #18afff); color: #06201f; font-size: 11px; }
.lp-hero-facts { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 10px; }
.lp-hero-facts li { --lane: #5bd9e6; --lane-l: #9beef5; display: grid; grid-template-columns: 40px 1fr; column-gap: 10px; align-items: center; padding: 8px 12px 8px 8px; border-radius: 10px; background: rgba(255,255,255,.75); border: 1px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); }
.lp-hero-facts li.is-blue { --lane: #18afff; --lane-l: #9dd0ff; } .lp-hero-facts li.is-violet { --lane: #7c6cff; --lane-l: #c4b8ff; }
.lp-hero-facts i { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 8px 16px -8px var(--lane); }
.lp-hero-facts svg { width: 20px; height: 20px; fill: none; stroke: #06201f; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lp-hero-facts b { display: block; font-size: 13.5px; } .lp-hero-facts small { display: block; font-size: 12px; color: var(--muted); }
/* cardul „Vinzi ceva?” (2026-09-24, refăcut deschis la culoare la cererea operatorului): chenar holografic
   rotitor, scenă desenată cu un mini-anunț care se publică, monede și scut plutind, cei trei pași ca pastile */
.lp-sell-card { position: relative; overflow: hidden; display: grid; gap: 8px; padding: 16px 20px 20px; border-radius: 10px; border: 1px solid transparent; background: linear-gradient(160deg, #fff, #f3f9ff 55%, #f5f2ff) padding-box, conic-gradient(from var(--hp-a), #5bd9e6, #18afff 35%, #7c6cff 60%, #5bd9e6) border-box; color: var(--fg); box-shadow: 0 30px 60px -36px rgba(24,175,255,.6), 0 1px 2px rgba(15,26,42,.05); animation: hp-holo 9s linear infinite; }
.lp-sell-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(240px 150px at 100% 0%, rgba(91,217,230,.22), transparent 65%), radial-gradient(220px 150px at 0% 100%, rgba(124,108,255,.18), transparent 65%); pointer-events: none; }
.lp-sell-card > * { position: relative; }
.lp-sell-scene { margin: -4px -8px 0; }
.lp-sell-scene svg { display: block; width: 100%; max-width: 260px; height: auto; margin: 0 auto; overflow: visible; }
.lp-sell-scene text { font-family: "Reddit Sans", system-ui, sans-serif; }
.lps-card { filter: drop-shadow(0 14px 18px rgba(24,175,255,.25)); animation: hp-float-y 5s ease-in-out infinite; }
.lps-badge { transform-origin: 169px 17px; animation: lps-pop 6s ease-out infinite; }
.lps-coin { animation: hp-float-y 4s ease-in-out infinite; } .lps-coin-2 { animation-delay: -2s; animation-duration: 5s; }
.lps-shield { animation: hp-float-y 6s ease-in-out infinite; animation-delay: -1.5s; }
.lps-spark { animation: lps-twinkle 2.4s ease-in-out infinite; }
@keyframes hp-float-y { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes lps-pop { 0%, 8% { transform: scale(0); opacity: 0; } 14% { transform: scale(1.15); opacity: 1; } 18%, 88% { transform: scale(1); opacity: 1; } 94%, 100% { transform: scale(0); opacity: 0; } }
@keyframes lps-twinkle { 0%, 100% { opacity: .3; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.1); } }
.lp-sell-tag { display: inline-flex; align-items: center; gap: 7px; justify-self: start; padding: 4px 10px; border-radius: 8px; background: rgba(91,217,230,.14); border: 1px solid rgba(91,217,230,.45); color: #0c7a79; font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.lp-sell-tag i { width: 7px; height: 7px; border-radius: 50%; background: #5bd9e6; box-shadow: 0 0 0 0 rgba(91,217,230,.6); animation: hp-pulse 2s infinite; }
.lp-sell-card b { font-size: 21px; line-height: 1.15; letter-spacing: -.01em; } .lp-sell-card b .hp-grad-2 { display: block; }
.lp-sell-txt { font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.lp-sell-steps { list-style: none; margin: 4px 0 2px; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; counter-reset: lps; }
@media (max-width: 479px) { .lp-sell-steps { grid-template-columns: minmax(0, 1fr); } }
.lp-hero-side { min-width: 0; }
.lp-sell-steps li { --lane: #5bd9e6; --lane-l: #9beef5; --lane-2: #0c7a79; position: relative; display: flex; align-items: center; gap: 7px; padding: 6px 8px 6px 6px; border-radius: 8px; background: rgba(255,255,255,.8); border: 1px solid color-mix(in srgb, var(--lane) 35%, #e6ebf2); font-size: 12px; font-weight: 800; color: var(--lane-2); counter-increment: lps; min-width: 0; }
.lp-sell-steps li.is-blue { --lane: #18afff; --lane-l: #9dd0ff; --lane-2: #1b5aa3; } .lp-sell-steps li.is-violet { --lane: #7c6cff; --lane-l: #c4b8ff; --lane-2: #4b3fd6; }
.lp-sell-steps li::before { content: counter(lps); position: absolute; left: -4px; top: -6px; width: 15px; height: 15px; border-radius: 5px; background: var(--lane-2); color: #fff; font-size: 9px; font-weight: 800; line-height: 15px; text-align: center; }
.lp-sell-steps i { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 7px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.lp-sell-steps svg { width: 13px; height: 13px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lp-sell-card .hp-btn { justify-self: stretch; justify-content: center; margin-top: 6px; }
@media (prefers-reduced-motion: reduce) { .lp-sell-card, .lps-card, .lps-badge, .lps-coin, .lps-shield, .lps-spark, .lp-sell-tag i { animation: none; } .lps-badge { transform: none; opacity: 1; } }
@media (min-width: 900px) { .lp-hero { padding: 26px 34px 30px; } .lp-hero-row { grid-template-columns: minmax(0, 1fr) 340px; gap: 32px; align-items: start; } .lp-hero-facts { grid-template-columns: repeat(3, 1fr); } }
/* banda de încredere (o linie, fără casete) și vitrina de categorii din antet (2026-09-24, „cu adevărat wow”) */
.lp-trust { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.lp-trust li { --lane: #5bd9e6; --lane-l: #9beef5; display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--fg); }
.lp-trust li.is-blue { --lane: #18afff; --lane-l: #9dd0ff; } .lp-trust li.is-violet { --lane: #7c6cff; --lane-l: #c4b8ff; }
.lp-trust i { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 7px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 6px 12px -6px var(--lane); }
.lp-trust svg { width: 13px; height: 13px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lp-cats { margin: 22px 0 0; }
.lp-cats-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0 0 12px; }
.lp-cats-h span { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--fg); }
.lp-cats-h svg { width: 14px; height: 14px; fill: none; stroke: #0c7a79; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lp-cats-h small { font-size: 12.5px; color: var(--muted); }
.lp-cats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: 10px; }
.lp-cat { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; position: relative; display: grid; justify-items: center; gap: 4px; min-width: 0; padding: 16px 8px 12px; border-radius: 10px; background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--lane) 7%, #fff)); border: 1px solid color-mix(in srgb, var(--lane) 26%, #e6ebf2); color: var(--fg); text-align: center; text-decoration: none; overflow: hidden; box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 16px 30px -26px color-mix(in srgb, var(--lane) 70%, rgba(15,26,42,.3)); transition: translate .25s, box-shadow .3s, border-color .3s; }
.lp-cat-c1 { --lane: #2b7fd6; --lane-2: #1b5aa3; --lane-l: #9dd0ff; } .lp-cat-c2 { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; } .lp-cat-all { --lane: #18afff; --lane-2: #0f1a2a; --lane-l: #5bd9e6; }
.lp-cat::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, var(--lane-l), var(--lane), var(--lane-l)); background-size: 200% 100%; opacity: .7; transition: opacity .3s; }
.lp-cat::after { content: ""; position: absolute; left: 50%; top: 34px; width: 90px; height: 90px; translate: -50% -50%; border-radius: 10px; background: radial-gradient(closest-side, color-mix(in srgb, var(--lane) 40%, transparent), transparent); opacity: 0; transition: opacity .3s; pointer-events: none; }
.lp-cat i { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; margin-bottom: 6px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 12px 22px -10px var(--lane), inset 0 1px 0 rgba(255,255,255,.6); transition: transform .3s, box-shadow .3s; }
.lp-cat i::before { content: ""; position: absolute; inset: -4px; border-radius: 10px; border: 1px solid transparent; background: conic-gradient(from var(--hp-a), var(--lane-l), var(--lane), #fff, var(--lane-l)) border-box; -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0); mask-composite: exclude; opacity: 0; transition: opacity .3s; }
.lp-cat i svg { width: 26px; height: 26px; fill: none; stroke: #06201f; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lp-cat b { position: relative; z-index: 1; max-width: 100%; font-size: 13.5px; line-height: 1.2; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow-wrap: anywhere; }
.lp-cat small { position: relative; z-index: 1; padding: 2px 8px; border-radius: 6px; background: color-mix(in srgb, var(--lane) 14%, #fff); color: var(--lane-2); font-size: 11px; font-weight: 800; }
.lp-cat:hover { translate: 0 -4px; border-color: var(--lane); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 26px 40px -24px color-mix(in srgb, var(--lane) 90%, transparent); text-decoration: none; }
.lp-cat:hover::before { opacity: 1; animation: lp-cat-light 1.6s linear infinite; } .lp-cat:hover::after { opacity: 1; }
.lp-cat:hover i { transform: translateY(-3px) rotate(-6deg) scale(1.08); box-shadow: 0 18px 28px -10px var(--lane), inset 0 1px 0 rgba(255,255,255,.6); }
.lp-cat:hover i::before { opacity: 1; animation: hp-holo 3s linear infinite; }
@keyframes lp-cat-light { to { background-position: -200% 0; } }
.lp-cat.is-on { border-color: transparent; background: linear-gradient(160deg, var(--lane-2), var(--lane)); color: #fff; box-shadow: 0 22px 36px -18px var(--lane); }
.lp-cat.is-on::before { opacity: 0; } .lp-cat.is-on::after { opacity: .6; background: radial-gradient(closest-side, rgba(255,255,255,.35), transparent); }
.lp-cat.is-on i { background: rgba(255,255,255,.2); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); } .lp-cat.is-on i svg { stroke: #fff; }
.lp-cat.is-on small { background: rgba(255,255,255,.22); color: #fff; }
@media (max-width: 479px) { .lp-cats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } .lp-cat { padding: 12px 6px 10px; } .lp-cat i { width: 44px; height: 44px; } .lp-cat i svg { width: 22px; height: 22px; } .lp-cat b { font-size: 12px; } }
@media (prefers-reduced-motion: reduce) { .lp-cat::before, .lp-cat i::before { animation: none; } }
/* consola de filtre (2026-09-24): chenar holografic, iconițe în plăci gradient, prețul ca interval, cipuri rapide */
main.inner form.lp-filter.lp-console { position: relative; grid-template-columns: minmax(0, 1fr); gap: 14px; margin-bottom: 18px; padding: 18px 20px 16px; border: 1px solid transparent; background: linear-gradient(#fff, #fff) padding-box, conic-gradient(from var(--hp-a), rgba(91,217,230,.35), #5bd9e6 30%, rgba(24,175,255,.35) 55%, #7c6cff 80%, rgba(91,217,230,.35)) border-box; box-shadow: 0 30px 60px -44px rgba(24,175,255,.6), 0 1px 2px rgba(15,26,42,.05); animation: hp-holo 12s linear infinite; }
.lp-console-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px; }
.lp-console-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--fg); }
.lp-console-eyebrow i { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 7px; background: linear-gradient(135deg, #9beef5, #5bd9e6); }
.lp-console-eyebrow svg { width: 14px; height: 14px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lp-console-hint { font-size: 12.5px; color: var(--muted); }
.lp-console-row { display: grid; gap: 12px; }
.lp-console .lp-ctl i { position: absolute; left: 7px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; background: linear-gradient(135deg, #9beef5, #5bd9e6); box-shadow: 0 6px 12px -6px #5bd9e6; pointer-events: none; }
.lp-console .lp-ctl i.is-blue { background: linear-gradient(135deg, #9dd0ff, #18afff); box-shadow: 0 6px 12px -6px #18afff; } .lp-console .lp-ctl i.is-violet { background: linear-gradient(135deg, #c4b8ff, #7c6cff); box-shadow: 0 6px 12px -6px #7c6cff; }
.lp-console .lp-ctl i svg { position: static; width: 16px; height: 16px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
main.inner .lp-console .lp-ctl i + input, main.inner .lp-console .lp-ctl i + select { padding-left: 48px; }
main.inner .lp-console .lp-field-q .lp-ctl input { padding-top: 14px; padding-bottom: 14px; font-size: 16px; }
main.inner .lp-console .lp-field-q .lp-ctl i { width: 36px; height: 36px; }
main.inner .lp-console .lp-field-q .lp-ctl i + input { padding-left: 54px; }
main.inner .lp-console-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin: 0; align-self: end; }
.lp-console-btn > svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.lp-range { display: grid; grid-template-columns: 1fr 16px 1fr; align-items: center; gap: 4px; }
.lp-range-sep { display: block; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #7c6cff, #18afff); }
.lp-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.lp-quick-l { display: inline-flex; align-items: center; gap: 5px; margin-right: 4px; font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.lp-quick-l svg { width: 13px; height: 13px; fill: none; stroke: #ffb547; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lp-quick-chip { display: inline-flex; align-items: center; padding: 5px 11px; border-radius: 8px; background: rgba(124,108,255,.08); border: 1px solid rgba(124,108,255,.3); color: #4b3fd6; font-size: 12.5px; font-weight: 700; text-decoration: none; transition: background .2s, border-color .2s, translate .2s; }
.lp-quick-chip:hover { background: rgba(124,108,255,.16); border-color: #7c6cff; translate: 0 -1px; text-decoration: none; }
.lp-quick-chip.is-on { background: linear-gradient(135deg, #7c6cff, #18afff); border-color: transparent; color: #fff; box-shadow: 0 10px 20px -12px #7c6cff; }
@media (min-width: 900px) { .lp-console-row-q { grid-template-columns: 1fr auto; } .lp-console-row-2 { grid-template-columns: 1fr 1.2fr; } }
@media (prefers-reduced-motion: reduce) { main.inner form.lp-filter.lp-console { animation: none; } }
/* filtrele active și antetul rezultatelor */
.lp-results { display: grid; gap: 10px; margin: 0 0 16px; }
.lp-active { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.lp-active-l { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.lp-active-l svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lp-chip { --lane: #5bd9e6; --lane-2: #0c7a79; display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px 5px 11px; border-radius: 8px; background: color-mix(in srgb, var(--lane) 14%, #fff); border: 1px solid color-mix(in srgb, var(--lane) 45%, transparent); color: var(--lane-2); font-size: 13px; font-weight: 700; text-decoration: none; transition: background .2s; }
.lp-chip-c { --lane: #2b7fd6; --lane-2: #1b5aa3; } .lp-chip-pret_min, .lp-chip-pret_max { --lane: #7c6cff; --lane-2: #4b3fd6; }
.lp-chip svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; border-radius: 4px; }
.lp-chip:hover { background: color-mix(in srgb, var(--lane) 28%, #fff); text-decoration: none; }
.lp-reset { font-weight: 700; color: var(--muted); font-size: 13px; }
.lp-results-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding-bottom: 10px; border-bottom: 1px solid rgba(15,26,42,.08); }
.lp-count { display: flex; align-items: baseline; gap: 8px; margin: 0; color: var(--muted); font-size: 14px; }
.lp-count b { font-size: 22px; letter-spacing: -.02em; background: linear-gradient(90deg, #0f1a2a, #0c7a79 60%, #18afff); -webkit-background-clip: text; background-clip: text; color: transparent; font-variant-numeric: tabular-nums; } .lp-count strong { color: var(--fg); }
.lp-results-r { display: flex; align-items: center; gap: 12px; }
.lp-view { display: inline-flex; gap: 2px; padding: 3px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.1); }
.lp-view-in { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.lp-view label { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 8px; font-size: 12.5px; font-weight: 800; color: var(--muted); cursor: pointer; transition: background .2s, color .2s; }
.lp-view label svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lp-view-in:checked + label { background: linear-gradient(135deg, #5bd9e6, #18afff); color: #06201f; box-shadow: 0 8px 16px -10px #18afff; }
.lp-view-in:focus-visible + label { outline: 2px solid #18afff; outline-offset: 2px; }
@media (max-width: 699px) { .lp-view { display: none; } }
/* afișarea ca listă (radio + :has, fără JS; doar ≥ 700 px) */
@media (min-width: 700px) {
	main.inner:has(#lp-v-list:checked) .cards { grid-template-columns: 1fr; gap: 14px; }
	main.inner:has(#lp-v-list:checked) .card { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "link foot" "band band"; padding: 10px; }
	main.inner:has(#lp-v-list:checked) .card-link { grid-area: link; display: grid; grid-template-columns: 240px minmax(0, 1fr); column-gap: 18px; align-items: center; }
	main.inner:has(#lp-v-list:checked) .card strong { font-size: 18px; }
	main.inner:has(#lp-v-list:checked) .card-foot { grid-area: foot; flex-direction: column; align-items: flex-end; justify-content: center; gap: 14px; margin: 0 6px 0 0; }
	main.inner:has(#lp-v-list:checked) .card-band { grid-area: band; margin: 10px -10px -10px; }
	main.inner:has(#lp-v-list:checked) .card-ill > span { display: none; }
	main.inner:has(#lp-v-list:checked) .card-ill i { width: 72px; height: 72px; }
}

.lp-sort { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--muted); }
.lp-sort svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* banda escrow de sub listă (2026-09-24): card cu chenar holografic, text + traseu în trei pași cu monedă în mișcare */
.lp-band { margin: 8px 0 24px; }
.lp-band-in { position: relative; overflow: hidden; display: grid; gap: 22px; padding: 22px 22px 24px; border-radius: 10px; border: 1px solid transparent; background: linear-gradient(160deg, #fff, #f3f9ff 55%, #f5f2ff) padding-box, conic-gradient(from var(--hp-a), #5bd9e6, #18afff 35%, #7c6cff 60%, #5bd9e6) border-box; box-shadow: 0 30px 60px -44px rgba(24,175,255,.6), 0 1px 2px rgba(15,26,42,.05); animation: hp-holo 10s linear infinite; }
.lp-band-in::before { content: ""; position: absolute; inset: 0; background: radial-gradient(420px 220px at 100% 0%, rgba(91,217,230,.2), transparent 65%), radial-gradient(360px 220px at 0% 100%, rgba(124,108,255,.16), transparent 65%); pointer-events: none; }
.lp-band-in > * { position: relative; }
.lp-band-txt { display: grid; gap: 8px; justify-items: start; }
.lp-band-eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px 4px 5px; border-radius: 8px; background: rgba(91,217,230,.14); border: 1px solid rgba(91,217,230,.45); color: #0c7a79; font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.lp-band-eyebrow i { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 6px; background: linear-gradient(135deg, #9beef5, #5bd9e6); }
.lp-band-eyebrow svg { width: 13px; height: 13px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lp-band-txt b { font-size: 24px; line-height: 1.15; letter-spacing: -.01em; }
.lp-band-txt > span:not(.lp-band-eyebrow) { font-size: 14.5px; line-height: 1.55; color: var(--muted); max-width: 52ch; }
.lp-band-txt .hp-btn { margin-top: 4px; }
.lp-rail { position: relative; list-style: none; margin: 0; padding: 26px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.lp-rail::before { content: ""; position: absolute; left: 16.66%; right: 16.66%; top: 25px; height: 2px; background: repeating-linear-gradient(90deg, rgba(24,175,255,.7) 0 10px, transparent 10px 18px); animation: ft-dash .9s linear infinite; }
.lp-rail-coin { position: absolute; top: 25px; left: 16.66%; z-index: 2; display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 8px; translate: -50% -50%; background: linear-gradient(135deg, #ffe08a, #ffb547); box-shadow: 0 6px 14px -4px rgba(255,181,71,.9), 0 0 0 3px #fff; animation: lp-rail-coin 5s linear infinite; }
.lp-rail-coin svg { width: 16px; height: 16px; fill: none; stroke: #7a4a00; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
@keyframes lp-rail-coin { 0% { left: 16.66%; opacity: 0; } 6% { opacity: 1; } 44% { left: 50%; opacity: 1; } 50% { opacity: 0; } 56% { left: 50%; opacity: 0; } 62% { opacity: 1; } 94% { left: 83.33%; opacity: 1; } 100% { left: 83.33%; opacity: 0; } }
.lp-rail li { --lane: #5bd9e6; --lane-l: #9beef5; --lane-2: #0c7a79; position: relative; display: grid; justify-items: center; gap: 2px; padding: 0 6px 12px; border-radius: 10px; background: rgba(255,255,255,.8); border: 1px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); text-align: center; }
.lp-rail li.is-blue { --lane: #18afff; --lane-l: #9dd0ff; --lane-2: #1b5aa3; } .lp-rail li.is-violet { --lane: #7c6cff; --lane-l: #c4b8ff; --lane-2: #4b3fd6; }
.lp-rail li i { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; margin: -26px 0 8px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 10px 20px -10px var(--lane), 0 0 0 4px #fff; }
.lp-rail li svg { width: 24px; height: 24px; fill: none; stroke: #06201f; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lp-rail li b { font-size: 13.5px; line-height: 1.2; } .lp-rail li small { font-size: 11.5px; color: var(--lane-2); font-weight: 700; }
@media (min-width: 900px) { .lp-band-in { grid-template-columns: minmax(0, 1fr) 460px; align-items: center; padding: 26px 30px; } }
@media (prefers-reduced-motion: reduce) { .lp-band-in, .lp-rail::before, .lp-rail-coin { animation: none; } .lp-rail-coin { display: none; } }

/* Pagina de anunț: galerie fără JS (radio + :checked), fapte cu iconițe, panou de cumpărare lipicios cu defalcarea escrow, card vânzător */
.ld-note { display: flex; align-items: center; gap: 10px; margin: 8px 0 16px; padding: 12px 16px; border-radius: 10px; background: #fff7ed; border: 1px solid #fdba74; color: #9a3412; font-weight: 600; }
.ld-note i { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 9px; background: #fed7aa; flex: none; }
.ld-note svg { width: 17px; height: 17px; fill: none; stroke: #9a3412; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld { display: grid; gap: 24px; margin-top: 8px; }
.ld-gallery { position: relative; }
.ld-stage { position: relative; border-radius: 10px; overflow: hidden; background: linear-gradient(160deg, rgba(91,217,230,.14), rgba(91,217,230,.03)); aspect-ratio: 4 / 3; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 24px 50px -36px rgba(15,26,42,.45); }
.ld-shot { position: absolute; inset: 0; display: none; }
.ld-shot:only-of-type { display: block; }
/* imaginea stă „în ramă”, nu umple tot cadranul (cerut 2026-09-24): margine de aer, colțuri, umbră, mărire ușoară doar la hover */
.ld-shot { padding: 22px; box-sizing: border-box; }
.ld-shot img { width: 100%; height: 100%; object-fit: contain; display: block; border-radius: 8px; filter: drop-shadow(0 18px 24px rgba(15,26,42,.18)); transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.ld-shot:hover img { transform: scale(1.03); }
@media (max-width: 699px) { .ld-shot { padding: 14px; } }
.ld-gallery input:nth-of-type(1):checked ~ .ld-stage .ld-shot-1, .ld-gallery input:nth-of-type(2):checked ~ .ld-stage .ld-shot-2, .ld-gallery input:nth-of-type(3):checked ~ .ld-stage .ld-shot-3, .ld-gallery input:nth-of-type(4):checked ~ .ld-stage .ld-shot-4, .ld-gallery input:nth-of-type(5):checked ~ .ld-stage .ld-shot-5 { display: block; animation: hp-rise .3s ease-out; }
.ld-badge { position: absolute; left: 12px; top: 12px; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 8px; border-radius: 10px; background: rgba(255,255,255,.94); color: #0c7a79; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; box-shadow: 0 8px 18px -10px rgba(15,26,42,.5); }
.ld-badge svg { width: 15px; height: 15px; fill: none; stroke: #0c7a79; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-thumbs { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.ld-thumb { display: block; width: 88px; height: 66px; border-radius: 10px; overflow: hidden; border: 2px solid transparent; cursor: pointer; opacity: .7; transition: opacity .2s, border-color .2s, transform .2s; }
.ld-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ld-thumb:hover { opacity: 1; transform: translateY(-2px); }
.ld-gallery input:nth-of-type(1):checked ~ .ld-thumbs .ld-thumb-1, .ld-gallery input:nth-of-type(2):checked ~ .ld-thumbs .ld-thumb-2, .ld-gallery input:nth-of-type(3):checked ~ .ld-thumbs .ld-thumb-3, .ld-gallery input:nth-of-type(4):checked ~ .ld-thumbs .ld-thumb-4, .ld-gallery input:nth-of-type(5):checked ~ .ld-thumbs .ld-thumb-5 { opacity: 1; border-color: #5bd9e6; box-shadow: 0 0 0 3px rgba(91,217,230,.25); }
.ld-gallery input:focus-visible ~ .ld-thumbs label { outline: 2px solid #5bd9e6; outline-offset: 2px; }
.ld-title { font-size: clamp(26px, 3vw, 36px); letter-spacing: -.02em; margin: 22px 0 12px; line-height: 1.15; }
.ld-facts { list-style: none; margin: 0 0 22px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ld-facts li { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px 6px 6px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.1); font-size: 13px; font-weight: 700; color: var(--fg); }
.ld-facts i { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 8px; background: rgba(91,217,230,.16); }
.ld-facts svg { width: 14px; height: 14px; fill: none; stroke: #0c7a79; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-desc { padding: 22px 24px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 1px 2px rgba(15,26,42,.04); }
.ld-desc h2 { margin: 0 0 10px; font-size: 18px; }
.ld-desc p { margin: 0; line-height: 1.65; color: var(--fg); }
.ld-side { display: grid; gap: 14px; align-content: start; }
/* Panoul de cumpărare: „seif” de sticlă închisă cu chenar holografic, preț cu gradient, chitanță, puncte de încredere */
.ld-buy { position: relative; padding: 0 22px 20px; border-radius: 10px; color: var(--fg); background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 34px 60px -40px rgba(24,175,255,.45); }
.ld-seal { position: relative; display: grid; grid-template-columns: 46px 1fr auto; column-gap: 12px; align-items: center; margin: 0 -22px 18px; padding: 16px 22px; border-radius: 10px 10px 0 0; background: linear-gradient(120deg, rgba(91,217,230,.22), rgba(124,108,255,.14) 70%, rgba(24,175,255,.16)); border-bottom: 1px solid rgba(91,217,230,.35); }
.ld-seal i { display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 10px; background: linear-gradient(135deg, #9beef5, #5bd9e6 60%, #18afff); box-shadow: 0 10px 22px -10px rgba(24,175,255,.9), 0 0 0 5px rgba(255,255,255,.7); animation: hp-pulse 3s infinite; }
.ld-seal i svg { width: 24px; height: 24px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-seal span { font-size: 14px; font-weight: 900; color: var(--fg); letter-spacing: .01em; }
.ld-seal small { display: block; font-size: 11.5px; font-weight: 600; color: var(--muted); }
.ld-seal em.ld-ref { position: relative; display: grid; justify-items: center; gap: 2px; padding: 6px 12px 7px; border-radius: 10px; font-style: normal; background: #fff; border: 1px solid rgba(15,26,42,.1); box-shadow: 0 10px 22px -14px rgba(15,26,42,.45), inset 0 1px 0 #fff; }
.ld-seal em.ld-ref::before { content: ""; position: absolute; left: -5px; top: 50%; width: 9px; height: 9px; border-radius: 50%; background: #eef1f6; transform: translateY(-50%); box-shadow: inset 0 1px 2px rgba(15,26,42,.15); }
.ld-ref small { font-size: 9px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.ld-ref b { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 17px; font-weight: 800; letter-spacing: .02em; line-height: 1; background: linear-gradient(90deg, #0c7a79, #18afff); -webkit-background-clip: text; background-clip: text; color: transparent; font-variant-numeric: tabular-nums; }
.ld-seal i.ld-ref-bars { display: block; width: 100%; height: 8px; margin-top: 3px; box-shadow: none; animation: none; border-radius: 1px; background: repeating-linear-gradient(90deg, #0f1a2a 0 1px, transparent 1px 3px, #0f1a2a 3px 5px, transparent 5px 6px, #0f1a2a 6px 7px, transparent 7px 10px); opacity: .55; border-radius: 1px; }
.ld-buy-head { display: none; }
.ld-price { position: relative; margin: 2px 0 16px; font-size: 40px; font-weight: 900; letter-spacing: -.02em; line-height: 1.05; font-variant-numeric: tabular-nums; background: linear-gradient(90deg, #0f1a2a, #0c7a79 70%, #18afff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ld-buy-label { position: relative; margin: 0; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }

main.inner .ld-form { max-width: none; position: relative; }
main.inner .ld-cta, main.inner button.ld-cta { position: relative; width: 100%; margin: 0; justify-content: center; border-radius: 10px; padding: 15px 20px; font-size: 16px; background: linear-gradient(90deg, #5bd9e6, #18afff); color: #06201f; box-shadow: 0 16px 34px -14px rgba(24,175,255,.9); }
.ld-ticket { position: relative; margin: 18px -6px 0; padding: 14px 16px 16px; background: #f7f9fc; border-radius: 6px; }
.ld-ticket::before, .ld-ticket::after { content: ""; position: absolute; left: 0; right: 0; height: 8px; background: radial-gradient(circle at 6px 4px, #fff 4px, transparent 4.5px) 0 0 / 14px 8px repeat-x; }
.ld-ticket::before { top: -4px; transform: rotate(180deg); }
.ld-ticket::after { bottom: -4px; }
.ld-ticket-title { display: flex; align-items: center; gap: 7px; margin: 0 0 8px; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ld-ticket-title svg { width: 16px; height: 16px; fill: none; stroke: #0c7a79; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ld-split { position: relative; margin: 0; display: grid; gap: 7px; font-size: 14px; font-family: ui-monospace, Menlo, Consolas, monospace; }
.ld-split div { display: flex; justify-content: space-between; gap: 12px; }
.ld-split dt { color: var(--muted); font-family: inherit; }
.ld-split dd { margin: 0; font-weight: 700; color: var(--fg); font-variant-numeric: tabular-nums; }
.ld-split-total { padding-top: 8px; border-top: 1px dashed rgba(15,26,42,.25); }
.ld-split-total dt, .ld-split-total dd { color: #0c7a79; font-weight: 900; }
.ld-split-total dd { font-size: 17px; }
.ld-trust { position: relative; list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.ld-trust li { display: flex; align-items: flex-start; gap: 9px; font-size: 13px; color: var(--fg); line-height: 1.4; }
.ld-trust svg { flex: none; width: 24px; height: 24px; padding: 5px; box-sizing: border-box; border-radius: 8px; background: linear-gradient(135deg, rgba(91,217,230,.35), rgba(24,175,255,.25)); fill: none; stroke: #0c7a79; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-help { position: relative; margin: 12px 0 0; font-size: 12.5px; color: var(--muted); line-height: 1.5; }
.ld-help b { color: var(--fg); }
/* Vânzătorul: avatar cu inel gradient și insignă KYC */
.ld-seller-top { display: grid; grid-template-columns: 60px 1fr; column-gap: 14px; align-items: center; padding: 16px 18px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 40px -34px rgba(15,26,42,.35); transition: translate .2s, box-shadow .3s; }
.ld-seller-top:hover { translate: 0 -2px; box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 24px 44px -30px rgba(91,217,230,.6); }
.ld-avatar { position: relative; display: block; width: 60px; height: 60px; }
.ld-avatar i { display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 10px; font-style: normal; font-weight: 900; font-size: 22px; color: #06201f; background: linear-gradient(135deg, #9beef5, #5bd9e6) padding-box, conic-gradient(from var(--hp-a), #5bd9e6, #18afff, #7c6cff, #5bd9e6) border-box; border: 3px solid transparent; text-transform: uppercase; animation: hp-holo 6s linear infinite; }
.ld-avatar b { position: absolute; right: -3px; bottom: -3px; display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 10px; background: #0c7a79; box-shadow: 0 0 0 3px #fff; }
.ld-avatar b svg { width: 12px; height: 12px; fill: none; stroke: #fff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.ld-seller-top small { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ld-seller-top > div > b { display: block; font-size: 15.5px; color: var(--fg); margin: 2px 0; }
.ld-seller-top > div > span { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: #0c7a79; font-weight: 800; }
.ld-seller-top > div > span svg { width: 14px; height: 14px; fill: none; stroke: #0c7a79; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
/* Traseul escrow în trei pași, cu linie luminoasă */
/* antetul anunțului, refăcut 2026-09-24 („nu se văd bine, rămâne spațiu gol”): traseu mai mare cu uneltele
   la dreapta, eticheta „Anunț #id · stare”, faptele ca plăci etichetă + valoare pe toată lățimea, cardul de preț cu buton */
.ld-hero-top { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-bottom: 18px; }
.ld-hero-top .ld-trail { margin: 0; font-size: 14px; }
.ld-hero-top .ld-trail a { padding: 8px 14px; }
.ld-hero-top .ld-tools { margin: 0; }
.ld-kicker { margin: 0 0 8px; }
.ld-kicker .hp-eyebrow-fancy b { margin-left: 2px; padding: 2px 8px; border-radius: 6px; background: linear-gradient(135deg, #5bd9e6, #18afff); color: #06201f; font-size: 11px; }
.ld-hero-txt { min-width: 0; }
.ld-hero-txt .ld-title { margin: 0 0 16px; font-size: clamp(28px, 3.2vw, 40px); }
.ld-facts.ld-facts2 { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 0; }
.ld-facts2 li { --lane: #5bd9e6; --lane-l: #9beef5; --lane-2: #0c7a79; display: grid; grid-template-columns: 38px 1fr; column-gap: 10px; align-items: center; padding: 8px 12px 8px 8px; border-radius: 10px; background: #fff; border: 1px solid color-mix(in srgb, var(--lane) 32%, #e6ebf2); box-shadow: 0 10px 20px -18px color-mix(in srgb, var(--lane) 80%, rgba(15,26,42,.3)); font-size: 14px; }
.ld-facts2 li.hp-lane-seller { --lane: #2b7fd6; --lane-l: #9dd0ff; --lane-2: #1b5aa3; } .ld-facts2 li.hp-lane-us { --lane: #7c6cff; --lane-l: #c4b8ff; --lane-2: #4b3fd6; }
.ld-facts2 i { width: 38px; height: 38px; border-radius: 9px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 8px 14px -8px var(--lane); }
.ld-facts2 svg { width: 18px; height: 18px; stroke: #06201f; }
.ld-facts2 span { display: grid; min-width: 0; }
.ld-facts2 small { font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--lane-2); }
.ld-facts2 b { font-size: 14px; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ld-facts2 b em { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; margin-left: 2px; border-radius: 5px; background: #16a34a; vertical-align: -2px; }
.ld-facts2 b em svg { width: 9px; height: 9px; stroke: #fff; stroke-width: 3.2; }
/* „Plată prin escrow” în antet (2026-09-24, fără casetă — „casetă în casetă e ca naiba”): o mini-hartă SVG
   tu → seif → vânzător cu moneda în mișcare (SMIL) și lacăt, text cu gradient, garanțiile cu bife care se desenează */
.ld-escrow { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px 22px; align-items: center; margin-top: 2px; }
.ld-esc-map { display: block; width: 100%; max-width: 300px; height: auto; overflow: visible; }
.ld-esc-map text { font-family: "Reddit Sans", system-ui, sans-serif; }
.ld-esc-line { animation: ft-dash .9s linear infinite; stroke-dashoffset: 0; }
@keyframes ld-esc-halo { 0%, 100% { r: 24px; opacity: .35; } 50% { r: 30px; opacity: .7; } }
.ld-esc-halo { animation: ld-esc-halo 3s ease-in-out infinite; }
.ld-esc-lock { transform-box: fill-box; transform-origin: center; animation: ld-esc-lock 3s ease-in-out infinite; }
@keyframes ld-esc-lock { 0%, 100% { translate: 0 0; } 50% { translate: 0 -2px; } }
.ld-esc-coin circle, .ld-esc-coin text { filter: drop-shadow(0 4px 4px rgba(255,181,71,.6)); }
.ld-escrow-txt { min-width: 0; }
.ld-escrow-txt > b { display: block; font-size: 20px; letter-spacing: -.01em; }
.ld-escrow-txt > span { display: block; margin-top: 2px; font-size: 14px; line-height: 1.5; color: var(--muted); max-width: 56ch; }
.ld-escrow-chips { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.ld-escrow-chips li { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 700; color: var(--fg); }
.ld-escrow-chips i { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 7px; background: linear-gradient(135deg, #34d399, #16a34a); box-shadow: 0 6px 12px -6px #16a34a; }
.ld-escrow-chips svg { width: 12px; height: 12px; fill: none; stroke: #fff; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-escrow-chips path { stroke-dasharray: 100; stroke-dashoffset: 100; animation: hp-draw .6s ease-out forwards; }
.ld-escrow-chips li:nth-child(1) path { animation-delay: .4s; } .ld-escrow-chips li:nth-child(2) path { animation-delay: .8s; } .ld-escrow-chips li:nth-child(3) path { animation-delay: 1.2s; }
@media (min-width: 700px) { .ld-escrow { grid-template-columns: 260px minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .ld-esc-line, .ld-esc-halo, .ld-esc-lock { animation: none; } .ld-esc-coin { display: none; } .ld-escrow-chips path { animation: none; stroke-dashoffset: 0; } }
.ld-hero-price { align-self: stretch; align-content: start; gap: 4px; padding: 18px 20px; border: 1px solid transparent; background: linear-gradient(160deg, #fff, #f3f9ff 55%, #f5f2ff) padding-box, conic-gradient(from var(--hp-a), #5bd9e6, #18afff 35%, #7c6cff 60%, #5bd9e6) border-box; animation: hp-holo 10s linear infinite; }
.ld-hero-price b { font-size: clamp(32px, 3.2vw, 42px); }
main.inner .ld-hero-cta { justify-self: stretch; justify-content: center; margin-top: 12px; }
.ld-hero-note { display: block; margin-top: 8px; font-size: 12px; line-height: 1.4; color: var(--muted); }
@media (min-width: 900px) { .ld-hero-row { grid-template-columns: minmax(0, 1fr) 320px; gap: 28px; align-items: start; } .ld-hero-main { grid-template-columns: 84px minmax(0, 1fr); } }
@media (max-width: 899px) { .ld-hero .ld-hero-main { grid-template-columns: minmax(0, 1fr); row-gap: 10px; } .ld-facts.ld-facts2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .ld-facts2 li { padding: 6px 8px 6px 6px; } .ld-facts2 i { width: 32px; height: 32px; } .ld-facts2 svg { width: 15px; height: 15px; } .ld-facts2 b { font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { .ld-hero-price { animation: none; } }
/* galeria: imaginile se deschid în pagină, într-un „slider” pe tot ecranul (2026-09-24). Fără JS merge prin
   :target (#foto-N); cu JS site.js pune .is-open, preia tastele, swipe-ul și nu mai schimbă adresa. */
.ld-zoom { position: absolute; right: 12px; bottom: 12px; z-index: 2; display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 8px; background: rgba(15,26,42,.75); color: #fff; font-size: 11.5px; font-weight: 700; backdrop-filter: blur(6px); pointer-events: none; }
.ld-zoom svg { width: 14px; height: 14px; fill: none; stroke: #7ff0ee; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-shot { cursor: zoom-in; }
.ld-lb-slide { display: none; position: fixed; inset: 0; z-index: 120; grid-template-rows: auto 1fr auto; align-items: center; justify-items: center; padding: 16px; box-sizing: border-box; background: rgba(8,14,26,.94); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: #fff; }
.ld-lb-slide:target, .ld-lb-slide.is-open { display: grid; animation: ld-lb-in .22s ease-out; }
body:has(.ld-lb-slide:target), body:has(.ld-lb-slide.is-open) { overflow: hidden; }
@keyframes ld-lb-in { from { opacity: 0; } to { opacity: 1; } }
.ld-lb-fig { grid-row: 2; margin: 0; display: grid; justify-items: center; gap: 10px; max-width: 100%; max-height: 100%; min-height: 0; animation: ld-lb-zoom .28s cubic-bezier(.2,.9,.3,1.2); }
@keyframes ld-lb-zoom { from { opacity: 0; scale: .94; } to { opacity: 1; scale: 1; } }
.ld-lb-fig img { display: block; width: auto; height: auto; max-width: min(94vw, 1500px); max-height: calc(100vh - 170px); object-fit: contain; border-radius: 10px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.9), 0 0 0 1px rgba(255,255,255,.08); background: #0f1a2a; }
.ld-lb-fig figcaption { max-width: 70ch; font-size: 13.5px; color: #b7c3d3; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ld-lb-close, .ld-lb-nav { position: absolute; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 10px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); color: #fff; text-decoration: none; backdrop-filter: blur(8px); transition: background .2s, transform .2s, border-color .2s; }
.ld-lb-close:hover, .ld-lb-nav:hover { background: rgba(91,217,230,.22); border-color: rgba(91,217,230,.6); text-decoration: none; color: #fff; }
.ld-lb-close { top: 16px; right: 16px; } .ld-lb-close:hover { transform: rotate(90deg); }
.ld-lb-close svg, .ld-lb-nav svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.ld-lb-nav { top: 50%; translate: 0 -50%; } .ld-lb-prev { left: 16px; } .ld-lb-next { right: 16px; }
.ld-lb-prev:hover { transform: translateX(-3px); } .ld-lb-next:hover { transform: translateX(3px); }
.ld-lb-count { grid-row: 1; justify-self: start; padding: 6px 12px; border-radius: 8px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 13px; font-weight: 800; color: #7ff0ee; }
.ld-lb-thumbs { grid-row: 3; display: flex; gap: 8px; max-width: 100%; padding: 4px; overflow-x: auto; scrollbar-width: thin; }
.ld-lb-thumbs a { flex: none; display: block; width: 72px; height: 54px; border-radius: 8px; overflow: hidden; border: 2px solid transparent; opacity: .55; transition: opacity .2s, border-color .2s, transform .2s; }
.ld-lb-thumbs a:hover { opacity: 1; transform: translateY(-2px); }
.ld-lb-thumbs a.is-on { opacity: 1; border-color: #5bd9e6; box-shadow: 0 0 0 3px rgba(91,217,230,.25); }
.ld-lb-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 699px) { .ld-lb-slide { padding: 12px; } .ld-lb-close, .ld-lb-nav { width: 42px; height: 42px; } .ld-lb-nav { top: auto; bottom: 84px; translate: none; } .ld-lb-fig img { max-height: calc(100vh - 190px); } .ld-lb-fig figcaption { font-size: 12.5px; } }
@media (prefers-reduced-motion: reduce) { .ld-lb-slide:target, .ld-lb-slide.is-open, .ld-lb-fig { animation: none; } }
/* termenul de inspecție pe pagina tranzacției (2026-09-24) */
.tx-inspect { display: inline-flex; align-items: center; gap: 5px; margin-top: 4px; padding: 3px 8px; border-radius: 6px; background: rgba(91,217,230,.14); color: #0c7a79; font-weight: 700; }
.tx-ship .tx-inspect svg, .tx-inspect svg { position: static; flex: none; width: 12px; height: 12px; margin: 0; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.tx-inspect.is-over { background: rgba(255,181,71,.18); color: #b45309; }
/* ---- paginile legale (2026-09-24): termeni, confidențialitate, cookie-uri — antet-panou, cuprins lipicios, secțiuni numerotate ---- */
.lx-hero { position: relative; overflow: hidden; margin: 8px 0 18px; padding: 22px 22px 24px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 30px 60px -44px rgba(15,26,42,.35); }
.lx-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(560px 300px at 88% 0%, rgba(91,217,230,.26), transparent 65%), radial-gradient(460px 280px at 4% 100%, rgba(124,108,255,.18), transparent 65%); pointer-events: none; }
.lx-hero::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, #5bd9e6, #18afff 50%, #7c6cff); }
.lx-hero > * { position: relative; }
.lx-hero-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
.lx-hero-main { min-width: 0; }
.lx-hero h1 { margin: 12px 0 8px; font-size: clamp(28px, 3.4vw, 42px); letter-spacing: -.02em; }
.lx-meta { margin-top: 14px; }
.lx-note { display: flex; gap: 8px; align-items: flex-start; margin: 12px 0 0; padding: 10px 12px; border-radius: 8px; background: rgba(255,181,71,.14); border: 1px solid rgba(255,181,71,.45); color: #7c2d12; font-size: 13px; line-height: 1.45; }
.lx-note svg { flex: none; width: 16px; height: 16px; margin-top: 1px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lx-legal-nav { display: grid; gap: 8px; align-content: start; }
.lx-legal-nav a { --lane: #5bd9e6; --lane-l: #9beef5; --lane-2: #0c7a79; display: grid; grid-template-columns: 38px 1fr; column-gap: 10px; align-items: center; padding: 8px 12px 8px 8px; border-radius: 10px; background: rgba(255,255,255,.85); border: 1px solid rgba(15,26,42,.1); color: var(--fg); text-decoration: none; transition: border-color .2s, translate .2s, box-shadow .3s; }
.lx-legal-nav a:nth-child(2) { --lane: #18afff; --lane-l: #9dd0ff; --lane-2: #1b5aa3; } .lx-legal-nav a:nth-child(3) { --lane: #7c6cff; --lane-l: #c4b8ff; --lane-2: #4b3fd6; }
.lx-legal-nav i { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 9px; background: color-mix(in srgb, var(--lane) 16%, #fff); }
.lx-legal-nav svg { width: 18px; height: 18px; fill: none; stroke: var(--lane-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lx-legal-nav span { display: grid; min-width: 0; } .lx-legal-nav b { font-size: 13.5px; } .lx-legal-nav small { font-size: 11.5px; color: var(--muted); }
.lx-legal-nav a:hover { border-color: var(--lane); translate: 0 -2px; box-shadow: 0 14px 24px -18px var(--lane); text-decoration: none; }
.lx-legal-nav a.is-on { border-color: transparent; background: linear-gradient(135deg, var(--lane-2), var(--lane)); color: #fff; box-shadow: 0 14px 24px -14px var(--lane); }
.lx-legal-nav a.is-on i { background: rgba(255,255,255,.2); } .lx-legal-nav a.is-on svg { stroke: #fff; } .lx-legal-nav a.is-on small { color: rgba(255,255,255,.8); }
@media (min-width: 900px) { .lx-hero { padding: 26px 34px 30px; } .lx-hero-row { grid-template-columns: minmax(0, 1fr) 300px; gap: 32px; align-items: start; } }
.lx { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; margin-bottom: 28px; }
.lx-toc { align-self: start; padding: 14px 16px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 40px -32px rgba(15,26,42,.35); }
.lx-toc-h { margin: 0 0 8px; font-size: 11.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.lx-toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.lx-toc a { display: block; padding: 5px 8px; border-radius: 6px; font-size: 13px; font-weight: 700; color: var(--fg); text-decoration: none; transition: background .15s, color .15s; }
.lx-toc a:hover { background: rgba(91,217,230,.14); color: #0c7a79; text-decoration: none; }
.lx-body { min-width: 0; display: grid; gap: 14px; }
.lx-summary { padding: 18px 20px; border-radius: 10px; border: 1px solid transparent; background: linear-gradient(160deg, #fff, #f3f9ff 55%, #f5f2ff) padding-box, conic-gradient(from var(--hp-a), #5bd9e6, #18afff 35%, #7c6cff 60%, #5bd9e6) border-box; box-shadow: 0 20px 40px -32px rgba(24,175,255,.6); animation: hp-holo 12s linear infinite; }
.lx-summary h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; font-size: 18px; }
.lx-summary h2 i { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 9px; background: linear-gradient(135deg, #ffe08a, #ffb547); }
.lx-summary h2 svg { width: 17px; height: 17px; fill: none; stroke: #7a4a00; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lx-summary > p { margin: 0 0 10px; font-size: 13.5px; color: var(--muted); }
.lx-summary-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.lx-summary-list li { position: relative; padding: 8px 12px 8px 36px; border-radius: 8px; background: rgba(255,255,255,.8); border: 1px solid rgba(91,217,230,.35); font-size: 14px; line-height: 1.5; color: var(--muted); }
.lx-summary-list li b { color: var(--fg); }
.lx-summary-list li::before { content: ""; position: absolute; left: 10px; top: 11px; width: 16px; height: 16px; border-radius: 5px; background: linear-gradient(135deg, #34d399, #16a34a) no-repeat center / 10px 10px; }
.lx-summary-list li::after { content: ""; position: absolute; left: 14px; top: 15px; width: 6px; height: 3px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); }
.lx-sec { min-width: 0; padding: 20px 22px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 40px -32px rgba(15,26,42,.35); scroll-margin-top: 90px; }
.lx-sec h2 { display: flex; align-items: center; gap: 12px; margin: 0 0 10px; font-size: 19px; letter-spacing: -.01em; }
.lx-sec h2 span { display: flex; align-items: center; justify-content: center; flex: none; width: 34px; height: 34px; border-radius: 9px; background: linear-gradient(135deg, #9beef5, #5bd9e6 60%, #18afff); color: #06201f; font-size: 13px; font-weight: 900; font-variant-numeric: tabular-nums; }
.lx-sec:nth-of-type(3n+1) h2 span { background: linear-gradient(135deg, #9dd0ff, #18afff); } .lx-sec:nth-of-type(3n+2) h2 span { background: linear-gradient(135deg, #c4b8ff, #7c6cff); color: #fff; }
.lx-sec p, .lx-sec li { font-size: 15px; line-height: 1.65; color: var(--fg); }
.lx-sec p { margin: 0 0 10px; } .lx-sec p:last-child { margin-bottom: 0; }
.lx-sec ul, .lx-sec ol { margin: 0 0 10px; padding-left: 22px; display: grid; gap: 6px; }
.lx-sec ul:last-child, .lx-sec ol:last-child { margin-bottom: 0; }
.lx-sec li::marker { color: #0c7a79; font-weight: 800; }
.lx-sec a { font-weight: 700; color: #0c7a79; }
.lx-steps { list-style: none; padding: 0; counter-reset: lxs; }
.lx-steps li { position: relative; padding: 10px 12px 10px 48px; border-radius: 8px; background: #f7f9fc; border: 1px solid rgba(15,26,42,.08); counter-increment: lxs; }
.lx-steps li::before { content: counter(lxs); position: absolute; left: 10px; top: 10px; width: 26px; height: 26px; border-radius: 7px; background: linear-gradient(135deg, #9beef5, #5bd9e6); color: #06201f; font-size: 12px; font-weight: 900; line-height: 26px; text-align: center; }
.lx-warn { display: grid; grid-template-columns: 40px 1fr; column-gap: 12px; align-items: start; margin: 12px 0; padding: 14px 16px; border-radius: 10px; background: linear-gradient(135deg, rgba(255,181,71,.14), rgba(255,224,138,.2)); border: 1px solid rgba(255,181,71,.5); }
.lx-warn i { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: linear-gradient(135deg, #ffe08a, #ffb547); }
.lx-warn svg { width: 20px; height: 20px; fill: none; stroke: #7a4a00; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lx-warn div { font-size: 14.5px; line-height: 1.55; color: #7c2d12; } .lx-warn b { color: #7c2d12; }
.lx-table-wrap { overflow-x: auto; max-width: 100%; margin: 0 0 10px; -webkit-overflow-scrolling: touch; }
.lx-table { min-width: 560px; }
.lx-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; }
.lx-table th, .lx-table td { padding: 9px 12px; text-align: left; vertical-align: top; border-bottom: 1px solid rgba(15,26,42,.08); line-height: 1.5; }
.lx-table th { font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); background: #f7f9fc; }
.lx-table th:first-child { border-radius: 8px 0 0 0; } .lx-table th:last-child { border-radius: 0 8px 0 0; }
.lx-table code, .lx-sec code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 13px; padding: 1px 6px; border-radius: 5px; background: rgba(91,217,230,.14); color: #0c7a79; }
.lx-company { margin-top: 14px; padding: 16px 18px; border-radius: 10px; background: linear-gradient(160deg, #fff, #f3f9ff 55%, #f5f2ff); border: 1px solid rgba(24,175,255,.3); }
.lx-company-h { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--fg); }
.lx-company-h i { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 7px; background: linear-gradient(135deg, #9dd0ff, #18afff); }
.lx-company-h svg { width: 14px; height: 14px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lx-company dl { margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px 16px; }
.lx-company dl div { display: grid; gap: 1px; } .lx-company dt { font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); } .lx-company dd { margin: 0; font-size: 14px; font-weight: 700; overflow-wrap: anywhere; }
@media (min-width: 1000px) { .lx { grid-template-columns: 260px minmax(0, 1fr); gap: 24px; } .lx-toc { position: sticky; top: 84px; max-height: calc(100vh - 100px); overflow: auto; } }
@media (prefers-reduced-motion: reduce) { .lx-summary { animation: none; } }
/* ---- engleză (2026-09-25): legendele desenate din CSS urmează <html lang> ---- */
html[lang="en"] main.inner .ld-tools .ld-tool.is-done span::after { content: " ✓ copied"; }
html[lang="en"] .txm-initiated .txm-cap-buyer::after { content: "transfers the money"; }
html[lang="en"] .txm-initiated .txm-cap-vault::after { content: "empty vault"; }
html[lang="en"] .txm-awaiting_payment .txm-cap-buyer::after { content: "declared payment"; }
html[lang="en"] .txm-awaiting_payment .txm-cap-vault::after { content: "we check the statement"; }
html[lang="en"] .txm-payment_confirmed .txm-cap-vault::after, html[lang="en"] .txm-shipped .txm-cap-vault::after, html[lang="en"] .txm-completed .txm-cap-vault::after { content: "money in escrow"; }
html[lang="en"] .txm-payment_confirmed .txm-cap-seller::after { content: "ships the parcel"; }
html[lang="en"] .txm-shipped .txm-cap-seller::after { content: "shipped"; }
html[lang="en"] .txm-shipped .txm-cap-buyer::after { content: "confirms on receipt"; }
html[lang="en"] .txm-completed .txm-cap-buyer::after { content: "received ✓"; }
html[lang="en"] .txm-completed .txm-cap-seller::after { content: "awaits the money"; }
html[lang="en"] .txm-released .txm-cap-vault::after { content: "money released"; }
html[lang="en"] .txm-released .txm-cap-seller::after { content: "got the money ✓"; }
html[lang="en"] .txm-released .txm-cap-buyer::after { content: "received ✓"; }
html[lang="en"] .txm-refunded .txm-cap-vault::after { content: "money goes back"; }
html[lang="en"] .txm-refunded .txm-cap-buyer::after { content: "gets the money back"; }
html[lang="en"] .txm-cancelled .txm-cap-vault::after { content: "transaction cancelled"; }
/* pagina anunțului (2026-09-24): unelte în antet, fișa vânzătorului cu cifre, traseul cu monedă, întrebări */
.ld-tools { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0 0; }
main.inner .ld-tools .ld-tool { margin: 0; display: inline-flex; align-items: center; gap: 6px; width: auto; height: 32px; box-sizing: border-box; line-height: 1; padding: 0 12px; border-radius: 8px; background: rgba(255,255,255,.85); border: 1px solid rgba(15,26,42,.12); color: var(--muted); font: inherit; font-size: 12.5px; font-weight: 700; text-decoration: none; cursor: pointer; transition: border-color .2s, color .2s, translate .2s; }
main.inner .ld-tools .ld-tool svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
main.inner .ld-tools .ld-tool:hover { border-color: #5bd9e6; color: #0c7a79; translate: 0 -1px; text-decoration: none; background: #fff; }
main.inner .ld-tools .ld-tool.is-done { border-color: #5bd9e6; background: rgba(91,217,230,.16); color: #0c7a79; }
main.inner .ld-tools .ld-tool .ct-copy-ok { display: none; } main.inner .ld-tools .ld-tool.is-done .ct-copy-ok { display: block; stroke: #0c7a79; } main.inner .ld-tools .ld-tool.is-done .ct-copy-ic { display: none; } main.inner .ld-tools .ld-tool.is-done span::after { content: " ✓ copiat"; }
html:not(.js) main.inner button.ld-tool { display: none; }
.ld-seller { display: grid; gap: 12px; padding: 16px 18px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 40px -32px rgba(15,26,42,.35); }
.ld-seller-top { padding: 0; border: 0; background: none; box-shadow: none; }
.ld-seller-top:hover { translate: none; box-shadow: none; }
.ld-seller-stats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ld-seller-stats li { --lane: #5bd9e6; --lane-l: #9beef5; --lane-2: #0c7a79; display: grid; justify-items: center; gap: 4px; padding: 10px 6px; border-radius: 10px; text-align: center; background: linear-gradient(180deg, color-mix(in srgb, var(--lane) 10%, #fff), #fff); border: 1px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); }
.ld-seller-stats li.is-blue { --lane: #18afff; --lane-l: #9dd0ff; --lane-2: #1b5aa3; } .ld-seller-stats li.is-violet { --lane: #7c6cff; --lane-l: #c4b8ff; --lane-2: #4b3fd6; }
.ld-seller-stats i { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ld-seller-stats svg { width: 15px; height: 15px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-seller-stats span { display: grid; min-width: 0; }
@media (max-width: 479px) { .ld-seller-stats { grid-template-columns: 1fr; } .ld-seller-stats li { grid-template-columns: 30px 1fr; column-gap: 10px; justify-items: start; text-align: left; } } .ld-seller-stats small { font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--lane-2); } .ld-seller-stats b { font-size: 14px; line-height: 1.2; }
.ld-seller-note { display: flex; gap: 8px; margin: 0; padding: 10px 12px; border-radius: 8px; background: rgba(124,108,255,.08); color: var(--muted); font-size: 12.5px; line-height: 1.45; }
.ld-seller-note svg { flex: none; width: 16px; height: 16px; margin-top: 1px; fill: none; stroke: #7c6cff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ld-flow { padding: 16px 18px 18px; border-radius: 10px; border: 1px solid transparent; background: linear-gradient(160deg, #fff, #f3f9ff 55%, #f5f2ff) padding-box, conic-gradient(from var(--hp-a), #5bd9e6, #18afff 35%, #7c6cff 60%, #5bd9e6) border-box; box-shadow: 0 20px 40px -32px rgba(24,175,255,.6); animation: hp-holo 10s linear infinite; }
.ld-flow-h { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--fg); }
.ld-flow-h i { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 7px; background: linear-gradient(135deg, #9beef5, #5bd9e6); }
.ld-flow-h svg { width: 14px; height: 14px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-rail2 { margin-top: 8px; } .ld-rail2 li { padding: 0 4px 10px; } .ld-rail2 li b { font-size: 12.5px; } .ld-rail2 li small { font-size: 11px; }
@media (prefers-reduced-motion: reduce) { .ld-flow { animation: none; } }
.ld-faq { margin-top: 18px; padding: 18px 20px 12px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 40px -32px rgba(15,26,42,.35); }
.ld-faq h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 17px; }
.ld-faq h2 i { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 9px; background: linear-gradient(135deg, #c4b8ff, #7c6cff); }
.ld-faq h2 svg { width: 17px; height: 17px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-q { --lane: #5bd9e6; --lane-l: #9beef5; --lane-2: #0c7a79; margin: 0 0 8px; border-radius: 10px; border: 1px solid rgba(15,26,42,.08); background: #fff; transition: border-color .25s, box-shadow .25s; }
.ld-q.is-blue { --lane: #18afff; --lane-l: #9dd0ff; --lane-2: #1b5aa3; } .ld-q.is-violet { --lane: #7c6cff; --lane-l: #c4b8ff; --lane-2: #4b3fd6; } .ld-q.is-amber { --lane: #ffb547; --lane-l: #ffd699; --lane-2: #b45309; }
.ld-q[open] { border-color: color-mix(in srgb, var(--lane) 55%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lane) 14%, transparent); }
.ld-q summary { display: grid; grid-template-columns: 34px 1fr 24px; column-gap: 12px; align-items: center; padding: 10px 12px; list-style: none; cursor: pointer; font-weight: 800; font-size: 14.5px; }
.ld-q summary::-webkit-details-marker { display: none; }
.ld-q summary i { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; background: color-mix(in srgb, var(--lane) 14%, #fff); transition: background .25s; }
.ld-q summary svg { width: 17px; height: 17px; fill: none; stroke: var(--lane-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: stroke .25s; }
.ld-q[open] summary i { background: linear-gradient(135deg, var(--lane-l), var(--lane)); } .ld-q[open] summary svg { stroke: #06201f; }
.ld-q summary b { position: relative; width: 24px; height: 24px; border-radius: 7px; background: rgba(15,26,42,.05); }
.ld-q summary b::before, .ld-q summary b::after { content: ""; position: absolute; left: 7px; top: 11px; width: 10px; height: 2px; border-radius: 2px; background: var(--fg); transition: transform .25s; }
.ld-q summary b::after { transform: rotate(90deg); } .ld-q[open] summary b::after { transform: rotate(0); }
.ld-q p { margin: 0; padding: 0 12px 12px 58px; font-size: 14px; line-height: 1.55; color: var(--muted); }
.ld-q p b { color: var(--fg); } .ld-q code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px; color: var(--fg); }
.ld-head { margin: 6px 0 4px; }
.ld-head .ld-title { margin: 6px 0 12px; }
.ld-stage-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; aspect-ratio: auto; min-height: 300px; padding: 28px 16px; box-sizing: border-box; background: radial-gradient(120% 90% at 50% 100%, rgba(91,217,230,.26), rgba(91,217,230,.05) 60%); }
.ld-stage-empty i { display: flex; align-items: center; justify-content: center; width: 120px; height: 120px; border-radius: 10px; background: linear-gradient(135deg, #9beef5, #5bd9e6); box-shadow: 0 26px 40px -18px rgba(91,217,230,.9), inset 0 2px 0 rgba(255,255,255,.7); animation: hp-float 6s ease-in-out infinite; }
.ld-stage-empty i svg { width: 60px; height: 60px; fill: none; stroke: #06201f; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ld-stage-empty > span:not(.ld-badge) { font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #0c7a79; }
.ld-stage-empty em { font-style: normal; font-size: 13px; color: var(--muted); }
.ld-desc h2 { display: flex; align-items: center; gap: 10px; }
.ld-desc h2 i { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 10px; background: rgba(91,217,230,.16); }
.ld-desc h2 svg { width: 17px; height: 17px; fill: none; stroke: #0c7a79; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ld-similar { margin-top: 44px; padding-top: 32px; border-top: 1px solid rgba(15,26,42,.08); }
.ld-similar .lp-head h2 { margin: 10px 0 0; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -.02em; }
/* Antetul anunțului: panou închis cu titlu, fapte de sticlă și prețul; galeria și panoul de cumpărare urcă peste el */
.ld-hero { position: relative; overflow: hidden; margin: 8px 0 0; padding: 22px 22px 70px; border-radius: 10px; color: var(--fg); background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 30px 60px -44px rgba(15,26,42,.35); }
.ld-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(560px 300px at 88% 0%, rgba(91,217,230,.28), transparent 65%), radial-gradient(460px 280px at 4% 100%, rgba(124,108,255,.18), transparent 65%), radial-gradient(400px 240px at 50% 120%, rgba(24,175,255,.14), transparent 65%); pointer-events: none; }
.ld-hero::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, #5bd9e6, #18afff 50%, #7c6cff); }
.ld-trail { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-bottom: 14px; font-size: 13px; }
.ld-trail a { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 10px; background: rgba(255,255,255,.8); border: 1px solid rgba(15,26,42,.1); color: var(--muted); font-weight: 700; text-decoration: none; transition: color .2s, border-color .2s, background .2s; }
.ld-trail a:hover { color: var(--fg); border-color: #5bd9e6; background: #fff; text-decoration: none; }
.ld-trail a.is-here { color: #0c7a79; background: rgba(91,217,230,.16); border-color: rgba(91,217,230,.5); }
.ld-trail svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-trail i { font-style: normal; color: #9fb0c4; padding: 0 2px; }
.ld-hero-main { position: relative; display: grid; grid-template-columns: 64px 1fr; column-gap: 16px; align-items: start; }
.ld-orb { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 10px; background: linear-gradient(135deg, #9beef5, #5bd9e6 60%, #18afff); box-shadow: 0 18px 30px -14px rgba(24,175,255,.9), inset 0 2px 0 rgba(255,255,255,.7); animation: hp-float 6s ease-in-out infinite; }
.ld-orb svg { width: 34px; height: 34px; fill: none; stroke: #06201f; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.ld-hero .ld-facts li i { background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ld-hero .ld-facts li svg { stroke: #06201f; }
.ld-hero-mark { position: absolute; right: -20px; bottom: -30px; width: 240px; height: 240px; fill: none; stroke: rgba(91,217,230,.16); stroke-width: 1; pointer-events: none; }
.ld-crumbs, .ld-crumbs a { color: var(--muted); position: relative; }
.ld-crumbs a:hover { color: var(--fg); }
.ld-hero-row { position: relative; display: grid; gap: 18px; align-items: end; }
.ld-hero .ld-title { margin: 4px 0 12px; color: var(--fg); font-size: clamp(26px, 3.2vw, 40px); }
.ld-hero .ld-facts { margin: 0; }
.ld-hero .ld-facts li { background: rgba(255,255,255,.8); border-color: rgba(15,26,42,.1); color: var(--fg); }
.ld-hero-price { display: grid; justify-items: start; gap: 2px; padding: 14px 18px; border-radius: 10px; background: rgba(255,255,255,.85); border: 1px solid rgba(15,26,42,.1); box-shadow: 0 20px 40px -30px rgba(15,26,42,.4); backdrop-filter: blur(6px); }
.ld-hero-price span { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ld-hero-price b { font-size: clamp(28px, 3vw, 38px); font-weight: 900; letter-spacing: -.02em; line-height: 1.05; font-variant-numeric: tabular-nums; background: linear-gradient(90deg, #0f1a2a, #0c7a79); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ld-hero-price em { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; font-style: normal; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #06201f; background: linear-gradient(135deg, #9beef5, #5bd9e6); border-radius: 10px; padding: 4px 10px 4px 7px; }
.ld-hero-price em svg { width: 13px; height: 13px; fill: none; stroke: #06201f; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.ld { margin: -48px 14px 0; position: relative; }
.ld-stage { border: 1px solid transparent; background: linear-gradient(#f7f9fc, #f7f9fc) padding-box, conic-gradient(from var(--hp-a), rgba(91,217,230,.35), #5bd9e6 30%, rgba(91,217,230,.35) 55%, #7c6cff 80%, rgba(91,217,230,.35)) border-box; animation: hp-holo 9s linear infinite; }
.ld-desc, .ld-details { position: relative; padding: 22px 24px 22px 28px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 40px -34px rgba(15,26,42,.35); margin-top: 18px; }
.ld-desc::before, .ld-details::before { content: ""; position: absolute; left: 0; top: 22px; bottom: 22px; width: 4px; border-radius: 0 4px 4px 0; background: linear-gradient(180deg, #5bd9e6, #7c6cff); }
.ld-desc-body { font-size: 16.5px; line-height: 1.75; color: var(--fg); }
.ld-desc-body p { margin: 0 0 14px; white-space: pre-line; }
.ld-desc-body p:first-child { font-size: 18px; font-weight: 600; color: #0f1a2a; }
.ld-desc-body p:last-child { margin-bottom: 0; }
.ld-details h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 18px; }
.ld-details h2 i { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 10px; background: rgba(124,108,255,.14); }
.ld-details h2 svg { width: 17px; height: 17px; fill: none; stroke: #4b3fd6; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ld-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ld-tile { position: relative; display: grid; grid-template-columns: 36px 1fr; column-gap: 10px; align-items: center; padding: 12px 12px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 10%, #fff), #fff 70%); border: 1px solid color-mix(in srgb, var(--lane) 22%, #e6ebf2); transition: translate .2s, box-shadow .3s, border-color .3s; overflow: hidden; }
.ld-tile::after { content: ""; position: absolute; right: -30px; top: -30px; width: 90px; height: 90px; border-radius: 10px; background: color-mix(in srgb, var(--lane) 12%, transparent); pointer-events: none; }
.ld-tile:hover { translate: 0 -3px; border-color: var(--lane); box-shadow: 0 18px 30px -22px color-mix(in srgb, var(--lane) 70%, rgba(15,26,42,.3)); }
.ld-tile i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 8px 16px -8px color-mix(in srgb, var(--lane) 85%, transparent); }
.ld-tile i svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-tile span { font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ld-tile b { font-size: 14px; color: var(--fg); line-height: 1.3; }
.ld-tile b a { color: var(--lane-2); }
.ld-tile em { display: inline-block; margin-left: 6px; font-style: normal; font-size: 9.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #0c7a79; background: rgba(91,217,230,.18); border-radius: 10px; padding: 2px 7px; vertical-align: middle; }
.ld-details dl { margin: 0; display: grid; gap: 8px; }
.ld-details dl div { display: grid; grid-template-columns: 110px 1fr; gap: 10px; padding: 10px 12px; border-radius: 10px; background: #f7f9fc; font-size: 14px; }
.ld-details dt { color: var(--muted); font-weight: 600; }
.ld-details dd { margin: 0; font-weight: 700; color: var(--fg); }
.ld-details dd a { color: #0c7a79; }
.ld-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(255,255,255,.94); backdrop-filter: blur(10px); border-top: 1px solid rgba(15,26,42,.1); box-shadow: 0 -12px 30px -20px rgba(15,26,42,.4); }
.ld-bar span { display: grid; line-height: 1.1; }
.ld-bar small { font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.ld-bar b { font-size: 18px; font-weight: 900; color: #0f1a2a; font-variant-numeric: tabular-nums; }
.ld-bar .hp-btn { margin: 0; }
@media (max-width: 899px) { body:has(.ld-bar) main.inner { padding-bottom: 96px; } }
@media (min-width: 900px) { .ld-stage-empty { aspect-ratio: 16 / 9; min-height: 0; } .ld-hero { padding: 28px 34px 84px; } .ld-hero-main { grid-template-columns: 84px 1fr; column-gap: 22px; } .ld-orb { width: 84px; height: 84px; border-radius: 10px; } .ld-orb svg { width: 44px; height: 44px; } .ld-hero-row { grid-template-columns: 1fr auto; gap: 32px; } .ld { margin: -56px 24px 0; } .ld-bar { display: none; } .ld-details dl { grid-template-columns: 1fr 1fr; } .ld-tiles { grid-template-columns: repeat(3, 1fr); } }
/* Contul meu: antet cu avatar și fapte, îndemn KYC, grilă de carduri de acțiune */
main.inner:has(.ac-hero) { background: radial-gradient(900px 480px at 0% 0%, rgba(91,217,230,.22), transparent 60%), radial-gradient(800px 480px at 100% 20%, rgba(124,108,255,.18), transparent 60%), radial-gradient(700px 420px at 50% 100%, rgba(24,175,255,.14), transparent 60%); }
.ac-hero { position: relative; overflow: hidden; margin: 8px 0 22px; padding: 22px; border-radius: 10px; background: linear-gradient(135deg, #e9fbfc, #eef3ff 55%, #f3efff); border: 1px solid rgba(91,217,230,.35); box-shadow: 0 30px 60px -44px rgba(15,26,42,.35); }
.ac-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(560px 300px at 88% 0%, rgba(91,217,230,.45), transparent 65%), radial-gradient(460px 280px at 4% 100%, rgba(124,108,255,.28), transparent 65%); pointer-events: none; }
.ac-hero::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, #5bd9e6, #18afff 50%, #7c6cff); }
.ac-id { position: relative; display: grid; grid-template-columns: 64px 1fr; column-gap: 16px; align-items: start; }
.ac-id .ld-avatar, .ac-id .ld-avatar i { width: 64px; height: 64px; font-size: 24px; }
.ac-id h1 { margin: 8px 0 12px; font-size: clamp(24px, 3vw, 34px); letter-spacing: -.02em; }
.ac-id .ld-facts { margin: 0; }
.ac-id .ld-facts li i { background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ac-id .ld-facts li svg { stroke: #06201f; }
.ac-kyc-approved { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; }
.ac-kyc-pending_review { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.ac-kyc-rejected { --lane: #f87171; --lane-2: #991b1b; --lane-l: #fecaca; }
.ac-kyc-incomplete, .ac-kyc-none { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; }
.ac-nudge { position: relative; display: grid; grid-template-columns: 44px 1fr auto; column-gap: 14px; align-items: center; margin-top: 18px; padding: 14px 18px 14px 14px; border-radius: 10px; color: var(--fg); text-decoration: none; background: linear-gradient(135deg, rgba(91,217,230,.38), rgba(24,175,255,.28)); border: 1px solid rgba(91,217,230,.45); transition: translate .2s, box-shadow .3s; }
.ac-nudge:hover { translate: 0 -3px; box-shadow: 0 20px 40px -28px rgba(24,175,255,.6); text-decoration: none; }
.ac-nudge i { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; background: linear-gradient(135deg, #5bd9e6, #18afff); box-shadow: 0 8px 16px -8px rgba(24,175,255,.9); }
.ac-nudge i svg { width: 22px; height: 22px; fill: none; stroke: #fff; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ac-nudge b { display: block; font-size: 15px; }
.ac-nudge small { font-size: 13px; color: var(--muted); }
.ac-nudge em { font-style: normal; font-weight: 900; font-size: 20px; color: #0c7a79; }
.ac-hero-row { position: relative; display: grid; gap: 22px; align-items: center; }
/* Cardul de membru: „legitimația” contului, ca un card bancar deschis la culoare */
.ac-member { position: relative; overflow: hidden; padding: 18px 20px; border-radius: 10px; color: #fff; background: linear-gradient(135deg, #18afff, #5bd9e6 45%, #7c6cff); border: 1px solid rgba(255,255,255,.35); box-shadow: 0 30px 50px -26px rgba(24,175,255,.8), inset 0 1px 0 rgba(255,255,255,.5); }
.ac-member::before { content: ""; position: absolute; right: -60px; top: -60px; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.45), transparent 65%); }
.ac-member::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(135deg, transparent 0 14px, rgba(255,255,255,.08) 14px 15px); pointer-events: none; }
.ac-member-top { position: relative; display: flex; justify-content: space-between; align-items: center; }
.ac-member-top img { display: block; width: 90px; height: 30px; filter: brightness(0) invert(1); }
.ac-member-top span { font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.9); }
.ac-member-chip { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 3px; width: 38px; height: 28px; margin: 16px 0 10px; padding: 3px; box-sizing: border-box; border-radius: 6px; background: linear-gradient(135deg, #ffd699, #e0aa63); box-shadow: inset 0 1px 0 rgba(255,255,255,.6); }
.ac-member-chip i { border-radius: 2px; background: rgba(120,80,20,.25); }
.ac-member-name { position: relative; font-size: 17px; font-weight: 900; letter-spacing: .02em; text-transform: uppercase; text-shadow: 0 1px 0 rgba(0,0,0,.12); }
.ac-member-foot { position: relative; display: flex; gap: 18px; margin-top: 12px; font-size: 12.5px; font-weight: 700; }
.ac-member-foot small { display: block; font-size: 9.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.75); }
.ac-stamp { position: absolute; right: 18px; bottom: 16px; display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border: 2px solid #fff; border-radius: 6px; color: #fff; font-size: 11px; font-weight: 900; letter-spacing: .14em; transform: rotate(-8deg); opacity: .85; }
.ac-stamp svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.ac-track { position: relative; list-style: none; margin: 20px 0 0; padding: 14px; display: grid; gap: 10px; border-radius: 10px; background: rgba(255,255,255,.55); border: 1px solid rgba(91,217,230,.35); backdrop-filter: blur(4px); }
.ac-track li { position: relative; display: grid; grid-template-columns: 34px 1fr; column-gap: 10px; align-items: center; opacity: .55; }
.ac-track li i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 10px; background: #eef1f6; box-shadow: inset 0 0 0 1px rgba(15,26,42,.1); }
.ac-track li i svg { width: 17px; height: 17px; fill: none; stroke: #5b6878; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ac-track b { font-size: 13px; color: var(--fg); }
.ac-track small { font-size: 11.5px; color: var(--muted); }
.ac-track li.is-done { opacity: 1; }
.ac-track li.is-done i { background: linear-gradient(135deg, #9beef5, #5bd9e6); box-shadow: 0 8px 16px -8px rgba(91,217,230,.9); }
.ac-track li.is-done i svg { stroke: #06201f; }
.ac-track li.is-now { opacity: 1; }
.ac-track li.is-now i { background: #fff; box-shadow: 0 0 0 2px #5bd9e6, 0 0 0 6px rgba(91,217,230,.18); animation: hp-pulse 2.4s infinite; }
.ac-track li.is-now i svg { stroke: #0c7a79; }
.ac-track li.is-now b { color: #0c7a79; }
.ac-grid { display: grid; gap: 16px; }
.ac-panel { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; position: relative; overflow: hidden; padding: 20px; border-radius: 10px; background: linear-gradient(165deg, color-mix(in srgb, var(--lane) 26%, #fff), color-mix(in srgb, var(--lane) 8%, #fff) 60%); border: 1px solid color-mix(in srgb, var(--lane) 24%, #e6ebf2); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 30px 60px -44px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.4)); }
.ac-panel::before { content: ""; position: absolute; right: -70px; top: -70px; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--lane) 22%, transparent), transparent 65%); pointer-events: none; }
.ac-panel-head { position: relative; display: grid; grid-template-columns: 72px 1fr auto; column-gap: 14px; align-items: center; margin-bottom: 14px; }
.ac-panel-ill { display: block; width: 72px; height: 58px; filter: drop-shadow(0 10px 12px rgba(15,26,42,.14)); animation: hp-float 6s ease-in-out infinite; }
.ac-panel-ill svg { width: 100%; height: 100%; }
.ac-panel-head .hp-eyebrow { margin: 0 0 2px; color: var(--lane-2); }
.ac-panel-head h2 { margin: 0; font-size: 20px; letter-spacing: -.01em; }
.ac-panel-head .hp-btn { margin: 0; }
.ac-stats { position: relative; list-style: none; margin: 0 0 12px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.ac-stats-3 { grid-template-columns: repeat(3, 1fr); }
.ac-stats li i { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; margin-bottom: 6px; border-radius: 8px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ac-stats li i svg { width: 14px; height: 14px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ac-vault { position: relative; display: flex; align-items: center; justify-content: space-between; margin: 0 0 10px; padding: 12px 14px; border-radius: 10px; background: linear-gradient(120deg, rgba(124,108,255,.16), rgba(91,217,230,.14)); border: 1px solid rgba(124,108,255,.3); }
.ac-vault small { display: block; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.ac-vault b { font-size: 22px; font-weight: 900; letter-spacing: -.02em; background: linear-gradient(90deg, #0f1a2a, #4b3fd6); -webkit-background-clip: text; background-clip: text; color: transparent; font-variant-numeric: tabular-nums; }
.ac-vault em { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: linear-gradient(135deg, #c4b8ff, #7c6cff); box-shadow: 0 10px 20px -10px rgba(124,108,255,.9); }
.ac-vault em svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ac-stats li { padding: 10px 12px; border-radius: 10px; background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--lane) 10%, #fff)); border: 1px solid color-mix(in srgb, var(--lane) 18%, #e6ebf2); }
.ac-stats b { display: block; font-size: 24px; font-weight: 900; letter-spacing: -.02em; line-height: 1.1; background: linear-gradient(90deg, #0f1a2a, var(--lane-2)); -webkit-background-clip: text; background-clip: text; color: transparent; font-variant-numeric: tabular-nums; }
.ac-stats span { font-size: 11.5px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.ac-list { position: relative; list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 6px; }
.ac-list a { display: grid; grid-template-columns: 34px 1fr auto auto; column-gap: 10px; align-items: center; padding: 10px 12px; border-radius: 10px; background: rgba(255,255,255,.85); border: 1px solid rgba(15,26,42,.07); color: var(--fg); text-decoration: none; font-size: 13.5px; transition: border-color .2s, translate .2s; }
.ac-list a:hover { border-color: var(--lane); translate: 0 -2px; text-decoration: none; }
.ac-list span { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ac-list em { font-style: normal; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lane-2); background: color-mix(in srgb, var(--lane) 12%, transparent); border-radius: 6px; padding: 3px 7px; }
.ac-list b { font-variant-numeric: tabular-nums; }
.ac-ic { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; background: #eef1f6; }
.ac-ic svg { width: 18px; height: 18px; fill: none; stroke: #5b6878; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ac-ic.ac-st-active, .ac-ic-tx { background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ac-ic.ac-st-active svg, .ac-ic-tx svg { stroke: #06201f; }
.ac-ic.ac-st-sold { background: linear-gradient(135deg, #c4b8ff, #7c6cff); } .ac-ic.ac-st-sold svg { stroke: #fff; }
.ac-ic.ac-st-reserved { background: linear-gradient(135deg, #ffd699, #ffb547); } .ac-ic.ac-st-reserved svg { stroke: #06201f; }
.ac-list span small { display: block; font-size: 11.5px; font-weight: 600; color: var(--muted); }
.ac-list-tx a { grid-template-columns: 34px 1fr auto; grid-template-rows: auto auto; }
.ac-list-tx .ac-ic { grid-row: 1 / 3; }
.ac-prog { grid-column: 2 / 4; display: block; height: 5px; margin-top: 6px; border-radius: 3px; background: rgba(15,26,42,.08); text-decoration: none; overflow: hidden; }
.ac-prog s { display: block; height: 100%; width: calc(var(--p) / 6 * 100%); border-radius: 3px; background: linear-gradient(90deg, #5bd9e6, #7c6cff); text-decoration: none; }
.ac-card-ill { grid-row: 1 / 4; display: block; width: 84px; height: 56px; }
.ac-card-ill svg { width: 100%; height: 100%; filter: drop-shadow(0 8px 10px rgba(15,26,42,.14)); }
.ac-card:has(.ac-card-ill) { grid-template-columns: 84px 1fr; align-items: center; }
.ac-dot { width: 10px; height: 10px; border-radius: 50%; background: #9fb0c4; }
.ac-dot-active, .ac-dot-tx { background: #5bd9e6; box-shadow: 0 0 0 3px rgba(91,217,230,.25); }
.ac-dot-reserved { background: #ffb547; } .ac-dot-sold { background: #7c6cff; } .ac-dot-draft { background: #cbd5e1; }
.ac-empty { position: relative; margin: 0 0 14px; padding: 12px 14px; border-radius: 10px; background: rgba(255,255,255,.7); border: 1px dashed color-mix(in srgb, var(--lane) 45%, transparent); font-size: 13.5px; color: var(--muted); }
.ac-panel > .hp-btn { position: relative; }
.ac-panel > .hp-btn + .hp-btn { margin-left: 8px; }
.ac-card { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; position: relative; display: grid; grid-template-columns: 48px 1fr; column-gap: 14px; align-items: start; padding: 18px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 22%, #fff), color-mix(in srgb, var(--lane) 6%, #fff) 60%); border: 1px solid color-mix(in srgb, var(--lane) 24%, #e6ebf2); color: var(--fg); text-decoration: none; box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 18px 34px -28px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.3)); transition: translate .2s, box-shadow .3s, border-color .3s; overflow: hidden; }
.ac-card::after { content: ""; position: absolute; right: -40px; top: -40px; width: 120px; height: 120px; border-radius: 50%; background: color-mix(in srgb, var(--lane) 12%, transparent); pointer-events: none; }
.ac-card:hover { translate: 0 -4px; border-color: var(--lane); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 26px 46px -26px color-mix(in srgb, var(--lane) 70%, rgba(15,26,42,.35)); text-decoration: none; }
.ac-card i { grid-row: 1 / 4; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--lane) 85%, transparent); }
.ac-card i svg { width: 24px; height: 24px; fill: none; stroke: #fff; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ac-card b { font-size: 16px; }
.ac-card span { font-size: 13.5px; color: var(--muted); line-height: 1.45; }
.ac-card em { margin-top: 10px; font-style: normal; font-size: 13px; font-weight: 800; color: var(--lane-2); }
.ac-card-cta { --lane: #18afff; --lane-2: #1b5aa3; --lane-l: #9dd0ff; background: linear-gradient(135deg, rgba(91,217,230,.22), rgba(24,175,255,.16)); }
@media (min-width: 900px) { .ac-hero { padding: 28px 34px; } .ac-id { grid-template-columns: 84px 1fr; column-gap: 22px; } .ac-id .ld-avatar, .ac-id .ld-avatar i { width: 84px; height: 84px; font-size: 30px; } .ac-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; } .ac-hero-row { grid-template-columns: 1fr 340px; gap: 32px; } .ac-track { grid-template-columns: repeat(4, 1fr); gap: 14px; padding: 16px 18px; } .ac-track li + li::before { content: ""; position: absolute; left: -14px; top: 17px; width: 14px; border-top: 2px dashed rgba(91,217,230,.5); } }
/* KYC: antet cu stare și pași, alegerea tipului ca plăci (radio + :checked arată doar secțiunea aleasă), secțiuni cu iconițe, panou lateral */
main.inner:has(.ky-hero) { background: radial-gradient(900px 480px at 0% 0%, rgba(91,217,230,.22), transparent 60%), radial-gradient(800px 480px at 100% 20%, rgba(124,108,255,.18), transparent 60%), radial-gradient(700px 420px at 50% 100%, rgba(24,175,255,.14), transparent 60%); }
.ky-hero { position: relative; overflow: hidden; margin: 8px 0 22px; padding: 22px; border-radius: 10px; background: linear-gradient(135deg, #e3f9fb, #e8f0ff 55%, #efeaff); border: 1px solid rgba(91,217,230,.4); box-shadow: 0 30px 60px -44px rgba(15,26,42,.35); }
.ky-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(560px 300px at 88% 0%, rgba(91,217,230,.45), transparent 65%), radial-gradient(460px 280px at 4% 100%, rgba(124,108,255,.28), transparent 65%); pointer-events: none; }
.ky-hero-row { position: relative; display: grid; gap: 22px; align-items: center; }
.ky-hero::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, #5bd9e6, #18afff 50%, #7c6cff); }
.ky-hero-main { display: grid; grid-template-columns: 64px 1fr; column-gap: 16px; align-items: start; }
.ky-hero h1 { margin: 6px 0 8px; font-size: clamp(24px, 3vw, 34px); letter-spacing: -.02em; }
.ky-sub { margin: 0; color: var(--muted); max-width: 70ch; }
.ky-status { margin: 16px 0 6px; display: inline-grid; grid-template-columns: 40px 1fr; column-gap: 12px; align-items: center; margin-top: 16px; padding: 10px 16px 10px 10px; border-radius: 10px; background: #fff; border: 1px solid color-mix(in srgb, var(--lane) 45%, #e6ebf2); }
.ky-status i { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ky-status svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.ky-status small { display: block; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.ky-status b { font-size: 15px; color: var(--lane-2); }
.ky-status em { display: block; font-style: normal; font-size: 12px; color: var(--muted); }
.ky-hero .ky-steps.au-steps { position: relative; margin: 34px 0 0; padding: 28px 0 0; border-top: 1px solid rgba(15,26,42,.12); }
/* Previzualizarea „actului” delivery.ro: se umple din ce ai tastat, cu datele sensibile mascate */
.ky-id { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; position: relative; overflow: hidden; padding: 16px 18px; border-radius: 10px; color: #fff; background: linear-gradient(135deg, #18afff, #5bd9e6 45%, #7c6cff); border: 1px solid rgba(255,255,255,.35); box-shadow: 0 30px 50px -26px rgba(24,175,255,.8), inset 0 1px 0 rgba(255,255,255,.5); }
.ky-id-co { background: linear-gradient(135deg, #7c6cff, #18afff 55%, #5bd9e6); }
.ky-id::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(135deg, transparent 0 14px, rgba(255,255,255,.08) 14px 15px); pointer-events: none; }
.ky-id-top { position: relative; display: flex; justify-content: space-between; align-items: center; font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.9); }
.ky-id-top i { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 7px; background: rgba(255,255,255,.22); }
.ky-id-top svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.ky-id-body { position: relative; display: grid; grid-template-columns: 58px 1fr; column-gap: 14px; align-items: start; margin: 14px 0 12px; }
.ky-id-photo { display: flex; align-items: center; justify-content: center; width: 58px; height: 72px; border-radius: 8px; background: rgba(255,255,255,.25); border: 1px solid rgba(255,255,255,.5); }
.ky-id-photo svg { width: 30px; height: 30px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ky-id dl { margin: 0; display: grid; gap: 5px; }
.ky-id dl div { display: grid; grid-template-columns: 82px 1fr; gap: 8px; font-size: 12.5px; }
.ky-id dt { font-size: 9.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.78); padding-top: 2px; }
.ky-id dd { margin: 0; font-weight: 800; font-family: ui-monospace, Menlo, Consolas, monospace; letter-spacing: .02em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ky-id-foot { position: relative; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.9); }
.ky-id-foot u { display: block; height: 6px; margin-top: 6px; border-radius: 3px; background: rgba(255,255,255,.3); text-decoration: none; overflow: hidden; }
.ky-id-foot s { display: block; height: 100%; width: calc(var(--p) / var(--t) * 100%); border-radius: 3px; background: #fff; text-decoration: none; transition: width .4s; }
.ky-stamp { right: 12px; top: 46px; bottom: auto; }
.ky-id:has(.ky-stamp) dl { padding-right: 84px; }
.ky-reject { margin-top: 14px; align-items: flex-start; }
.ky { display: grid; gap: 22px; align-items: start; }
main.inner form.ky-form, main.inner form.ct-f { max-width: none; }
.ky-types { display: grid; gap: 10px; margin-bottom: 18px; }
.ky-type { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; display: grid; grid-template-columns: 52px 1fr; column-gap: 14px; align-items: center; padding: 16px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 18%, #fff), color-mix(in srgb, var(--lane) 6%, #fff) 60%); border: 2px solid color-mix(in srgb, var(--lane) 35%, #e6ebf2); cursor: pointer; transition: border-color .2s, box-shadow .2s, translate .2s; }
.ky-type i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--lane) 85%, transparent); }
.ky-type svg { width: 26px; height: 26px; fill: none; stroke: #06201f; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ky-type b { display: block; font-size: 16px; }
.ky-type span { display: block; font-size: 12.5px; color: var(--muted); }
.ky-type:hover { translate: 0 -2px; border-color: var(--lane); }
label[for="ky-co"].ky-type { --lane: #2b7fd6; --lane-2: #1b5aa3; --lane-l: #9dd0ff; }
#ky-ind:checked ~ .ky-types label[for="ky-ind"], #ky-co:checked ~ .ky-types label[for="ky-co"] { border-color: var(--lane-2); background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 38%, #fff), color-mix(in srgb, var(--lane) 14%, #fff) 60%); box-shadow: 0 0 0 4px color-mix(in srgb, var(--lane) 22%, transparent), 0 16px 30px -22px color-mix(in srgb, var(--lane) 90%, transparent); }
.ky-type::after { content: ""; position: absolute; right: 14px; top: 14px; width: 20px; height: 20px; border-radius: 50%; border: 2px solid color-mix(in srgb, var(--lane) 50%, transparent); background: #fff; }
.ky-type { position: relative; }
#ky-ind:checked ~ .ky-types label[for="ky-ind"]::after, #ky-co:checked ~ .ky-types label[for="ky-co"]::after { border-color: var(--lane-2); background: var(--lane-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 12px no-repeat; }
#ky-ind:focus-visible ~ .ky-types label[for="ky-ind"], #ky-co:focus-visible ~ .ky-types label[for="ky-co"] { outline: 2px solid var(--teal); outline-offset: 2px; }
.ky-sec-ind, .ky-sec-co { display: none; }
#ky-ind:checked ~ .ky-sec-ind, #ky-co:checked ~ .ky-sec-co { display: block; animation: hp-rise .3s ease-out; }
.ky-sec { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; position: relative; margin-bottom: 14px; padding: 18px 20px 18px 24px; border-radius: 10px; background: linear-gradient(165deg, color-mix(in srgb, var(--lane) 16%, #fff), #fff 55%); border: 1px solid color-mix(in srgb, var(--lane) 26%, #e6ebf2); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 40px -34px rgba(15,26,42,.35); }
.ky-sec::before { content: ""; position: absolute; left: 0; top: 18px; bottom: 18px; width: 4px; border-radius: 0 4px 4px 0; background: linear-gradient(180deg, var(--lane-l), var(--lane-2)); }
.ky-sec h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; font-size: 17px; }
.ky-sec h2 i { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 9px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ky-sec h2 svg { width: 17px; height: 17px; fill: none; stroke: #06201f; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ky-grid { display: grid; gap: 4px 14px; }
main.inner .ky-field label { margin: 10px 0 6px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.ky-ctl { position: relative; display: flex; align-items: center; }
.ky-ctl > svg { position: absolute; left: 13px; top: 13px; width: 18px; height: 18px; fill: none; stroke: var(--lane-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
main.inner .ky-ctl select { width: 100%; padding: 12px 40px 12px 42px; border: 1px solid rgba(15,26,42,.14); border-radius: 10px; font: inherit; font-weight: 600; background: #fff; appearance: none; -webkit-appearance: none; cursor: pointer; }
main.inner .ky-ctl select:focus { outline: 0; border-color: #5bd9e6; box-shadow: 0 0 0 3px rgba(91,217,230,.25); }
.ky-ctl.ky-ctl-select::after { content: ""; position: absolute; right: 16px; top: 50%; width: 8px; height: 8px; border-right: 2px solid var(--lane-2); border-bottom: 2px solid var(--lane-2); transform: translateY(-70%) rotate(45deg); pointer-events: none; }
main.inner .ky-ctl input, main.inner .ky-ctl textarea { width: 100%; padding: 12px 14px 12px 42px; border: 1px solid rgba(15,26,42,.14); border-radius: 10px; font: inherit; font-weight: 600; background: #fff; transition: border-color .2s, box-shadow .2s; }
main.inner .ky-ctl textarea { min-height: 88px; }
main.inner .ky-ctl input:focus, main.inner .ky-ctl textarea:focus { outline: 0; border-color: #5bd9e6; box-shadow: 0 0 0 3px rgba(91,217,230,.25); }
.ky-ctl.is-invalid input, .ky-ctl.is-invalid textarea { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(214,0,0,.12); }
.ky-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
main.inner .ky-actions button { margin: 0; }
.lf-form > .ky-actions { margin: 10px 0 26px; }
.ky-side { display: grid; gap: 14px; align-content: start; }
.ky-side > .lf-preview { margin-bottom: 0; }
.ky-card { position: relative; overflow: hidden; padding: 20px; border-radius: 10px; background: linear-gradient(165deg, rgba(91,217,230,.3), rgba(124,108,255,.12) 60%, rgba(24,175,255,.16)); border: 1px solid rgba(91,217,230,.45); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 24px 44px -34px rgba(91,217,230,.6); }
.ky-ill { display: block; width: 150px; height: 100px; margin: 0 auto 10px; filter: drop-shadow(0 12px 14px rgba(15,26,42,.14)); animation: hp-float 6s ease-in-out infinite; }
.ky-card .hp-eyebrow { display: flex; justify-content: center; margin: 0 0 14px; }
.ky-points { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ky-points li { display: grid; grid-template-columns: 40px 1fr; column-gap: 12px; align-items: center; padding: 12px 14px 12px 12px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 16%, #fff), #fff 70%); border: 1px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 16px 30px -26px color-mix(in srgb, var(--lane) 70%, rgba(15,26,42,.3)); transition: translate .2s, box-shadow .3s; }
.ky-points li:hover { translate: 0 -2px; box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 34px -24px color-mix(in srgb, var(--lane) 80%, rgba(15,26,42,.3)); }
.ky-points b { display: block; font-size: 14px; color: var(--fg); }
.ky-points span { display: block; font-size: 12.5px; color: var(--muted); line-height: 1.4; }
.ky-points i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 8px 16px -8px color-mix(in srgb, var(--lane) 85%, transparent); }
.ky-points svg { width: 20px; height: 20px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ky-seal { display: grid; grid-template-columns: 34px 1fr; column-gap: 10px; align-items: center; margin-top: 12px; padding: 10px 12px; border-radius: 10px; border: 2px dashed rgba(12,122,121,.5); color: #0c7a79; }
.ky-seal svg { width: 34px; height: 34px; fill: none; stroke: #0c7a79; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ky-seal b { display: block; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; }
.ky-seal small { font-size: 12px; color: var(--muted); }
/* Formularul de anunț: refolosește secțiunile KYC; plăci pentru stare, galerie ca grilă, panou de publicare */
main.inner:has(.lf-hero) { background: radial-gradient(900px 480px at 0% 0%, rgba(91,217,230,.22), transparent 60%), radial-gradient(800px 480px at 100% 20%, rgba(124,108,255,.18), transparent 60%); }
main.inner form.lf-form { max-width: none; }
.lf-full { grid-column: 1 / -1; }
.ky-ctl .hp-unit { right: 14px; }
.ky-ctl input:has(+ .hp-unit) { padding-right: 46px; }
.lf-st-active { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; }
.lf-st-draft { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; }
.lf-st-inactive { --lane: #94a3b8; --lane-2: #334155; --lane-l: #e2e8f0; }
.lf-st-reserved { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.lf-st-sold { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
.lf-st-removed { --lane: #f87171; --lane-2: #991b1b; --lane-l: #fecaca; }
.ky-status em a { color: var(--lane-2); font-weight: 700; }
.lf-cond { display: grid; gap: 10px; margin: 6px 0 10px; }
.lf-tile { position: relative; display: grid; grid-template-columns: 44px 1fr; column-gap: 12px; align-items: center; padding: 12px 14px; border-radius: 10px; background: #fff; border: 2px solid rgba(15,26,42,.1); cursor: pointer; transition: border-color .2s, box-shadow .2s, background .2s; }
.lf-tile input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.lf-tile i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; background: #eef1f6; }
.lf-tile svg { width: 22px; height: 22px; fill: none; stroke: #5b6878; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
main.inner .lf-tile b { display: block; font-size: 15px; }
.lf-tile span { display: block; font-size: 12.5px; color: var(--muted); }
.lf-tile:has(input:checked) { border-color: var(--lane-2); background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 30%, #fff), color-mix(in srgb, var(--lane) 10%, #fff) 60%); box-shadow: 0 0 0 4px color-mix(in srgb, var(--lane) 22%, transparent); }
.lf-tile:has(input:checked) i { background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.lf-tile:has(input:checked) svg { stroke: #06201f; }
.lf-tile:has(input:focus-visible) { outline: 2px solid var(--teal); outline-offset: 2px; }
.lf-images h2 em { margin-left: auto; font-style: normal; font-size: 12px; font-weight: 800; letter-spacing: .08em; color: var(--lane-2); background: color-mix(in srgb, var(--lane) 14%, transparent); border-radius: 6px; padding: 3px 8px; }
.lf-gallery { list-style: none; margin: 8px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.lf-shot { position: relative; border-radius: 10px; overflow: hidden; background: #f3f6fa; border: 1px solid rgba(15,26,42,.1); }
.lf-shot.is-main { border-color: var(--lane); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lane) 22%, transparent); }
.lf-shot img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.lf-main-tag { position: absolute; left: 8px; top: 8px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px 4px 6px; border-radius: 6px; background: rgba(255,255,255,.94); color: var(--lane-2); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.lf-main-tag svg { width: 12px; height: 12px; fill: none; stroke: var(--lane-2); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lf-shot-actions { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px; background: #fff; }
main.inner .lf-shot-actions .inline-form { margin: 0; }
main.inner button.lf-mini { margin: 0; padding: 6px 10px; font-size: 12px; border-radius: 8px; background: #eef1f6; color: var(--fg); }
main.inner button.lf-mini:hover { background: color-mix(in srgb, var(--lane) 22%, #fff); }
main.inner button.lf-mini-danger { background: #fcefee; color: var(--danger); }
main.inner button.lf-mini-danger:hover { background: #f8d7d7; }
.lf-add { border-radius: 10px; border: 2px dashed color-mix(in srgb, var(--lane) 55%, transparent); background: color-mix(in srgb, var(--lane) 6%, #fff); padding: 12px; display: grid; }
main.inner .lf-add form { max-width: none; display: grid; gap: 8px; }
.lf-add label { display: grid; grid-template-columns: 36px 1fr; column-gap: 10px; align-items: center; margin: 0; cursor: pointer; }
.lf-add label i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.lf-add label svg { width: 18px; height: 18px; fill: none; stroke: #06201f; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
main.inner .lf-add label b { display: block; font-size: 13.5px; }
.lf-add label span { display: block; font-size: 11.5px; color: var(--muted); }
main.inner .lf-add input[type=file] { font-size: 12.5px; }
main.inner .lf-add .hp-btn { margin: 0; justify-self: start; }
.lf-publish { background: linear-gradient(165deg, rgba(91,217,230,.28), rgba(24,175,255,.14) 60%, #fff); }
.lf-pub-text { margin: 0 0 12px; font-size: 13.5px; color: var(--fg); line-height: 1.5; }
main.inner .lf-pub-form { max-width: none; }
main.inner .lf-pub-form button, .lf-publish > .hp-btn { width: 100%; margin: 0; justify-content: center; }
.lf-withdraw { margin-top: 14px; padding-top: 12px; border-top: 1px dashed rgba(15,26,42,.15); display: grid; gap: 8px; }
main.inner .lf-withdraw { max-width: none; }
.lf-check { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; font-weight: 600; }
main.inner .lf-withdraw button { justify-self: start; }
/* Antetul formularului de anunț: promisiuni cu iconițe și „călătoria” în trei carduri ilustrate legate de o linie */
.lf-hero-row { position: relative; display: grid; gap: 22px; }
.lf-promises { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.lf-promises li { display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: 9px; align-items: center; padding: 7px 10px 7px 7px; min-width: 0; border-radius: 10px; background: rgba(255,255,255,.8); border: 1px solid rgba(91,217,230,.35); }
.lf-promises i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, #9beef5, #5bd9e6); }
.lf-promises svg { width: 15px; height: 15px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lf-promises b { font-size: 13px; color: var(--fg); }
.lf-promises span { font-size: 11px; color: var(--muted); line-height: 1.25; }
@media (max-width: 599px) { .lf-promises { grid-template-columns: 1fr; } }
.lf-journey { position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.lf-journey li { position: relative; display: grid; grid-template-columns: 80px 1fr; column-gap: 12px; align-items: center; padding: 12px 14px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 14%, #fff), #fff 60%); border: 1px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); opacity: .7; transition: translate .2s, box-shadow .3s; }
.lf-journey li.is-done, .lf-journey li.is-now { opacity: 1; }
.lf-journey li.is-now { border-color: var(--lane-2); box-shadow: 0 0 0 4px color-mix(in srgb, var(--lane) 20%, transparent), 0 20px 40px -26px color-mix(in srgb, var(--lane) 80%, transparent); }
.lf-journey li:hover { translate: 0 -2px; }
.lf-jr-ill { grid-row: 1 / 3; width: 80px; height: 60px; filter: drop-shadow(0 8px 10px rgba(15,26,42,.14)); }
.lf-journey li.is-now .lf-jr-ill { animation: hp-float 5s ease-in-out infinite; }
.lf-jr-n { position: absolute; left: 10px; top: 10px; width: 24px; height: 24px; border-radius: 7px; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 900; color: #fff; background: var(--lane-2); box-shadow: 0 0 0 2px #fff; }
.lf-journey li.is-done .lf-jr-n { background: linear-gradient(135deg, #9beef5, #0c7a79); }
main.inner .lf-journey b { display: block; font-size: 14.5px; color: var(--fg); }
.lf-journey small { display: block; font-size: 12px; color: var(--muted); }
@media (min-width: 900px) {
  .lf-hero-row { grid-template-columns: 1.15fr .85fr; gap: 36px; align-items: center; }
  .lf-hero-row:has(.ml-flow) { grid-template-columns: .8fr 1.2fr; }
  .lf-hero-row:has(.tx-pipe) { grid-template-columns: .9fr 1.1fr; }
  .lf-journey { padding-top: 0; }
  .lf-journey li + li::before { content: ""; position: absolute; left: 22px; top: -12px; width: 2px; height: 12px; background: linear-gradient(180deg, rgba(91,217,230,.7), rgba(124,108,255,.5)); }
}
@media (prefers-reduced-motion: reduce) { .lf-journey li.is-now .lf-jr-ill { animation: none; } }
/* Etapele formularului: număr mare în colț care devine bifă când etapa e completă (JS), contoare de caractere */
.lf-stage { padding-top: 22px; }
.lf-num { position: absolute; right: 16px; top: 14px; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: #fff; border: 1px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); box-shadow: 0 8px 16px -10px color-mix(in srgb, var(--lane) 70%, transparent); font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 13px; font-weight: 800; color: var(--lane-2); transition: background .3s, border-color .3s; }
.lf-num i { display: none; }
.lf-num svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.lf-stage.is-done .lf-num { background: linear-gradient(135deg, var(--lane-l), var(--lane-2)); border-color: var(--lane-2); }
.lf-stage.is-done .lf-num b { display: none; }
.lf-stage.is-done .lf-num i { display: flex; }
.lf-count { float: right; font-size: 11px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--muted); font-variant-numeric: tabular-nums; }
.lf-count.is-near { color: #b45309; }
.lf-live { display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: #5bd9e6; box-shadow: 0 0 0 0 rgba(91,217,230,.6); animation: hp-pulse 2s infinite; vertical-align: middle; }
.lf-pv-card [data-pv] { transition: opacity .2s; }
.lf-pv-card .is-flash { animation: hp-rise .35s ease-out; }
/* Previzualizarea cardului din listă, umplută din formular, și lista de verificare */
.lf-preview { position: relative; }
.lf-pv-label { display: block; margin-bottom: 8px; font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #0c7a79; }
.lf-preview { margin-bottom: 14px; }
.lf-pv-card { max-width: 360px; margin: 0 auto; pointer-events: none; transform: none; box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 30px 50px -30px rgba(24,175,255,.6); }
.lf-pv-card strong { min-height: 1.3em; }
.lf-check-card { background: linear-gradient(165deg, rgba(91,217,230,.26), rgba(24,175,255,.12) 60%, #fff); }
.lf-check-card .hp-eyebrow { margin-bottom: 10px; }
.lf-check-card .hp-eyebrow b { font-size: 11px; }
.lf-meter { display: block; height: 8px; margin-bottom: 12px; border-radius: 4px; background: rgba(15,26,42,.08); text-decoration: none; overflow: hidden; }
.lf-meter s { display: block; height: 100%; width: calc(var(--p) / 5 * 100%); border-radius: 4px; background: linear-gradient(90deg, #5bd9e6, #18afff); text-decoration: none; transition: width .4s; }
.lf-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.lf-checklist li { display: grid; grid-template-columns: 22px 1fr; column-gap: 10px; align-items: center; padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.8); font-size: 13.5px; font-weight: 700; color: var(--muted); }
.lf-checklist li i { width: 22px; height: 22px; border-radius: 6px; border: 2px solid rgba(15,26,42,.18); background: #fff; }
.lf-checklist li.is-ok { color: var(--fg); }
.lf-checklist li.is-ok i { border-color: #0c7a79; background: #0c7a79 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 13px no-repeat; }
.lf-checklist li { grid-template-rows: auto auto; }
.lf-checklist li i { grid-row: 1 / 3; }
.lf-checklist small { grid-column: 2; font-size: 11px; font-weight: 600; white-space: nowrap; }
@media (min-width: 900px) { .lf-cond { grid-template-columns: 1fr 1fr; } .lf .ky-side { top: 130px; } .lf-hero .ky-hero-row { grid-template-columns: 1fr 360px; gap: 32px; align-items: center; } }
/* Anunțurile mele: „conducta” anunțurilor în antet — patru etape ilustrate (ciornă → activ → rezervat → vândut) legate de săgeți, plus bara de distribuție */
.ml-flow { position: relative; }
.ml-pipe { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.ml-pipe li { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; position: relative; display: grid; grid-template-columns: 64px 1fr; column-gap: 10px; align-items: center; padding: 12px 12px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 45%, #fff), color-mix(in srgb, var(--lane) 22%, #fff)); border: 1px solid color-mix(in srgb, var(--lane) 55%, #fff); opacity: .8; transition: translate .2s, box-shadow .3s; }
.ml-pipe li.has { opacity: 1; background: linear-gradient(160deg, var(--lane-l), var(--lane) 70%); border-color: var(--lane); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 22px 40px -24px color-mix(in srgb, var(--lane) 90%, rgba(15,26,42,.3)); }
.ml-pipe-draft.has { background: linear-gradient(160deg, #e2e8f0, #9fb0c4 70%); }
.ml-pipe li:hover { translate: 0 -2px; }
.ml-pipe li.ml-pipe-active { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; }
.ml-pipe li.ml-pipe-reserved { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.ml-pipe li.ml-pipe-sold { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
.ml-pipe-ill { grid-row: 1 / 4; width: 64px; height: 48px; filter: drop-shadow(0 6px 8px rgba(15,26,42,.12)); }
.ml-pipe li.has .ml-pipe-ill { animation: hp-float 6s ease-in-out infinite; }
.ml-pipe li:nth-child(2) .ml-pipe-ill { animation-delay: -1.5s; } .ml-pipe li:nth-child(3) .ml-pipe-ill { animation-delay: -3s; } .ml-pipe li:nth-child(4) .ml-pipe-ill { animation-delay: -4.5s; }
.ml-pipe b { font-size: 28px; font-weight: 900; letter-spacing: -.02em; line-height: 1; color: #0f1a2a; font-variant-numeric: tabular-nums; }
.ml-pipe span { font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #0f1a2a; }
.ml-pipe small { font-size: 11px; color: rgba(15,26,42,.7); font-weight: 600; }
.ml-bar { display: flex; height: 8px; margin-top: 10px; border-radius: 4px; overflow: hidden; background: rgba(15,26,42,.08); }
.ml-bar i { display: block; height: 100%; flex: 0 0 calc(var(--n) / var(--t) * 100%); transition: flex-basis .4s; }
.ml-bar-active { background: #5bd9e6; } .ml-bar-reserved { background: #ffb547; } .ml-bar-sold { background: #7c6cff; } .ml-bar-draft { background: #cbd5e1; } .ml-bar-removed { background: #fecaca; }
@media (min-width: 900px) {
  .ml-pipe { grid-template-columns: repeat(4, 1fr); gap: 18px; }
  .ml-pipe li { grid-template-columns: 1fr; justify-items: center; text-align: center; row-gap: 2px; padding: 14px 10px 12px; }
  .ml-pipe-ill { grid-row: auto; margin-bottom: 6px; }
  .ml-pipe li + li::before { content: ""; position: absolute; left: -18px; top: 50%; width: 18px; height: 2px; background: linear-gradient(90deg, color-mix(in srgb, var(--lane) 60%, transparent), var(--lane)); }
  .ml-pipe li + li::after { content: ""; position: absolute; left: -6px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-top: 2px solid var(--lane); border-right: 2px solid var(--lane); transform: rotate(45deg); }
}
@media (prefers-reduced-motion: reduce) { .ml-pipe li.has .ml-pipe-ill { animation: none; } }
/* Pagina unei tranzacții: antet cu părți, seif cu starea banilor, cronologie cu timpi, „Acum” cu instrucțiuni bancare, chat cu bule, chitanță, istoric */
.tx-hero-row { position: relative; display: grid; gap: 18px; }
.tx-hero h1 { margin: 6px 0 12px; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -.02em; }
.tx-hero h1 a { color: var(--fg); text-decoration: none; } .tx-hero h1 a:hover { color: #0c7a79; }
.tx-ref-chip { font-family: ui-monospace, Menlo, Consolas, monospace; letter-spacing: .04em; }
.tx-people { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.tx-person { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; display: inline-grid; grid-template-columns: 36px 1fr auto; column-gap: 10px; align-items: center; padding: 6px 12px 6px 6px; border-radius: 10px; background: #fff; border: 1px solid color-mix(in srgb, var(--lane) 35%, #e6ebf2); }
.tx-person.is-me { box-shadow: 0 0 0 3px color-mix(in srgb, var(--lane) 22%, transparent); border-color: var(--lane-2); }
.tx-person i { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; font-style: normal; font-weight: 900; color: #06201f; background: linear-gradient(135deg, var(--lane-l), var(--lane)); text-transform: uppercase; }
.tx-person i svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.tx-person small { display: block; font-size: 9.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--lane-2); }
.tx-person b { font-size: 14px; color: var(--fg); }
.tx-person a { font-size: 11px; color: var(--muted); }
.tx-arrow svg { width: 18px; height: 18px; fill: none; stroke: #9fb0c4; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.tx-vaultcard { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; position: relative; padding: 16px 18px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 22%, #fff), #fff 65%); border: 1px solid color-mix(in srgb, var(--lane) 40%, #e6ebf2); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 24px 44px -30px color-mix(in srgb, var(--lane) 70%, rgba(15,26,42,.35)); }
.tx-lock-empty { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.tx-lock-open { --lane: #34d399; --lane-2: #15803d; --lane-l: #a7f3d0; }
.tx-lock-back { --lane: #f87171; --lane-2: #991b1b; --lane-l: #fecaca; }
.tx-vault-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }
.tx-stepchip { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 9px; border-radius: 10px; background: #fff; border: 1px solid color-mix(in srgb, var(--lane) 45%, #e6ebf2); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lane) 16%, transparent); font-size: 12.5px; font-weight: 800; color: var(--fg); }
.tx-stepchip i { width: 9px; height: 9px; border-radius: 50%; background: var(--lane-2); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lane) 35%, transparent); animation: txm-blink 1.6s ease-in-out infinite; }
.tx-stepchip b { padding: 3px 8px; border-radius: 6px; background: var(--lane-2); color: #fff; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .tx-stepchip i { animation: none; } }
.tx-dispute-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #991b1b; background: #fee2e2; border-radius: 6px; padding: 4px 8px; }
.tx-dispute-chip svg { width: 13px; height: 13px; fill: none; stroke: #991b1b; stroke-width: 2.4; stroke-linecap: round; }
.tx-vault-body { display: grid; grid-template-columns: 56px 1fr; column-gap: 14px; align-items: center; }
.tx-vault-lock { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--lane) 90%, transparent); }
.tx-lock-closed .tx-vault-lock { animation: hp-pulse 3s infinite; }
.tx-vault-lock svg { width: 28px; height: 28px; fill: none; stroke: #06201f; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tx-vault-body small { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--lane-2); }
.tx-vault-body b { display: block; font-size: 30px; font-weight: 900; letter-spacing: -.02em; line-height: 1.1; color: #0f1a2a; font-variant-numeric: tabular-nums; }
.tx-waiting { display: flex; align-items: flex-start; gap: 8px; margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; background: rgba(255,255,255,.85); border: 1px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); font-size: 13.5px; font-weight: 700; color: var(--fg); line-height: 1.4; }
.tx-waiting svg { flex: none; width: 18px; height: 18px; margin-top: 1px; fill: none; stroke: var(--lane-2); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.tx-timeline { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.tx-timeline li { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; position: relative; display: grid; justify-items: center; text-align: center; gap: 4px; padding: 12px 8px 10px; border-radius: 10px; background: rgba(255,255,255,.75); border: 1px solid rgba(15,26,42,.08); opacity: .6; }
.tx-timeline li.tx-who-buyer { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; } .tx-timeline li.tx-who-us { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; } .tx-timeline li.tx-who-seller { --lane: #2b7fd6; --lane-2: #1b5aa3; --lane-l: #9dd0ff; }
.tx-timeline li.is-done, .tx-timeline li.is-now { opacity: 1; background: #fff; border-color: color-mix(in srgb, var(--lane) 35%, #e6ebf2); }
.tx-timeline li.is-now { border-color: var(--lane-2); box-shadow: 0 0 0 4px color-mix(in srgb, var(--lane) 20%, transparent), 0 18px 34px -26px color-mix(in srgb, var(--lane) 80%, transparent); }
.tx-timeline li.is-bad { --lane: #f87171; --lane-2: #991b1b; --lane-l: #fecaca; }
.tx-timeline li i { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: #eef1f6; }
.tx-timeline li.is-done i, .tx-timeline li.is-now i { background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 8px 16px -8px color-mix(in srgb, var(--lane) 85%, transparent); }
.tx-timeline li.is-now i { animation: hp-pulse 2.4s infinite; }
.tx-timeline li i svg { width: 20px; height: 20px; fill: none; stroke: #5b6878; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tx-timeline li.is-done i svg, .tx-timeline li.is-now i svg { stroke: #06201f; }
.tx-timeline b { font-size: 12.5px; color: var(--fg); }
.tx-timeline small { font-size: 10.5px; color: var(--muted); }
.tx-timeline li.is-now small { color: var(--lane-2); font-weight: 800; }
.tx-dispute { margin-top: 16px; align-items: flex-start; }
.tx-grid { display: grid; gap: 18px; align-items: start; }
.tx-col { display: grid; gap: 14px; }
.tx-col .ky-sec { margin-bottom: 0; }
.tx-act h2 i { animation: hp-pulse 2.4s infinite; }
.tx-bank { margin: 6px 0 14px; padding: 14px 16px; border-radius: 10px; color: #fff; background: linear-gradient(135deg, #0f1a2a, #16294a 60%, #1b3a6b); box-shadow: 0 20px 40px -24px rgba(15,26,42,.8); }
.tx-bank-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dashed rgba(255,255,255,.25); }
.tx-bank-head span { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #9beef5; }
.tx-bank-head b { font-size: 22px; font-weight: 900; font-variant-numeric: tabular-nums; }
.tx-bank dl { margin: 0; display: grid; gap: 8px; }
.tx-bank dl div { display: grid; grid-template-columns: 110px 1fr; gap: 10px; align-items: baseline; font-size: 13.5px; }
.tx-bank dt { font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #9fb0c4; }
.tx-bank dd { margin: 0; font-weight: 700; }
.tx-bank code { font-size: 15px; letter-spacing: .06em; color: #7ff0ee; background: none; }
.tx-bank-ref dd small { display: block; font-size: 11px; font-weight: 600; color: #9fb0c4; }
main.inner .tx-form { max-width: none; margin-top: 8px; }
main.inner .tx-form .hp-btn { margin-top: 10px; }
.tx-nothing { display: flex; align-items: center; gap: 9px; margin: 6px 0 0; padding: 10px 12px; border-radius: 10px; background: #f7f9fc; font-size: 13.5px; color: var(--muted); }
.tx-nothing svg { flex: none; width: 18px; height: 18px; fill: none; stroke: var(--muted); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.tx-danger { margin-top: 16px; padding: 4px 14px; border-radius: 10px; border: 1px dashed rgba(15,26,42,.2); }
.tx-danger summary { cursor: pointer; padding: 8px 0; font-size: 13px; font-weight: 800; color: var(--muted); }
.tx-chat h2 em { margin-left: auto; font-style: normal; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.tx-msgs { display: grid; gap: 10px; margin: 8px 0 14px; }
.tx-msg { display: grid; grid-template-columns: 34px 1fr; column-gap: 10px; align-items: end; max-width: 88%; }
.tx-msg i { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 10px; font-style: normal; font-weight: 900; font-size: 13px; color: #06201f; background: linear-gradient(135deg, #9dd0ff, #2b7fd6); text-transform: uppercase; }
.tx-msg-buyer i { background: linear-gradient(135deg, #9beef5, #5bd9e6); }
.tx-msg-admin i { background: linear-gradient(135deg, #c4b8ff, #7c6cff); }
.tx-msg-admin i svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.tx-msg > div { padding: 10px 14px; border-radius: 10px 10px 10px 2px; background: #f3f6fa; border: 1px solid rgba(15,26,42,.06); }
.tx-msg-admin > div { background: rgba(124,108,255,.12); border-color: rgba(124,108,255,.3); }
.tx-msg small { display: block; font-size: 11px; font-weight: 700; color: var(--muted); margin-bottom: 3px; }
.tx-msg p { margin: 0; font-size: 14.5px; line-height: 1.5; }
.tx-msg.is-me { grid-template-columns: 1fr 34px; margin-left: auto; }
.tx-msg.is-me i { order: 2; }
.tx-msg.is-me > div { order: 1; border-radius: 10px 10px 2px 10px; background: linear-gradient(135deg, rgba(91,217,230,.28), rgba(24,175,255,.18)); border-color: rgba(91,217,230,.4); }
main.inner .tx-compose { max-width: none; display: grid; gap: 8px; }
main.inner .tx-compose textarea { width: 100%; min-height: 80px; padding: 12px 14px; border: 1px solid rgba(15,26,42,.14); border-radius: 10px; font: inherit; }
main.inner .tx-compose textarea:focus { outline: 0; border-color: #5bd9e6; box-shadow: 0 0 0 3px rgba(91,217,230,.25); }
main.inner .tx-compose .hp-btn { margin: 0; justify-self: end; }
.tx-aside { display: grid; gap: 14px; align-content: start; }
.tx-aside .ky-sec { margin-bottom: 0; }
.tx-money .ld-split-total + .ld-split-total { border-top: 0; padding-top: 0; }
.tx-ship { display: grid; grid-template-columns: 32px 1fr; column-gap: 10px; align-items: center; margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: rgba(43,127,214,.1); border: 1px solid rgba(43,127,214,.3); }
.tx-ship svg { width: 32px; height: 32px; padding: 6px; box-sizing: border-box; border-radius: 8px; background: linear-gradient(135deg, #9dd0ff, #2b7fd6); fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tx-ship b { display: block; font-size: 13px; }
.tx-ship small { display: block; font-size: 12px; color: var(--muted); }
.tx-ship code { background: none; color: #1b5aa3; font-weight: 800; }
.tx-events { list-style: none; margin: 4px 0 0; padding: 0; display: grid; }
.tx-events li { position: relative; display: grid; grid-template-columns: 22px 1fr; column-gap: 10px; padding: 6px 0 12px; }
.tx-events li + li::before { content: ""; position: absolute; left: 10px; top: -8px; height: 14px; width: 2px; background: rgba(15,26,42,.1); }
.tx-events li i { width: 22px; height: 22px; border-radius: 6px; background: linear-gradient(135deg, #9dd0ff, #2b7fd6); margin-top: 1px; }
.tx-ev-buyer i { background: linear-gradient(135deg, #9beef5, #5bd9e6); } .tx-ev-admin i { background: linear-gradient(135deg, #c4b8ff, #7c6cff); }
.tx-events b { display: block; font-size: 13.5px; }
.tx-events small { display: block; font-size: 11.5px; color: var(--muted); }
.tx-events em { display: block; margin-top: 4px; padding: 6px 10px; border-radius: 8px; background: #f7f9fc; font-style: normal; font-size: 12.5px; color: var(--fg); }
@media (min-width: 900px) { .tx-hero-row { grid-template-columns: 1.15fr .85fr; gap: 28px; align-items: start; } .tx-timeline { grid-template-columns: repeat(6, 1fr); gap: 12px; } .tx-timeline li + li::before { content: ""; position: absolute; left: -12px; top: 32px; width: 12px; height: 2px; background: color-mix(in srgb, var(--lane) 55%, transparent); } .tx-grid { grid-template-columns: 1.55fr 1fr; gap: 24px; } .tx-aside { position: sticky; top: 130px; } .tx-bank dl div { grid-template-columns: 130px 1fr; } }
@media (max-width: 599px) { .hp-eyebrow-fancy { white-space: normal; } .tx-hero-row > *, .ky-hero-main > * { min-width: 0; } .tx-people { gap: 6px; } .tx-arrow { display: none; } }
@media (prefers-reduced-motion: reduce) { .tx-lock-closed .tx-vault-lock, .tx-timeline li.is-now i, .tx-act h2 i { animation: none; } }
/* Harta tranzacției: aceeași hartă escrow ca pe prima pagină, dar fixată pe starea REALĂ a tranzacției (clasa txm-<status>) */
.txm { display: none; position: relative; margin: 18px 0 30px; aspect-ratio: 1000 / 300; }
.txm-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.txm-track { fill: none; stroke: rgba(15,26,42,.1); stroke-width: 2; }
.txm-flow { fill: none; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 10 12; opacity: .18; }
.txm-in { stroke: #5bd9e6; } .txm-out { stroke: #7c6cff; } .txm-goods { stroke: #2b7fd6; } .txm-back { stroke: #f87171; display: none; }
.txm-flow.is-live { opacity: 1; animation: hp-map-dash 1.6s linear infinite; }
.txm-flow.is-done { opacity: .9; stroke-dasharray: none; }
.txm-mover { display: none; filter: drop-shadow(0 4px 8px rgba(15,26,42,.3)); }
.txm-node { position: absolute; top: 50%; transform: translate(-50%, -50%); width: 13%; display: grid; justify-items: center; text-align: center; row-gap: 2px; isolation: isolate; }
.txm-buyer { left: 12%; } .txm-vault { left: 50%; width: 15%; } .txm-seller { left: 88%; }
.txm-node.is-now::before { content: ""; position: absolute; z-index: -1; inset: -12% -18% 14%; background: radial-gradient(closest-side, color-mix(in srgb, var(--lane) 55%, transparent), transparent 72%); animation: txm-glow 2.6s ease-in-out infinite; }
@keyframes txm-glow { 0%, 100% { opacity: .55; scale: .96; } 50% { opacity: 1; scale: 1.04; } }
@keyframes txm-blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.txm-ill { width: 100%; height: auto; display: block; filter: drop-shadow(0 14px 18px rgba(15,26,42,.12)); }
.txm-ill-wrap { position: relative; width: 100%; }
.txm-amount { position: absolute; left: 26%; right: 26%; top: 29%; height: 15%; display: flex; align-items: center; justify-content: center; margin: 0; white-space: nowrap; font-size: clamp(10px, .8vw, 13px); font-weight: 900; color: #4b3fd6; font-variant-numeric: tabular-nums; }
.txm-node b { font-size: 13px; color: var(--ink); margin-top: 2px; }
.txm-cap { font-size: 10.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--lane-2); }
.txm-node.is-now .txm-cap { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 6px; background: var(--lane-2); color: #fff; box-shadow: 0 8px 18px -10px var(--lane-2); }
.txm-node.is-now .txm-cap::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: txm-blink 1.6s ease-in-out infinite; }
.txm-tag { position: absolute; transform: translate(-50%, -50%); display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 10px; background: rgba(255,255,255,.92); border: 1px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); font-size: 12px; font-weight: 700; color: var(--muted); white-space: nowrap; opacity: .6; }
.txm-tag b { padding: 3px 7px; border-radius: 6px; font-size: 10.5px; font-family: ui-monospace, Menlo, Consolas, monospace; color: #fff; background: var(--lane-2); }
.txm-tag.is-live { opacity: 1; color: var(--fg); border-color: var(--lane); box-shadow: 0 0 0 4px color-mix(in srgb, var(--lane) 18%, transparent), 0 12px 24px -14px color-mix(in srgb, var(--lane) 80%, transparent); }
.txm-tag-in { left: 27%; top: 9%; } .txm-tag-out { left: 73%; top: 12%; } .txm-tag-goods { left: 50%; top: 100%; }
/* starea reală → ce se aprinde */
.txm-initiated .txm-cap-buyer::after { content: "transferă banii"; } .txm-initiated .txm-cap-vault::after { content: "seif gol"; }
.txm-initiated .txm-in { opacity: .5; }
.txm-awaiting_payment .txm-in, .txm-awaiting_payment .txm-tag-in { } .txm-awaiting_payment .txm-in { opacity: 1; animation: hp-map-dash 1.6s linear infinite; } .txm-awaiting_payment .txm-coin-in { display: block; } .txm-awaiting_payment .txm-tag-in { opacity: 1; color: var(--fg); border-color: var(--lane); box-shadow: 0 0 0 4px rgba(91,217,230,.18); }
.txm-awaiting_payment .txm-cap-buyer::after { content: "a declarat plata"; } .txm-awaiting_payment .txm-cap-vault::after { content: "verificăm extrasul"; }
.txm-payment_confirmed .txm-in, .txm-shipped .txm-in, .txm-completed .txm-in, .txm-released .txm-in, .txm-refunded .txm-in { opacity: .9; stroke-dasharray: none; }
.txm-payment_confirmed .txm-cap-vault::after, .txm-shipped .txm-cap-vault::after, .txm-completed .txm-cap-vault::after { content: "banii sunt în escrow"; }
.txm-payment_confirmed .txm-cap-seller::after { content: "expediază coletul"; }
.txm-payment_confirmed .txm-goods { opacity: .5; }
.txm-shipped .txm-goods { opacity: 1; animation: hp-map-dash 1.6s linear infinite; } .txm-shipped .txm-box { display: block; } .txm-shipped .txm-tag-goods { opacity: 1; color: var(--fg); border-color: var(--lane); box-shadow: 0 0 0 4px rgba(43,127,214,.18); }
.txm-shipped .txm-cap-seller::after { content: "a expediat"; } .txm-shipped .txm-cap-buyer::after { content: "confirmă la primire"; }
.txm-completed .txm-goods, .txm-released .txm-goods { opacity: .9; stroke-dasharray: none; }
.txm-completed .txm-cap-buyer::after { content: "a primit ✓"; } .txm-completed .txm-cap-seller::after { content: "așteaptă banii"; } .txm-completed .txm-out { opacity: .5; }
.txm-released .txm-out { opacity: 1; animation: hp-map-dash 1.6s linear infinite; } .txm-released .txm-coin-out { display: block; } .txm-released .txm-tag-out { opacity: 1; color: var(--fg); border-color: var(--lane); box-shadow: 0 0 0 4px rgba(124,108,255,.18); }
.txm-released .txm-cap-vault::after { content: "banii au fost eliberați"; } .txm-released .txm-cap-seller::after { content: "a primit banii ✓"; } .txm-released .txm-cap-buyer::after { content: "a primit ✓"; }
.txm-released .hp-lock-closed, .txm-refunded .hp-lock-closed { display: none; } .txm-released .hp-lock-open, .txm-refunded .hp-lock-open { display: block; }
.txm-refunded .txm-back { display: block; opacity: 1; animation: hp-map-dash 1.6s linear infinite; } .txm-refunded .txm-coin-back { display: block; } .txm-refunded .txm-in { opacity: .18; }
.txm-refunded .txm-cap-vault::after { content: "banii se întorc"; } .txm-refunded .txm-cap-buyer::after { content: "primește banii înapoi"; }
.txm-cancelled .txm-svg, .txm-cancelled .txm-node { filter: grayscale(1); opacity: .6; } .txm-cancelled .txm-cap-vault::after { content: "tranzacție anulată"; }
.txm-dispute .txm-vault .txm-ill { filter: drop-shadow(0 14px 18px rgba(15,26,42,.12)) drop-shadow(0 0 18px rgba(248,113,113,.7)); }
@media (min-width: 900px) { .txm { display: block; } }
@media (prefers-reduced-motion: reduce) { .txm-flow, .txm-mover, .txm-node.is-now::before, .txm-node.is-now .txm-cap::before { animation: none !important; } .txm-mover { display: none !important; } }
/* Contact: antet cu acțiuni rapide și sediul desenat, formular, ce poate face suportul, cardul bancar */
main.inner:has(.ct-hero) { background: radial-gradient(900px 480px at 0% 0%, rgba(91,217,230,.22), transparent 60%), radial-gradient(800px 480px at 100% 20%, rgba(124,108,255,.18), transparent 60%), radial-gradient(700px 500px at 50% 100%, rgba(24,175,255,.14), transparent 60%); }
.ct-quick { display: grid; gap: 10px; margin-top: 18px; }
main.inner .ct-q { display: grid; grid-template-columns: 40px 1fr; column-gap: 12px; align-items: center; padding: 10px 14px 10px 10px; border-radius: 10px; background: rgba(255,255,255,.85); border: 1px solid color-mix(in srgb, var(--lane) 35%, #e6ebf2); color: var(--fg); text-decoration: none; transition: translate .2s, box-shadow .3s, border-color .3s; }
main.inner .ct-q:hover { translate: 0 -2px; border-color: var(--lane); box-shadow: 0 18px 30px -22px color-mix(in srgb, var(--lane) 80%, rgba(15,26,42,.3)); text-decoration: none; }
.ct-q i { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ct-q svg { width: 20px; height: 20px; fill: none; stroke: #06201f; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ct-q small { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--lane-2); }
.ct-q b { display: block; font-size: 15px; }
.ct-office { position: relative; display: grid; gap: 6px; padding: 16px 18px 18px; border-radius: 10px; background: linear-gradient(160deg, rgba(255,255,255,.95), rgba(232,240,255,.9)); border: 1px solid rgba(124,108,255,.35); box-shadow: 0 30px 50px -30px rgba(124,108,255,.6); }
.ct-office-ill { width: 100%; max-width: 300px; height: auto; margin: 0 auto; filter: drop-shadow(0 14px 18px rgba(15,26,42,.12)); animation: hp-float 7s ease-in-out infinite; }
.ct-office-body small { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #4b3fd6; }
.ct-office-body address { font-style: normal; display: grid; gap: 2px; margin-top: 4px; font-weight: 700; color: var(--fg); }
.ct-office-body address span:first-child { font-size: 17px; }
.ct-office-body address span:not(:first-child) { font-size: 13.5px; font-weight: 600; color: var(--muted); }
.ct { display: grid; gap: 22px; margin-bottom: 28px; }
.ky-sec-sub { margin: 0 0 8px; font-size: 14px; color: var(--muted); }
.ct-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ct-opt { margin-left: 6px; padding: 2px 6px; border-radius: 6px; background: rgba(15,26,42,.06); font-size: 10px; letter-spacing: .04em; }
main.inner .ky-ctl textarea { width: 100%; padding: 13px 14px 13px 42px; border: 1px solid rgba(15,26,42,.14); border-radius: 10px; font: inherit; font-weight: 600; background: #fff; resize: vertical; transition: border-color .2s, box-shadow .2s; }
main.inner .ky-ctl textarea:focus { outline: 0; border-color: #5bd9e6; box-shadow: 0 0 0 3px rgba(91,217,230,.25); }
.ct-form { position: relative; padding: 26px 26px 24px; border-radius: 10px; border: 1px solid transparent; background: linear-gradient(#fff, #fff) padding-box, conic-gradient(from var(--hp-a), rgba(91,217,230,.3), #5bd9e6 30%, rgba(91,217,230,.3) 55%, #7c6cff 80%, rgba(91,217,230,.3)) border-box; box-shadow: 0 30px 60px -40px rgba(24,175,255,.5), 0 1px 2px rgba(15,26,42,.05); animation: hp-holo 9s linear infinite; scroll-margin-top: 120px; }
.ct-form-head { display: grid; grid-template-columns: 64px 1fr; column-gap: 16px; align-items: start; margin-bottom: 18px; }
.ct, .ct-main, .ct-form, .ct-form-head > *, .ct-form-body > *, .ct-stage, .ct-f { min-width: 0; }
@media (max-width: 599px) { .ct-form-head .hp-eyebrow-fancy { flex-wrap: wrap; row-gap: 4px; } }
.ct-form-head h2 { margin: 8px 0 6px; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -.02em; }
.ct-form-head p:not(.hp-eyebrow) { margin: 0; color: var(--muted); max-width: 70ch; }
.ct-form-body { display: grid; gap: 18px; }
.ct-stage { padding-top: 22px; }
.ct-stage h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; font-size: 16px; }
.ct-stage h3 i { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ct-stage h3 svg { width: 16px; height: 16px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ct-subj { display: grid; gap: 8px; margin: 8px 0 4px; }
.ct-tile { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; position: relative; display: grid; grid-template-columns: 38px 1fr; column-gap: 10px; align-items: center; padding: 10px 12px 10px 10px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 14%, #fff), #fff 65%); border: 2px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); cursor: pointer; transition: border-color .2s, box-shadow .3s, translate .2s; }
.ct-tile-pay { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.ct-tile-other { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; }
.ct-tile:hover { translate: 0 -2px; border-color: var(--lane); }
.ct-tile input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ct-tile i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 9px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ct-tile svg { width: 19px; height: 19px; fill: none; stroke: #06201f; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ct-tile b { display: block; font-size: 13.5px; line-height: 1.2; }
.ct-tile small { display: block; font-size: 11.5px; color: var(--muted); }
.ct-tile:has(input:checked) { border-color: var(--lane-2); background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 36%, #fff), color-mix(in srgb, var(--lane) 12%, #fff) 65%); box-shadow: 0 0 0 4px color-mix(in srgb, var(--lane) 22%, transparent), 0 16px 30px -22px color-mix(in srgb, var(--lane) 90%, transparent); }
.ct-tile:has(input:checked) i { background: var(--lane-2); } .ct-tile:has(input:checked) svg { stroke: #fff; }
.ct-tile:has(input:focus-visible) { outline: 2px solid var(--teal); outline-offset: 2px; }
.ct-ref { margin-top: 8px; }
.ct-ref-hint { position: absolute; right: 14px; font-size: 11px; color: var(--muted); pointer-events: none; }
.ct-submit { display: grid; gap: 12px; align-items: center; margin-top: 4px; }
main.inner .ct-submit .hp-btn { justify-content: center; padding: 14px 24px; font-size: 16px; }
.ct-submit .hp-btn svg { width: 18px; height: 18px; margin-right: 8px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ct-trust { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.ct-trust li { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--muted); }
.ct-trust svg { flex: none; width: 15px; height: 15px; fill: none; stroke: #0c7a79; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ct-env { position: relative; padding: 16px 16px 14px; border-radius: 10px; background: linear-gradient(160deg, rgba(91,217,230,.14), rgba(124,108,255,.12)); border: 1px solid rgba(91,217,230,.4); align-self: start; transition: border-color .3s, box-shadow .3s; }
.ct-env.is-ready { border-color: #7c6cff; box-shadow: 0 0 0 4px rgba(124,108,255,.18), 0 24px 40px -30px rgba(124,108,255,.8); }
.ct-env-ill { display: flex; justify-content: center; margin: -4px 0 4px; }
.ct-env-svg { width: 170px; height: auto; filter: drop-shadow(0 12px 16px rgba(15,26,42,.14)); animation: hp-float 6s ease-in-out infinite; }
.ct-env-paper { transition: translate .5s ease; }
.ct-env-seal { opacity: 0; scale: .5; transform-origin: 100px 82px; transition: opacity .35s, scale .35s cubic-bezier(.2,1.4,.4,1); }
.ct-env.is-ready .ct-env-seal { opacity: 1; scale: 1; }
.ct-env.is-ready .ct-env-paper { translate: 0 6px; }
.ct-env-head { text-align: center; margin-bottom: 10px; }
.ct-env-head b { display: block; font-size: 15px; }
.ct-env-head small { font-size: 11.5px; color: var(--muted); }
.ct-mail { display: grid; gap: 6px; padding: 10px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.1); box-shadow: 0 10px 24px -20px rgba(15,26,42,.4); }
.ct-mail-row { display: grid; grid-template-columns: 34px 1fr; column-gap: 10px; align-items: center; min-width: 0; }
.ct-mail-row span { display: grid; min-width: 0; }
.ct-mail-row small { font-size: 9.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ct-mail-row b { font-size: 13px; line-height: 1.2; overflow-wrap: anywhere; }
.ct-mail-row em { font-style: normal; font-size: 11.5px; color: var(--muted); overflow-wrap: anywhere; }
.ct-mail-row .is-empty { color: #9fb0c4; font-weight: 600; font-style: italic; }
.ct-av { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; font-style: normal; font-size: 15px; font-weight: 900; color: #06201f; background: linear-gradient(135deg, #e6ebf2, #cbd5e1); transition: background .3s; }
.ct-av-us { background: linear-gradient(135deg, #c4b8ff, #7c6cff); }
.ct-av-us svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ct-av-from.is-set { background: linear-gradient(135deg, #9beef5, #5bd9e6); }
.ct-mail-subj { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding-top: 6px; border-top: 1px dashed rgba(15,26,42,.12); }
.ct-mail-tag { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px 4px 6px; border-radius: 8px; background: linear-gradient(135deg, color-mix(in srgb, var(--lane) 28%, #fff), color-mix(in srgb, var(--lane) 10%, #fff)); border: 1px solid color-mix(in srgb, var(--lane) 45%, #e6ebf2); color: var(--lane-2); font-size: 12px; min-width: 0; }
.ct-mail-tag b { font-weight: 800; }
.ct-mail-tag svg { flex: none; width: 15px; height: 15px; fill: none; stroke: var(--lane-2); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ct-mail-tag.ct-subj-none b { font-weight: 600; font-style: italic; color: #9fb0c4; }
.ct-mail-tag.ct-subj-tranzactie { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
.ct-mail-tag.ct-subj-cont { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; }
.ct-mail-tag.ct-subj-anunt { --lane: #2b7fd6; --lane-2: #1b5aa3; --lane-l: #9dd0ff; }
.ct-mail-tag.ct-subj-plata { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.ct-mail-ref { padding: 4px 8px; border-radius: 6px; background: #0f1a2a; color: #7ff0ee; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11px; font-weight: 800; letter-spacing: .06em; }
.ct-mail-ref.is-empty { background: rgba(15,26,42,.06); color: #9fb0c4; }
.ct-mail-body { position: relative; min-height: 64px; max-height: 7.2em; overflow: hidden; padding: 8px 10px; border-radius: 8px; background: repeating-linear-gradient(180deg, transparent 0 21px, rgba(15,26,42,.06) 21px 22px) #fbfcfe; border: 1px solid rgba(15,26,42,.08); font-size: 12.5px; line-height: 22px; color: var(--fg); white-space: pre-line; overflow-wrap: anywhere; }
.ct-mail-body i { display: block; height: 8px; margin: 7px 0; border-radius: 4px; background: rgba(15,26,42,.08); width: 85%; }
.ct-mail-body i:nth-child(2) { width: 70%; } .ct-mail-body i:nth-child(3) { width: 45%; }
.ct-env-check { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.ct-env-check li { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; position: relative; display: grid; grid-template-columns: 28px 1fr; column-gap: 8px; align-items: center; padding: 7px 24px 7px 8px; border-radius: 8px; background: rgba(255,255,255,.7); border: 1px solid rgba(15,26,42,.08); transition: border-color .3s, background .3s; }
.ct-env-check li i { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 7px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); transition: background .3s; }
.ct-env-check li svg { width: 14px; height: 14px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ct-env-check li b { display: block; font-size: 12px; line-height: 1.15; color: var(--muted); }
.ct-env-check li small { display: block; font-size: 10px; color: #9fb0c4; line-height: 1.2; }
.ct-env-check li::after { content: ""; position: absolute; right: 6px; top: calc(50% - 6px); width: 12px; height: 12px; border-radius: 50%; border: 2px solid rgba(15,26,42,.15); background: #fff; }
.ct-env-check li.is-ok { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; border-color: rgba(91,217,230,.6); background: #fff; }
.ct-env-check li.is-ok b { color: var(--fg); }
.ct-env-check li.is-ok::after { border-color: #0c7a79; background: #0c7a79 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 8px no-repeat; }
.ct-env-meter { position: relative; height: 6px; margin-top: 10px; border-radius: 3px; background: rgba(15,26,42,.08); overflow: hidden; }
.ct-env-meter s { --p: 0; position: absolute; inset: 0; width: calc(var(--p) * 25%); border-radius: 3px; background: linear-gradient(90deg, #5bd9e6, #18afff, #7c6cff); transition: width .4s ease; text-decoration: none; }
.ct-env-ready { display: none; align-items: center; justify-content: center; gap: 6px; margin-top: 10px; padding: 7px 10px; border-radius: 8px; background: #4b3fd6; color: #fff; font-size: 12.5px; }
.ct-env-ready svg { width: 15px; height: 15px; fill: none; stroke: #fff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.ct-env.is-ready .ct-env-ready { display: flex; }
.ct-form.is-sending .ct-env-svg { animation: ct-fly .9s ease-in forwards; }
@keyframes ct-fly { 0% { translate: 0 0; opacity: 1; } 100% { translate: 60px -80px; opacity: 0; scale: .6; } }
@media (min-width: 900px) { .ct-form-head { grid-template-columns: 84px 1fr; column-gap: 22px; } .ct-form-body { grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; } .ct-env { position: sticky; top: 130px; } }
@media (prefers-reduced-motion: reduce) { .ct-form { animation: none; } .ct-env-svg { animation: none !important; } }
.ct-scope { padding: 18px; border-radius: 10px; background: rgba(255,255,255,.8); border: 1px solid rgba(15,26,42,.08); }
.ct-scope-head h2 { margin: 8px 0 8px; font-size: 20px; letter-spacing: -.02em; }
.ct-scope-head p { margin: 0 0 14px; font-size: 13.5px; color: var(--muted); }
.ct-scope-grid { display: grid; gap: 14px; }
.ct-can, .ct-cannot { --lane: #34d399; --lane-2: #15803d; --lane-l: #a7f3d0; position: relative; padding: 16px 16px 12px 20px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 16%, #fff), #fff 60%); border: 1px solid color-mix(in srgb, var(--lane) 40%, #e6ebf2); }
.ct-cannot { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.ct-can::before, .ct-cannot::before { content: ""; position: absolute; left: 0; top: 16px; bottom: 16px; width: 4px; border-radius: 0 4px 4px 0; background: linear-gradient(180deg, var(--lane-l), var(--lane-2)); }
.ct-can h3, .ct-cannot h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 15px; }
.ct-can h3 i, .ct-cannot h3 i { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; background: var(--lane-2); }
.ct-can h3 svg, .ct-cannot h3 svg { width: 16px; height: 16px; fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.ct-can ul, .ct-cannot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ct-can li, .ct-cannot li { display: grid; grid-template-columns: 34px 1fr; column-gap: 10px; align-items: center; padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.85); border: 1px solid color-mix(in srgb, var(--lane) 25%, #e6ebf2); }
.ct-can li i, .ct-cannot li i { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ct-can li svg, .ct-cannot li svg { width: 17px; height: 17px; fill: none; stroke: #06201f; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ct-can li b, .ct-cannot li b { display: block; font-size: 13.5px; }
.ct-can li small, .ct-cannot li small { display: block; font-size: 12px; color: var(--muted); line-height: 1.35; }
.ct-aside { display: grid; gap: 14px; align-content: start; }
.ct-bank { position: relative; overflow: hidden; margin-top: 16px; padding: 16px 18px; border-radius: 10px; color: #fff; background: linear-gradient(135deg, #18afff, #5bd9e6 45%, #7c6cff); border: 1px solid rgba(255,255,255,.35); box-shadow: 0 30px 50px -26px rgba(24,175,255,.8), inset 0 1px 0 rgba(255,255,255,.5); }
.ct-bank::after { content: ""; position: absolute; right: -60px; top: -60px; width: 200px; height: 200px; border-radius: 10px; rotate: 20deg; background: rgba(255,255,255,.12); pointer-events: none; }
.ct-bank-top { position: relative; display: grid; grid-template-columns: 44px 1fr; column-gap: 12px; align-items: center; margin-bottom: 14px; }
.ct-bank-chip { width: 44px; height: 32px; border-radius: 6px; background: linear-gradient(135deg, #ffe7a3, #e0b25a); box-shadow: inset 0 0 0 2px rgba(0,0,0,.12), inset 0 8px 0 -6px rgba(255,255,255,.6); }
.ct-bank-top small { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; opacity: .85; }
.ct-bank-top b { display: block; font-size: 14.5px; }
.ct-bank dl { position: relative; margin: 0; display: grid; gap: 8px; }
.ct-bank dl div { display: grid; gap: 2px; padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.35); }
.ct-bank dt { font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; opacity: .85; }
.ct-bank dd { margin: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
main.inner .ct-bank code { padding: 0; border: 0; background: transparent; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px; font-weight: 800; letter-spacing: 0; color: #fff; white-space: nowrap; }
main.inner .ct-copy { flex: none; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; border-radius: 6px; border: 1px solid rgba(255,255,255,.55); background: rgba(255,255,255,.18); color: #fff; cursor: pointer; transition: background .2s; }
.ct-copy svg { width: 15px; height: 15px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ct-copy .ct-copy-ok { display: none; } .ct-copy.is-done .ct-copy-ok { display: block; stroke: #0c7a79; stroke-width: 3; } .ct-copy.is-done .ct-copy-ic { display: none; }
main.inner .ct-copy:hover { background: rgba(255,255,255,.32); }
main.inner .ct-copy.is-done { background: #fff; color: #0c7a79; }
html:not(.js) .ct-copy { display: none; }
.ct-bank-note { position: relative; display: flex; gap: 8px; align-items: flex-start; margin: 12px 0 0; font-size: 12.5px; line-height: 1.4; opacity: .95; }
.ct-bank-note svg { flex: none; width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ct-tip { display: grid; grid-template-columns: 44px 1fr; column-gap: 12px; padding: 16px; border-radius: 10px; background: linear-gradient(160deg, rgba(91,217,230,.18), #fff 60%); border: 1px solid rgba(91,217,230,.45); }
.ct-tip i { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; background: linear-gradient(135deg, #9beef5, #5bd9e6); }
.ct-tip svg { width: 22px; height: 22px; fill: none; stroke: #06201f; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ct-tip b { display: block; font-size: 14.5px; }
.ct-tip span { display: block; margin: 3px 0 8px; font-size: 13px; color: var(--muted); line-height: 1.4; }
main.inner .ct-tip a { font-weight: 800; color: #0c7a79; }
@media (min-width: 700px) { .ct-quick { grid-template-columns: repeat(3, 1fr); } .ct-grid { grid-template-columns: 1fr 1fr; } .ct-submit { grid-template-columns: auto 1fr; } .ct-subj { grid-template-columns: repeat(3, 1fr); } .ct-bank dl { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 900px) { .ct { grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; } .ct-aside { position: sticky; top: 130px; } .ct-hero .ky-hero-row { grid-template-columns: 1fr 380px; } }
/* Tipuri de anunțuri: detalii pe tip în formular, pe card și pe pagina anunțului */
.lf-hint { display: inline; margin-left: 6px; font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--muted); }
.card-specs { display: flex; flex-wrap: wrap; gap: 4px; margin: 4px 0 2px; }
.card-specs em { font-style: normal; padding: 2px 7px; border-radius: 6px; background: rgba(24,175,255,.12); color: #1b5aa3; font-size: 11.5px; font-weight: 800; }
.ld-specs-list { margin: 0; display: grid; gap: 6px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.ld-specs-list div { display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px; background: #f7f9fc; border: 1px solid rgba(15,26,42,.08); }
.ld-specs-list div.is-hi { background: linear-gradient(160deg, rgba(91,217,230,.16), #fff 70%); border-color: rgba(91,217,230,.45); }
.ld-specs-list dt { font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.ld-specs-list dd { margin: 0; font-size: 14px; font-weight: 700; color: var(--fg); overflow-wrap: anywhere; }
main.wide .hp-use-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; font-weight: 800; color: var(--teal-2); text-decoration: none; }
main.wide .hp-use-link:hover { text-decoration: underline; text-underline-offset: 3px; }
/* Tranzacțiile mele: seiful cu suma în escrow, conducta cumpăr/vând/finalizate, carduri cu traseul în șase pași și „urmează” */
.tx-vault { display: grid; grid-template-columns: 84px 1fr; column-gap: 14px; align-items: center; margin-bottom: 12px; padding: 12px 16px; border-radius: 10px; background: linear-gradient(120deg, rgba(124,108,255,.28), rgba(91,217,230,.22)); border: 1px solid rgba(124,108,255,.4); }
.tx-vault-ill { width: 84px; height: 70px; filter: drop-shadow(0 10px 12px rgba(124,108,255,.35)); animation: hp-float 6s ease-in-out infinite; }
.tx-vault small { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #4b3fd6; }
.tx-vault b { display: block; font-size: 28px; font-weight: 900; letter-spacing: -.02em; line-height: 1.1; color: #0f1a2a; font-variant-numeric: tabular-nums; }
.tx-vault em { font-style: normal; font-size: 12px; color: var(--muted); }
.tx-pipe { grid-template-columns: repeat(3, 1fr); }
.tx-list { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 12px; }
.tx-card { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 16%, #fff), #fff 55%); border: 1px solid color-mix(in srgb, var(--lane) 35%, #e6ebf2); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 18px 34px -28px color-mix(in srgb, var(--lane) 70%, rgba(15,26,42,.3)); transition: translate .2s, box-shadow .3s, border-color .3s; }
.tx-card:hover { translate: 0 -3px; border-color: var(--lane); }
.tx-card.tx-payment_confirmed, .tx-card.tx-shipped, .tx-card.tx-completed { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; }
.tx-card.tx-initiated, .tx-card.tx-awaiting_payment { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.tx-card.tx-released { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
.tx-card.tx-cancelled, .tx-card.tx-refunded, .tx-card.is-dispute { --lane: #f87171; --lane-2: #991b1b; --lane-l: #fecaca; }
.tx-main { display: grid; grid-template-columns: 56px 1fr; column-gap: 14px; row-gap: 10px; padding: 14px 16px; color: var(--fg); text-decoration: none; }
.tx-main:hover { text-decoration: none; }
.tx-role { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; width: 56px; height: 56px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.tx-role svg { width: 22px; height: 22px; fill: none; stroke: #06201f; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tx-role small { font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #06201f; }
.tx-body b { display: block; font-size: 16px; line-height: 1.3; }
.tx-body > small { display: block; font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.tx-rail { list-style: none; margin: 10px 0 0; padding: 0; display: flex; gap: 4px; }
.tx-rail li { position: relative; flex: 1; padding-top: 8px; font-size: 9.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #9fb0c4; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tx-rail li::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; border-radius: 2px; background: rgba(15,26,42,.08); }
.tx-rail li.on { color: var(--lane-2); }
.tx-rail li.on::before { background: linear-gradient(90deg, var(--lane), var(--lane-2)); }
.tx-side { grid-column: 1 / -1; display: grid; gap: 6px; justify-items: start; }
.tx-amount { font-size: 20px; font-weight: 900; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.tx-next { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--fg); background: #fff; border: 1px solid color-mix(in srgb, var(--lane) 35%, #e6ebf2); border-radius: 8px; padding: 5px 10px 5px 8px; }
.tx-next svg { flex: none; width: 14px; height: 14px; fill: none; stroke: var(--lane-2); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
@media (min-width: 900px) { .tx-main { grid-template-columns: 56px 1fr 240px; align-items: center; padding: 16px 20px; } .tx-side { grid-column: auto; justify-items: end; text-align: right; } .tx-rail li { font-size: 10px; } }
@media (prefers-reduced-motion: reduce) { .tx-vault-ill { animation: none; } }
/* Anunțurile mele: contoare în antet, filtre pe stare, carduri ca în listă cu panglică de stare și acțiuni */
main.inner .ml-new { margin-top: 14px; }
.ml-stats { margin: 0; grid-template-columns: repeat(2, 1fr); }
.ml-stats li { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; }
.ml-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.ml-filters a { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 28%, #fff), color-mix(in srgb, var(--lane) 10%, #fff)); border: 1px solid color-mix(in srgb, var(--lane) 45%, #fff); color: var(--fg); font-weight: 700; font-size: 13.5px; text-decoration: none; transition: border-color .2s, box-shadow .2s, translate .2s; }
.ml-filters a i { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ml-filters a svg { width: 15px; height: 15px; fill: none; stroke: #0f1a2a; stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; }
.ml-filters a b { min-width: 22px; padding: 2px 7px; border-radius: 6px; background: rgba(255,255,255,.7); font-size: 12px; text-align: center; color: var(--lane-2); }
.ml-filters a:hover { translate: 0 -2px; border-color: var(--lane); text-decoration: none; }
.ml-filters a.is-on { border-color: var(--lane-2); background: linear-gradient(160deg, var(--lane-l), var(--lane)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lane) 25%, transparent), 0 12px 24px -16px color-mix(in srgb, var(--lane) 90%, transparent); }
.ml-filters a.is-on i { background: #0f1a2a; } .ml-filters a.is-on svg { stroke: #fff; }
.ml-filters a.is-on b { background: var(--lane-2); color: #fff; }
.ml-filters a.ml-f-all { --lane: #18afff; --lane-2: #1b5aa3; --lane-l: #9dd0ff; }
.ml-filters a.ml-f-active { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; }
.ml-filters a.ml-f-reserved { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.ml-filters a.ml-f-sold { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
.ml-filters a.ml-f-removed { --lane: #f87171; --lane-2: #991b1b; --lane-l: #fecaca; }
.ml-card.ac-st-draft { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; }
.ml-filters a.ml-f-inactive, .ml-card.ac-st-inactive { --lane: #94a3b8; --lane-2: #334155; --lane-l: #e2e8f0; }
.ml-card.ac-st-inactive .card-media { opacity: .75; }
.ml-act-form { display: contents; }
main.inner .ml-act-form button.ml-act { display: inline-flex; margin: 0; padding: 7px 11px; border: 1px solid transparent; border-radius: 8px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); color: #06201f; font: inherit; font-size: 12.5px; font-weight: 700; line-height: normal; cursor: pointer; box-shadow: none; }
main.inner .ml-act-form button.ml-act:hover { filter: brightness(1.05); background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ml-card.ac-st-reserved { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.ml-card.ac-st-sold { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
.ml-card.ac-st-removed { --lane: #f87171; --lane-2: #991b1b; --lane-l: #fecaca; }
.ml-card.ac-st-removed .card-media, .ml-card.ac-st-removed strong { opacity: .6; }
.ml-ribbon { position: absolute; right: -34px; top: 16px; display: inline-flex; align-items: center; gap: 5px; padding: 5px 40px; transform: rotate(45deg); background: var(--lane-2); color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; box-shadow: 0 6px 14px -6px rgba(15,26,42,.6); }
.ml-ribbon svg { width: 12px; height: 12px; fill: none; stroke: #fff; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.ml-card-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 4px 8px 12px; }
.ml-act { display: inline-flex; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 8px; background: #fff; border: 1px solid color-mix(in srgb, var(--lane) 35%, #e6ebf2); color: var(--lane-2); font-size: 12.5px; font-weight: 700; text-decoration: none; transition: border-color .2s, background .2s; }
.ml-act svg { flex: none; width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ml-act:hover { border-color: var(--lane); background: color-mix(in srgb, var(--lane) 10%, #fff); text-decoration: none; }
.ml-act-main { color: #06201f; background: linear-gradient(135deg, var(--lane-l), var(--lane)); border-color: transparent; }
.ml-hint { margin-left: auto; font-size: 11.5px; font-weight: 700; color: var(--muted); }
@media (min-width: 900px) { .ml-stats { grid-template-columns: repeat(4, 1fr); gap: 10px; } .ml-stats li { padding: 12px 12px 10px; } }
.ml-stats b { font-size: 26px; }
/* Listele din cont (anunțurile mele, tranzacțiile mele): rânduri-card cu miniatură/iconiță, stare colorată, bară de progres la tranzacții */
.ml-actions { position: relative; margin-top: 16px; }
main.inner .ml-actions .hp-btn { margin: 0; }
.ml-list { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 10px; }
.ml-item { --lane: #9fb0c4; --lane-2: #475569; --lane-l: #cbd5e1; position: relative; border-radius: 10px; background: linear-gradient(160deg, color-mix(in srgb, var(--lane) 12%, #fff), #fff 55%); border: 1px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 16px 30px -26px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.3)); transition: translate .2s, box-shadow .3s, border-color .3s; }
.ml-item:hover { translate: 0 -2px; border-color: var(--lane); }
.ml-item.ac-st-active, .ml-item.tx-payment_confirmed, .ml-item.tx-shipped, .ml-item.tx-completed { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; }
.ml-item.ac-st-reserved, .ml-item.tx-initiated, .ml-item.tx-awaiting_payment { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
.ml-item.ac-st-sold, .ml-item.tx-released { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
.ml-item.ac-st-removed, .ml-item.tx-cancelled, .ml-item.tx-refunded, .ml-item.is-dispute { --lane: #f87171; --lane-2: #991b1b; --lane-l: #fecaca; }
.ml-main { display: grid; grid-template-columns: 64px 1fr; grid-template-rows: auto auto; column-gap: 14px; row-gap: 6px; align-items: center; padding: 12px 14px; color: var(--fg); text-decoration: none; }
.ml-main:hover { text-decoration: none; }
.ml-thumb { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 10px; overflow: hidden; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.ml-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ml-thumb i { display: flex; }
.ml-thumb svg { width: 28px; height: 28px; fill: none; stroke: #06201f; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.ml-body b { display: block; font-size: 15.5px; line-height: 1.3; }
.ml-body small { display: block; font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.ml-ref { font-family: ui-monospace, Menlo, Consolas, monospace; font-weight: 800; color: var(--lane-2); text-decoration: none; }
.ml-dispute { color: #991b1b; }
.ml-body .ac-prog { display: block; max-width: 320px; margin-top: 8px; }
.ml-price { font-size: 17px; font-weight: 900; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.ml-status { display: inline-flex; align-items: center; gap: 6px; justify-self: start; font-style: normal; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lane-2); background: color-mix(in srgb, var(--lane) 16%, transparent); border-radius: 6px; padding: 4px 9px; }
.ml-status svg { width: 13px; height: 13px; fill: none; stroke: var(--lane-2); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.ml-links { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 14px 12px 92px; }
.ml-links a { font-size: 12.5px; font-weight: 700; color: var(--lane-2); background: #fff; border: 1px solid color-mix(in srgb, var(--lane) 35%, #e6ebf2); border-radius: 8px; padding: 5px 10px; text-decoration: none; }
.ml-links a:hover { border-color: var(--lane); text-decoration: none; }
.au-tips { margin-top: 18px; }
@media (min-width: 900px) { .ml-main { grid-template-columns: 64px 1fr auto auto; grid-template-rows: auto; column-gap: 18px; padding: 14px 18px; } .ml-thumb { grid-row: auto; } .ml-status { justify-self: end; } .ml-price { text-align: right; } .ml-links { padding-left: 100px; } .ml-actions { position: absolute; right: 34px; top: 34px; margin: 0; } }
@media (min-width: 900px) { .ky-hero { padding: 28px 34px; } .ky-hero-row { grid-template-columns: 1fr 360px; gap: 32px; } .ky-hero-main { grid-template-columns: 84px 1fr; column-gap: 22px; } .ky { grid-template-columns: 1.6fr 1fr; gap: 28px; } .ky-side { position: sticky; top: 130px; } .ky-types { grid-template-columns: 1fr 1fr; } .ky-grid { grid-template-columns: 1fr 1fr; } .ky-field:has(textarea) { grid-column: 1 / -1; } }
@media (prefers-reduced-motion: reduce) { .ky-ill, .lf-live { animation: none; } .ky-sec, .lf-pv-card .is-flash { animation: none !important; } }
@media (min-width: 900px) { .ld { grid-template-columns: 1.55fr 1fr; gap: 32px; } .ld-side { position: sticky; top: 130px; } }
@media (prefers-reduced-motion: reduce) { .ld-seal i, .ld-stage-empty i, .ld-stage, .ld-avatar i, .ld-rail li.is-next i, .ld-orb, .ac-panel-ill, .ac-track li.is-now i { animation: none; } .ld-shot { animation: none !important; } }
/* Autentificare: card cu chenar holografic + panou lateral închis cu seif și trei puncte */
.au { display: grid; gap: 22px; max-width: 1040px; margin: 16px auto 24px; }
.au-card { position: relative; padding: 30px 26px 26px; border-radius: 10px; border: 1px solid transparent; background: linear-gradient(#fff, #fff) padding-box, conic-gradient(from var(--hp-a), rgba(91,217,230,.3), #5bd9e6 30%, rgba(91,217,230,.3) 55%, #18afff 80%, rgba(91,217,230,.3)) border-box; box-shadow: 0 30px 60px -40px rgba(24,175,255,.5), 0 1px 2px rgba(15,26,42,.05); animation: hp-holo 9s linear infinite; }
.au-card h1 { margin: 14px 0 6px; font-size: clamp(28px, 3.2vw, 38px); letter-spacing: -.02em; }
.au-sub { margin: 0 0 18px; color: var(--muted); }
main.inner form.au-form { max-width: none; }
main.inner .au-form label { margin: 14px 0 6px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.au-ctl { position: relative; display: flex; align-items: center; }
.au-ctl > svg { position: absolute; left: 14px; width: 18px; height: 18px; fill: none; stroke: #0c7a79; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
main.inner .au-ctl input { width: 100%; padding: 13px 14px 13px 42px; border: 1px solid rgba(15,26,42,.14); border-radius: 10px; font: inherit; font-weight: 600; background: #fff; transition: border-color .2s, box-shadow .2s; }
main.inner .au-ctl input:focus { outline: 0; border-color: #5bd9e6; box-shadow: 0 0 0 3px rgba(91,217,230,.25); }
.au-row { display: flex; justify-content: flex-end; margin-top: 10px; font-size: 13.5px; }
main.inner .au-row a { display: inline-block; padding: 4px 0; font-weight: 700; color: #0c7a79; text-decoration: underline; text-underline-offset: 3px; }
main.inner button.au-cta { width: 100%; margin-top: 18px; justify-content: center; border-radius: 10px; padding: 14px 20px; font-size: 16px; }
.au-error { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; padding: 12px 14px; border-radius: 10px; background: #fcefee; border: 1px solid #f2b8b8; color: var(--danger); font-weight: 600; }
.au-error svg { flex: none; width: 18px; height: 18px; fill: none; stroke: var(--danger); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.au-alt { margin: 18px 0 0; text-align: center; color: var(--muted); }
main.inner .au-alt a { font-weight: 800; color: #0c7a79; text-decoration: underline; text-underline-offset: 3px; }
.au-side { position: relative; overflow: hidden; display: none; padding: 34px 30px; border-radius: 10px; color: #e8eef6; background: linear-gradient(165deg, #152540, #0e1827 70%); box-shadow: 0 30px 60px -40px rgba(15,26,42,.8); }
.au-side::before { content: ""; position: absolute; inset: 0; background: radial-gradient(420px 260px at 90% 0%, rgba(91,217,230,.22), transparent 65%), radial-gradient(380px 260px at 0% 100%, rgba(124,108,255,.22), transparent 65%); pointer-events: none; }
.au-ill { position: relative; width: 190px; height: 158px; flex: none; display: block; margin: 0 auto 14px; filter: drop-shadow(0 20px 24px rgba(0,0,0,.4)); animation: hp-float 6s ease-in-out infinite; }
.au-side h2 { position: relative; margin: 0 0 18px; font-size: 24px; line-height: 1.2; color: #fff; text-align: center; }
.au-points { position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.au-points li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); font-size: 14px; font-weight: 600; color: #dfe7f1; }
.au-points i { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(91,217,230,.16); box-shadow: inset 0 0 0 1px rgba(91,217,230,.35); flex: none; }
.au-points svg { width: 18px; height: 18px; fill: none; stroke: #7ff0ee; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.au-steps { list-style: none; margin: 0 0 6px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.au-steps li { display: inline-flex; align-items: center; gap: 7px; padding: 5px 11px 5px 5px; border-radius: 10px; background: #f7f9fc; border: 1px solid rgba(15,26,42,.08); font-size: 12.5px; font-weight: 700; color: var(--muted); }
.au-steps b { width: 20px; height: 20px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 10.5px; font-weight: 900; color: #fff; background: #9fb0c4; }
.au-steps li:first-child, .au-steps li.is-now { color: #0c7a79; background: rgba(91,217,230,.14); border-color: rgba(91,217,230,.45); }
.au-steps li:first-child b, .au-steps li.is-now b { background: #0c7a79; }
.au-steps li.is-done { color: #0c7a79; }
.au-steps li.is-done b { background: linear-gradient(135deg, #9beef5, #5bd9e6); color: #06201f; }
.au-steps-center { justify-content: center; margin: 14px 0 18px; }
.au-steps-center li:first-child:not(.is-now):not(.is-done) { color: var(--muted); background: #f7f9fc; border-color: rgba(15,26,42,.08); }
.au-ctl.is-invalid input { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(214,0,0,.12); }
.au-field-error { margin: 6px 0 0; font-size: 13px; font-weight: 600; color: var(--danger); }
.au-fine { margin: 14px 0 0; font-size: 12.5px; color: var(--muted); line-height: 1.5; }
main.inner .au-fine a { color: #0c7a79; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.au-single { max-width: 640px; }
@media (min-width: 900px) { .au.au-single { grid-template-columns: 1fr; } }
.au-center { text-align: center; }
.au-big-ic { display: flex; align-items: center; justify-content: center; width: 72px; height: 72px; margin: 0 auto 8px; border-radius: 10px; background: linear-gradient(135deg, #9beef5, #5bd9e6); box-shadow: 0 14px 28px -12px rgba(91,217,230,.9); }
.au-big-ic svg { width: 34px; height: 34px; fill: none; stroke: #06201f; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.au-ill-phone { width: 200px; height: 160px; }
.au-big-ic-warn { background: linear-gradient(135deg, #fed7aa, #fb923c); box-shadow: 0 14px 28px -12px rgba(251,146,60,.9); }
.au-big-ic-warn svg { stroke: #7c2d12; }
.au-big-ic-bad { background: linear-gradient(135deg, #fecaca, #f87171); box-shadow: 0 14px 28px -12px rgba(248,113,113,.9); }
.au-big-ic-bad svg { stroke: #7f1d1d; }
.nf-ill { width: 260px; max-width: 100%; height: auto; margin: 0 auto 4px; filter: drop-shadow(0 16px 20px rgba(15,26,42,.14)); }
.nf-route { animation: hp-map-dash 1.6s linear infinite; }
.nf-q { animation: hp-float 5s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.nf-code { margin: 4px 0 0; font-size: clamp(44px, 7vw, 64px); font-weight: 900; letter-spacing: -.04em; line-height: 1; background: linear-gradient(90deg, #5bd9e6, #18afff, #7c6cff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nf .au-card h1 { margin-top: 6px; }
@media (prefers-reduced-motion: reduce) { .nf-route, .nf-q { animation: none; } }
.au-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 18px; }
/* Schimbă parola: formular + cadran circular al tăriei parolei (JS), reguli, ochi de afișare, potrivire */
.pw.au-single { max-width: 980px; }
.pw-card { padding: 0; overflow: hidden; }
.pw-grid { display: grid; }
.pw-form { padding: 30px 26px 26px; }
main.inner form.pw-form { max-width: none; }
.pw-form h1 { margin: 14px 0 6px; font-size: clamp(26px, 3vw, 34px); letter-spacing: -.02em; }
.pw-ctl input { padding-right: 46px; }
.pw-eye { position: absolute; right: 8px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 0; border-radius: 8px; background: transparent; cursor: pointer; margin: 0; padding: 0; }
main.inner button.pw-eye { margin: 0; padding: 0; background: transparent; }
main.inner button.pw-eye:hover { background: rgba(91,217,230,.16); }
.pw-eye svg { width: 18px; height: 18px; fill: none; stroke: var(--muted); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pw-eye.is-on svg { stroke: #0c7a79; }
.pw-match { position: absolute; right: 12px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.pw-match.is-ok { color: #0c7a79; } .pw-match.is-bad { color: #991b1b; }
.pw-gauge-wrap { display: grid; justify-items: center; align-content: start; gap: 12px; padding: 30px 26px; background: linear-gradient(165deg, rgba(91,217,230,.22), rgba(124,108,255,.12) 60%, rgba(24,175,255,.16)); border-top: 1px solid rgba(91,217,230,.35); }
.pw-gauge { position: relative; width: 150px; height: 150px; }
.pw-gauge svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.pw-ring-bg { fill: none; stroke: rgba(15,26,42,.1); stroke-width: 10; }
.pw-ring { fill: none; stroke: #9fb0c4; stroke-width: 10; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset .5s cubic-bezier(.2,.8,.2,1), stroke .3s; }
.pw-gauge[data-score="1"] .pw-ring { stroke-dashoffset: 75; stroke: #f87171; }
.pw-gauge[data-score="2"] .pw-ring { stroke-dashoffset: 50; stroke: #ffb547; }
.pw-gauge[data-score="3"] .pw-ring { stroke-dashoffset: 25; stroke: #34d399; }
.pw-gauge[data-score="4"] .pw-ring { stroke-dashoffset: 0; stroke: #16a34a; }
.pw-gauge-in { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; line-height: 1; }
.pw-score { font-size: 40px; font-weight: 900; letter-spacing: -.03em; color: #0f1a2a; }
.pw-gauge-in small { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-top: 4px; }
.pw-label { margin: 0; font-size: 15px; font-weight: 800; color: var(--muted); }
.pw-gauge-wrap:has([data-score="1"]) .pw-label { color: #991b1b; } .pw-gauge-wrap:has([data-score="2"]) .pw-label { color: #92400e; } .pw-gauge-wrap:has([data-score="3"]) .pw-label, .pw-gauge-wrap:has([data-score="4"]) .pw-label { color: #15803d; }
.pw-rules { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 6px; width: 100%; }
.pw-rules li { display: grid; grid-template-columns: 20px 1fr; column-gap: 9px; align-items: center; padding: 8px 12px; border-radius: 10px; background: rgba(255,255,255,.8); border: 1px solid rgba(15,26,42,.08); font-size: 13px; font-weight: 600; color: var(--muted); }
.pw-rules li i { width: 20px; height: 20px; border-radius: 6px; border: 2px solid rgba(15,26,42,.18); background: #fff; }
.pw-rules li.is-ok { color: var(--fg); border-color: rgba(12,122,121,.35); }
.pw-rules li.is-ok i { border-color: #0c7a79; background: #0c7a79 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 12px no-repeat; }
.pw-note { display: flex; align-items: center; gap: 8px; margin: 6px 0 0; font-size: 12px; color: var(--muted); }
.pw-note svg { flex: none; width: 16px; height: 16px; fill: none; stroke: #0c7a79; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
@media (min-width: 900px) { .pw-grid { grid-template-columns: 1.1fr .9fr; } .pw-form { padding: 38px 36px 32px; } .pw-gauge-wrap { border-top: 0; border-left: 1px solid rgba(91,217,230,.35); padding: 38px 30px; } .pw.au-single.au { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .pw-ring { transition: none; } }
/* /inregistrare (2026-09-24): panoul lateral deschis la culoare, cu previzualizarea cardului de membru
   (se umple la tastare: data-mirror în site.js), traseul în patru pași și trei puncte de încredere */
.au-side.rg-side { display: grid; gap: 16px; align-content: start; padding: 26px 26px 24px; color: var(--fg); border: 1px solid transparent; background: linear-gradient(160deg, #fff, #f3f9ff 55%, #f5f2ff) padding-box, conic-gradient(from var(--hp-a), #5bd9e6, #18afff 35%, #7c6cff 60%, #5bd9e6) border-box; box-shadow: 0 30px 60px -44px rgba(24,175,255,.6), 0 1px 2px rgba(15,26,42,.05); animation: hp-holo 12s linear infinite; }
.au-side.rg-side::before { background: radial-gradient(420px 260px at 100% 0%, rgba(91,217,230,.2), transparent 65%), radial-gradient(360px 240px at 0% 100%, rgba(124,108,255,.16), transparent 65%); }
.rg-eyebrow { position: relative; display: flex; align-items: center; gap: 8px; margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--fg); }
.rg-eyebrow i { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 7px; background: linear-gradient(135deg, #9beef5, #5bd9e6); }
.rg-eyebrow svg { width: 14px; height: 14px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.rg-member { animation: rg-float 6s ease-in-out infinite; }
@keyframes rg-float { 0%, 100% { transform: rotate(-1deg) translateY(0); } 50% { transform: rotate(-1deg) translateY(-5px); } }
.rg-member .ac-member-name { min-height: 22px; }
.rg-member .ac-member-top span { display: none; } /* locul lui e luat de ștampila „escrow” */
.rg-member .ac-member-name span:empty::before, .rg-member .rg-member-email:empty::before { content: attr(data-placeholder); opacity: .8; }
.rg-member-email { position: relative; margin-top: 2px; font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,.9); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rg-member .ac-member-foot { flex-wrap: wrap; gap: 10px 16px; }
.rg-stamp { position: absolute; right: 16px; top: 14px; display: inline-flex; align-items: center; gap: 5px; padding: 3px 8px; border-radius: 6px; border: 2px solid rgba(255,255,255,.85); color: #fff; font-size: 10px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; transform: rotate(8deg); }
.rg-stamp svg { width: 12px; height: 12px; fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.rg-journey { position: relative; list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 8px; }
.rg-journey li { position: relative; display: grid; grid-template-columns: 36px 1fr; column-gap: 12px; align-items: center; padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.75); border: 1px solid rgba(15,26,42,.08); opacity: .8; }
.rg-journey li + li::before { content: ""; position: absolute; left: 27px; top: -9px; width: 2px; height: 10px; background: rgba(15,26,42,.15); }
.rg-journey li i { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 9px; background: rgba(15,26,42,.06); }
.rg-journey li svg { width: 17px; height: 17px; fill: none; stroke: #5b6878; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rg-journey li.is-now { opacity: 1; border-color: rgba(91,217,230,.6); background: #fff; box-shadow: 0 12px 24px -18px rgba(91,217,230,.9); }
.rg-journey li.is-now i { background: linear-gradient(135deg, #9beef5, #5bd9e6); animation: hp-pulse 2.4s infinite; } .rg-journey li.is-now svg { stroke: #06201f; }
.rg-journey b { display: block; font-size: 13.5px; line-height: 1.2; } .rg-journey small { display: block; font-size: 11.5px; color: var(--muted); }
.rg-points { position: relative; list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 6px; }
.rg-points li { --lane: #5bd9e6; --lane-l: #9beef5; display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 700; color: var(--fg); }
.rg-points li.is-blue { --lane: #18afff; --lane-l: #9dd0ff; } .rg-points li.is-violet { --lane: #7c6cff; --lane-l: #c4b8ff; }
.rg-points i { display: flex; align-items: center; justify-content: center; flex: none; width: 26px; height: 26px; border-radius: 7px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.rg-points svg { width: 14px; height: 14px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
main.inner .au-cta { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.au-cta-ic { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 899px) { .au-side.rg-side { display: grid; } }
@media (prefers-reduced-motion: reduce) { .au-side.rg-side, .rg-member, .rg-journey li.is-now i { animation: none; } }
/* /autentificare (2026-09-24): panoul lateral deschis, seiful plutind, „ce găsești în cont” ca plăci; ochi pe parolă */
.lg-safe { position: relative; display: flex; justify-content: center; padding: 6px 0 0; }
.lg-safe::before { content: ""; position: absolute; left: 50%; top: 50%; width: 220px; height: 150px; translate: -50% -50%; border-radius: 10px; background: radial-gradient(closest-side, rgba(124,108,255,.28), transparent); filter: blur(10px); }
.lg-safe .au-ill { margin: 0; width: 220px; height: 184px; animation: rg-float 6s ease-in-out infinite; filter: drop-shadow(0 18px 24px rgba(124,108,255,.35)); }
.au-side.rg-side h2.lg-h { position: relative; margin: 0; font-size: 22px; line-height: 1.2; text-align: center; color: var(--fg); text-shadow: none; }
.lg-tiles { position: relative; list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.lg-tiles li { --lane: #5bd9e6; --lane-l: #9beef5; --lane-2: #0c7a79; display: grid; grid-template-columns: 34px 1fr; column-gap: 10px; align-items: center; padding: 8px 10px 8px 8px; border-radius: 10px; background: rgba(255,255,255,.8); border: 1px solid color-mix(in srgb, var(--lane) 30%, #e6ebf2); transition: translate .2s, box-shadow .3s; }
.lg-tiles li:hover { translate: 0 -2px; box-shadow: 0 14px 24px -18px var(--lane); }
.lg-tiles li.is-blue { --lane: #18afff; --lane-l: #9dd0ff; --lane-2: #1b5aa3; } .lg-tiles li.is-violet { --lane: #7c6cff; --lane-l: #c4b8ff; --lane-2: #4b3fd6; } .lg-tiles li.is-amber { --lane: #ffb547; --lane-l: #ffd699; --lane-2: #b45309; }
.lg-tiles i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 8px 14px -8px var(--lane); }
.lg-tiles svg { width: 16px; height: 16px; fill: none; stroke: #06201f; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.lg-tiles b { font-size: 13px; line-height: 1.2; } .lg-tiles small { font-size: 11px; color: var(--lane-2); font-weight: 700; }
main.inner .au-eye { position: absolute; right: 8px; top: 50%; translate: 0 -50%; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer; transition: background .2s, color .2s; }
main.inner .au-eye:hover { background: rgba(91,217,230,.16); color: #0c7a79; }
.au-eye svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.au-eye .au-eye-off { display: none; } .au-eye.is-on .au-eye-off { display: block; } .au-eye.is-on .au-eye-on { display: none; }
main.inner .au-ctl:has(.au-eye) input { padding-right: 48px; }
@media (max-width: 479px) { .lg-tiles { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .lg-safe .au-ill { animation: none; } }
/* /parola-uitata + /parola-uitata/trimis (2026-09-24): panou lateral deschis cu plicul, lacătul și cheia
   (cheia zboară spre lacăt, lacătul se deschide), pașii recuperării și reguli de siguranță; sfaturi pe pagina „trimis” */
.fg-scene { position: relative; display: flex; justify-content: center; }
.fg-scene svg { width: 240px; height: 170px; overflow: visible; }
.fg-env { animation: rg-float 6s ease-in-out infinite; filter: drop-shadow(0 16px 20px rgba(24,175,255,.22)); }
.fg-key { transform-box: fill-box; transform-origin: center; animation: fg-key 7s ease-in-out infinite; filter: drop-shadow(0 8px 10px rgba(255,181,71,.5)); }
@keyframes fg-key { 0%, 15% { translate: 0 0; rotate: -12deg; opacity: 1; } 45% { translate: 0 -6px; rotate: -12deg; } 60%, 70% { translate: 48px 70px; rotate: 20deg; opacity: 1; } 78% { opacity: 0; translate: 48px 70px; } 90%, 100% { opacity: 0; translate: 0 0; rotate: -12deg; } }
.fg-shackle { transform-box: fill-box; transform-origin: 50% 100%; animation: fg-shackle 7s ease-in-out infinite; }
@keyframes fg-shackle { 0%, 66% { translate: 0 0; rotate: 0deg; } 74%, 88% { translate: -3px -7px; rotate: -18deg; } 96%, 100% { translate: 0 0; rotate: 0deg; } }
.fg-lock { animation: fg-lock 7s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes fg-lock { 0%, 66% { scale: 1; } 72% { scale: 1.08; } 80%, 100% { scale: 1; } }
.fg-spark { animation: lps-twinkle 2.4s ease-in-out infinite; }
.fg-side .rg-journey li.is-done { opacity: 1; border-color: rgba(22,163,74,.35); }
.fg-side .rg-journey li.is-done i { background: linear-gradient(135deg, #86efac, #16a34a); } .fg-side .rg-journey li.is-done svg { stroke: #fff; }
.rg-points a { font-weight: 800; color: #0c7a79; }
.fg-tips { margin: 18px 0 0; padding: 14px 16px; border-radius: 10px; text-align: left; background: linear-gradient(135deg, rgba(255,181,71,.12), rgba(255,224,138,.18)); border: 1px solid rgba(255,181,71,.45); }
.fg-tips-h { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 14px; font-weight: 800; color: #7c2d12; }
.fg-tips-h i { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 7px; background: linear-gradient(135deg, #ffe08a, #ffb547); }
.fg-tips-h svg { width: 14px; height: 14px; fill: none; stroke: #7a4a00; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.fg-tips ul { margin: 0; padding: 0 0 0 18px; display: grid; gap: 4px; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.fg-tips li b { color: var(--fg); }
main.inner .fg-sent .au-actions .hp-btn-ghost { background: #fff; color: #0c7a79; border: 1px solid rgba(91,217,230,.6); box-shadow: none; }
@media (prefers-reduced-motion: reduce) { .fg-env, .fg-key, .fg-shackle, .fg-lock, .fg-spark { animation: none; } }
@media (min-width: 900px) { .au { grid-template-columns: 1.05fr .95fr; gap: 28px; align-items: stretch; margin-top: 28px; } .au-card { padding: 38px 36px 32px; } .au-side { display: flex; flex-direction: column; justify-content: center; } }
@media (prefers-reduced-motion: reduce) { .au-card, .au-ill { animation: none; } }
.price.big { font-size: 28px; font-weight: 800; margin: 0 0 8px; }
.gallery { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 18px; }
.gallery img { max-width: 100%; height: auto; max-height: 480px; width: auto; border-radius: 0 10px 10px 10px; border: 1px solid var(--line); }
.thumbs { list-style: none; padding: 0; margin: 0 0 16px; display: flex; flex-wrap: wrap; gap: 12px; }
.thumbs img { width: 160px; height: 120px; object-fit: cover; border-radius: 0 10px 10px 10px; border: 1px solid var(--line); display: block; margin-bottom: 4px; }
.cats { list-style: none; padding: 0; margin: 0 0 16px; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.cats li { background: var(--accent-card); border: 1px solid var(--accent-line); border-radius: var(--radius); padding: 12px 16px; }
.cats li > a { font-weight: 800; color: var(--dark); font-size: 17px; }
.cats .sub { margin-top: 4px; font-size: .95rem; }
.cats .sub a { color: var(--blue-dark); font-weight: 600; }

/* Tranzacții și chat */
.steps { padding-left: 20px; margin: 0 0 18px; }
.steps li { color: var(--muted); margin: 5px 0; }
.steps li.done { color: var(--ok); }
.steps li.current { color: var(--fg); font-weight: 800; }
.chat .msg { border-bottom: 1px solid var(--line); padding: 8px 0; }
.chat .msg.admin { background: var(--accent-pale); padding: 8px 10px; border-radius: var(--radius); }
.chat .msg p { margin: 2px 0 0; }

@media (max-width: 600px) {
  html { font-size: 15px; }
  main.inner { padding: 16px var(--gutter) 40px; }
  .site-header .bar { padding: 8px 12px; gap: 6px 10px; }
  .site-header .brand { width: 110px; height: 36px; }
  .site-header nav { width: 100%; margin-left: 0; justify-content: space-between; }
  .site-header nav a, .site-header nav button { padding: 6px 8px; font-size: 14px; }
  .site-header nav a.signup, .site-header nav a.login { padding: 6px 12px; }
  .hero .card { border-radius: 0 10px 10px 10px; padding: 20px; }
}

footer { background: #0f1a2a; }
.layer-workflow, .layer-products { display: none; }
/* Footer (toate paginile): fundal închis cu sfere de lumină, linie de date cu punct care circulă, brand + coloane cu iconițe, bară legală */
.ft { position: relative; overflow: hidden; color: #b7c3d3; background: #0f1a2a; font-size: 14px; }
.ft::before { content: ""; position: absolute; inset: 0; background: radial-gradient(720px 360px at 6% 0%, rgba(91,217,230,.18), transparent 65%), radial-gradient(640px 360px at 94% 100%, rgba(124,108,255,.2), transparent 65%), radial-gradient(500px 300px at 50% 60%, rgba(24,175,255,.1), transparent 65%); pointer-events: none; }
.ft-mark { position: absolute; right: -60px; bottom: -80px; width: 420px; height: 420px; fill: none; stroke: rgba(255,255,255,.05); stroke-width: .6; pointer-events: none; }
.ft-wrap { position: relative; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.ft-wrap::before { content: ""; position: absolute; left: var(--gutter); right: var(--gutter); top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(91,217,230,.6) 20%, rgba(124,108,255,.6) 80%, transparent); }
.ft-wrap::after { content: ""; position: absolute; top: -3px; left: var(--gutter); width: 120px; height: 7px; border-radius: 10px; background: radial-gradient(closest-side, #7ff0ee, rgba(91,217,230,.5) 50%, transparent); filter: blur(1px); animation: hp-run 7s linear infinite; }
/* fluxul escrow în cinci noduri (2026-09-24: linia nu mai trece peste casete — pe desktop
   iconițele stau deasupra casetelor, linia punctată curge printre ele, iar o monedă și un
   colet merg pe ea în buclă de 12 s; nodul la care ajung se aprinde) */
.ft-flow { position: relative; padding: 32px 0 6px; }
.ft-flow-h { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 12px; margin: 0 0 22px; font-size: 13px; color: #9fb0c4; }
.ft-flow-h span { display: inline-flex; align-items: center; gap: 7px; padding: 4px 10px 4px 6px; border-radius: 8px; background: rgba(91,217,230,.1); border: 1px solid rgba(91,217,230,.35); color: #7ff0ee; font-weight: 800; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; }
.ft-flow-h svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ft-flow ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; counter-reset: ftf; }
.ft-flow li { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; position: relative; display: grid; grid-template-columns: 44px 1fr; column-gap: 12px; align-items: center; padding: 10px 12px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); counter-increment: ftf; transition: border-color .3s, background .3s, translate .2s; }
.ft-flow li:hover { translate: 0 -3px; border-color: color-mix(in srgb, var(--lane) 60%, transparent); background: rgba(255,255,255,.08); }
.ft-flow li.ft-fl-us { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
.ft-flow li.ft-fl-seller { --lane: #2b7fd6; --lane-2: #1b5aa3; --lane-l: #9dd0ff; }
.ft-flow li i { grid-row: 1 / 3; position: relative; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--lane) 90%, transparent); }
.ft-flow li i::after { content: counter(ftf, decimal-leading-zero); position: absolute; right: -6px; top: -6px; padding: 1px 5px; border-radius: 6px; background: #0f1a2a; border: 1px solid color-mix(in srgb, var(--lane) 60%, transparent); color: var(--lane); font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 9.5px; font-weight: 800; }
.ft-flow li svg { width: 22px; height: 22px; fill: none; stroke: #06201f; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.ft-flow li b { display: block; font-size: 13px; color: #fff; line-height: 1.2; }
.ft-flow li small { display: block; font-size: 11.5px; color: #9fb0c4; }
.ft-flow-line { display: none; }
@media (min-width: 700px) {
	.ft-flow ol { grid-template-columns: repeat(5, 1fr); gap: 12px; padding-top: 26px; }
	.ft-flow li { grid-template-columns: 1fr; text-align: center; row-gap: 5px; padding: 0 10px 12px; overflow: visible; animation: ft-lit 12s infinite; animation-delay: var(--d, 0s); }
	.ft-flow li i { grid-row: auto; margin: -26px auto 6px; width: 52px; height: 52px; box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--lane) 90%, transparent), 0 0 0 4px #0f1a2a; animation: ft-lit-i 12s infinite; animation-delay: var(--d, 0s); }
	.ft-flow li svg { width: 24px; height: 24px; }
	.ft-flow li:nth-child(1) { --d: 0s; } .ft-flow li:nth-child(2) { --d: 3s; } .ft-flow li:nth-child(3) { --d: 4s; } .ft-flow li:nth-child(4) { --d: 7s; } .ft-flow li:nth-child(5) { --d: 11s; }
	/* linia stă la înălțimea centrului iconițelor, între prima și ultima; curge spre dreapta */
	.ft-flow-rail { position: relative; }
	/* containerul liniei nu are mască (ar tăia obiectele); linia punctată e ::after */
	.ft-flow-line { display: block; position: absolute; left: 10%; right: 10%; top: 25px; height: 2px; }
	.ft-flow-line::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(91,217,230,.75) 0 10px, transparent 10px 18px); -webkit-mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); animation: ft-dash .9s linear infinite; }
	.ft-flow-line::before { content: ""; position: absolute; inset: -3px 0; background: linear-gradient(90deg, rgba(91,217,230,.18), rgba(124,108,255,.18)); filter: blur(4px); }
	.ft-obj { z-index: 2; }
	.ft-obj { position: absolute; top: 50%; left: 10%; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; translate: -50% -50%; opacity: 0; }
	.ft-obj svg { width: 17px; height: 17px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
	.ft-obj-coin { background: linear-gradient(135deg, #ffe08a, #ffb547); box-shadow: 0 6px 16px -4px rgba(255,181,71,.9), 0 0 0 3px #0f1a2a; animation: ft-coin 12s linear infinite; }
	.ft-obj-box { background: linear-gradient(135deg, #9dd0ff, #2b7fd6); box-shadow: 0 6px 16px -4px rgba(43,127,214,.9), 0 0 0 3px #0f1a2a; animation: ft-box 12s linear infinite; }
	.ft-obj-box svg { stroke: #fff; }
}
/* povestea de 12 s: 0–3 s moneda 1→2, 4–7 s coletul 3→4, 8–11 s moneda 4→5; fiecare nod se aprinde când ajunge obiectul */
@keyframes ft-dash { to { background-position: 18px 0; } }
@keyframes ft-coin { 0% { left: 10%; opacity: 0; } 1.7% { opacity: 1; } 25% { left: 30%; opacity: 1; } 27% { opacity: 0; } 66.6% { left: 70%; opacity: 0; } 68% { opacity: 1; } 91.7% { left: 90%; opacity: 1; } 93% { opacity: 0; } 100% { left: 90%; opacity: 0; } }
@keyframes ft-box { 0%, 35% { left: 50%; opacity: 0; } 36.5% { opacity: 1; } 58.3% { left: 70%; opacity: 1; } 60% { opacity: 0; } 100% { left: 70%; opacity: 0; } }
@keyframes ft-lit { 0%, 100% { border-color: rgba(255,255,255,.1); background: rgba(255,255,255,.05); } 2%, 10% { border-color: color-mix(in srgb, var(--lane) 70%, transparent); background: color-mix(in srgb, var(--lane) 12%, rgba(255,255,255,.05)); } 14% { border-color: rgba(255,255,255,.1); background: rgba(255,255,255,.05); } }
@keyframes ft-lit-i { 0%, 100% { scale: 1; box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--lane) 90%, transparent), 0 0 0 4px #0f1a2a; } 2%, 10% { scale: 1.12; box-shadow: 0 10px 24px -8px var(--lane), 0 0 0 4px #0f1a2a, 0 0 0 8px color-mix(in srgb, var(--lane) 35%, transparent), 0 0 30px color-mix(in srgb, var(--lane) 55%, transparent); } 14% { scale: 1; box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--lane) 90%, transparent), 0 0 0 4px #0f1a2a; } }
@media (prefers-reduced-motion: reduce) { .ft-flow li, .ft-flow li i, .ft-flow-line::after { animation: none; } .ft-obj { display: none; } }
/* brand + coloane */
.ft-top { display: grid; gap: 32px; padding: 36px 0 36px; }
.ft-brand .footer-logo { display: block; width: 140px; height: 40px; margin-bottom: 18px; }
.ft-tag { max-width: 42ch; line-height: 1.6; color: #b7c3d3; margin: 0 0 18px; }
.ft-medals { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ft-medals li { display: grid; grid-template-columns: 40px 1fr; column-gap: 10px; align-items: center; padding: 6px 10px 6px 6px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); }
.ft-medals i { position: relative; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: #0f1a2a; }
.ft-medals i::before { content: ""; position: absolute; inset: -1px; border-radius: 10px; background: conic-gradient(from var(--hp-a), #5bd9e6, #18afff, #7c6cff, #5bd9e6); animation: hp-holo 6s linear infinite; z-index: 0; }
.ft-medals i::after { content: ""; position: absolute; inset: 1px; border-radius: 9px; background: #16243a; z-index: 1; }
.ft-medals svg { position: relative; z-index: 2; width: 18px; height: 18px; fill: none; stroke: #7ff0ee; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ft-medals b { display: block; font-size: 12px; letter-spacing: .1em; color: #fff; }
.ft-medals small { display: block; font-size: 11.5px; color: #9fb0c4; }
.ft-col h2, .ft-contact h2 { display: flex; align-items: center; gap: 9px; margin: 0 0 14px; font-size: 14px; font-weight: 800; letter-spacing: .04em; color: #fff; }
.ft-col h2 i, .ft-contact h2 i { --lane: #5bd9e6; --lane-l: #9beef5; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 8px 16px -8px color-mix(in srgb, var(--lane) 90%, transparent); }
.ft-col-seller h2 i { --lane: #2b7fd6; --lane-l: #9dd0ff; } .ft-col-us h2 i { --lane: #7c6cff; --lane-l: #c4b8ff; } .ft-contact h2 i { --lane: #ffb547; --lane-l: #ffd699; }
.ft-col h2 svg, .ft-contact h2 svg { width: 16px; height: 16px; fill: none; stroke: #06201f; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ft-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ft-col a { position: relative; display: inline-block; padding-left: 18px; color: #b7c3d3; text-decoration: none; transition: color .2s; }
.ft-col a::before { content: ""; position: absolute; left: 0; top: .55em; width: 10px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #5bd9e6, #18afff); opacity: .35; transform-origin: left; transition: opacity .2s, scale .2s; }
.ft-col a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 1px; background: linear-gradient(90deg, #5bd9e6, #18afff); scale: 0 1; transform-origin: left; transition: scale .25s; }
.ft-col a:hover { color: #fff; text-decoration: none; }
.ft-col a:hover::before { opacity: 1; scale: 1.4 1; }
.ft-col a:hover::after { scale: 1 1; }
.ft-contact { display: grid; gap: 8px; align-content: start; }
.ft-contact h2 { margin-bottom: 6px; }
.ft-ct { display: grid; grid-template-columns: 34px 1fr; column-gap: 10px; align-items: center; padding: 8px 10px 8px 8px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); color: #dfe7f1; text-decoration: none; font-style: normal; transition: border-color .3s, background .3s; }
a.ft-ct:hover { border-color: rgba(91,217,230,.6); background: rgba(255,255,255,.08); text-decoration: none; color: #fff; }
.ft-ct i { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; background: rgba(91,217,230,.14); box-shadow: inset 0 0 0 1px rgba(91,217,230,.3); }
.ft-ct svg { width: 17px; height: 17px; fill: none; stroke: #7ff0ee; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ft-ct small { display: block; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #9fb0c4; }
.ft-ct b { display: block; font-size: 13.5px; color: #fff; }
.ft-ct em { display: block; font-style: normal; font-size: 11.5px; color: #9fb0c4; line-height: 1.35; }
.ft-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin-top: 4px; padding: 11px 18px; border-radius: 10px; background: linear-gradient(90deg, #5bd9e6, #18afff); color: #06201f; font-weight: 800; text-decoration: none; box-shadow: 0 14px 28px -14px rgba(24,175,255,.9); transition: translate .2s, box-shadow .3s; }
.ft-btn:hover { translate: 0 -2px; box-shadow: 0 18px 32px -14px rgba(24,175,255,1); text-decoration: none; color: #06201f; }
.ft-bottom { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; padding: 20px 0 28px; border-top: 1px solid rgba(255,255,255,.1); font-size: 13px; color: #9fb0c4; }
.ft-bottom p { margin: 0; }
.ft-legal { list-style: none; margin: 0; padding: 0; display: flex; gap: 18px; }
.ft-legal a { color: #b7c3d3; text-decoration: none; }
.ft-legal a:hover { color: #fff; }
.ft-cur { list-style: none; margin: 0 0 0 auto; padding: 0; display: flex; gap: 6px; }
.ft-cur li { padding: 3px 8px; border-radius: 6px; background: rgba(91,217,230,.12); border: 1px solid rgba(91,217,230,.35); color: #7ff0ee; font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.ft-up { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); color: #fff; transition: background .2s, translate .2s; }
.ft-up:hover { background: rgba(91,217,230,.2); translate: 0 -2px; }
.ft-up svg { width: 16px; height: 16px; fill: none; stroke: #7ff0ee; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
@media (min-width: 700px) { .ft-medals { grid-template-columns: repeat(3, 1fr); } .ft-medals li { grid-template-columns: 1fr; text-align: center; justify-items: center; row-gap: 4px; padding: 10px 8px; } }
@media (min-width: 1000px) { .ft-top { grid-template-columns: 1.3fr 1.2fr .95fr .95fr 1.2fr; gap: 32px; } .ft-col a { white-space: nowrap; } .ft-medals { grid-template-columns: 1fr; } .ft-medals li { grid-template-columns: 40px 1fr; text-align: left; justify-items: start; row-gap: 0; padding: 6px 10px 6px 6px; } }
@media (prefers-reduced-motion: reduce) { .ft-wrap::after, .ft-medals i::before { animation: none; } }
@media (prefers-reduced-motion: reduce) { .ft-wrap::after { animation: none; } }
/* ---- Header (2026-09-24, refăcut de la zero, fără markup legacy): bandă de contact,
   bară de sticlă lipicioasă cu meniu cu iconițe colorate, căutare, „Publică un anunț”,
   meniul contului ca <details>, iar pe mobil un sertar deschis dintr-un checkbox (fără JS). ---- */
.hd { --hd-ink: #0f1a2a; --hd-txt: #dfe7f1; --hd-mute: #9fb0c4; position: relative; z-index: 50; color: var(--hd-txt); font-family: inherit; }
.hd a { text-decoration: none; }
.hd a:hover { text-decoration: none; }
.hd-wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 16px; }
@media (min-width: 900px) { .hd-wrap { padding: 0 var(--gutter); } }
.hd svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* banda de contact */
.hd-strip { background: #0a1221; border-bottom: 1px solid rgba(255,255,255,.06); font-size: 12.5px; }
.hd-strip .hd-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; padding-top: 5px; padding-bottom: 5px; }
.hd-ct { display: inline-flex; align-items: center; gap: 8px; padding: 3px 0; color: var(--hd-txt); font-weight: 700; transition: color .2s; }
.hd-ct i { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 7px; background: rgba(91,217,230,.16); box-shadow: inset 0 0 0 1px rgba(91,217,230,.35); color: #7ff0ee; transition: background .2s, transform .2s; }
.hd-ct svg { width: 13px; height: 13px; stroke-width: 2.2; }
.hd-ct:hover { color: #7ff0ee; }
.hd-ct:hover i { background: rgba(91,217,230,.3); transform: rotate(-8deg) scale(1.08); }
.hd-strip-r { margin-left: auto; display: none; align-items: center; gap: 16px; color: var(--hd-mute); }
.hd-live { display: inline-flex; align-items: center; gap: 7px; }
.hd-live i { width: 8px; height: 8px; border-radius: 50%; background: #5bd9e6; box-shadow: 0 0 0 0 rgba(91,217,230,.6); animation: hp-pulse 2s infinite; }
.hd-cur { display: inline-flex; gap: 4px; }
.hd-cur b { padding: 1px 7px; border-radius: 6px; background: rgba(91,217,230,.1); border: 1px solid rgba(91,217,230,.3); color: #7ff0ee; font-size: 10.5px; font-weight: 800; letter-spacing: .1em; }
@media (min-width: 900px) { .hd-strip-r { display: inline-flex; } }
@media (max-width: 419px) { .hd-ct { font-size: 12px; gap: 6px; } .hd-ct i { display: none; } }
/* bara principală, lipicioasă */
.hd-bar { position: sticky; top: 0; z-index: 50; background: rgba(15,26,42,.92); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: 0 12px 34px -22px rgba(0,0,0,.7); transition: box-shadow .3s; }
.hd-bar::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: linear-gradient(90deg, transparent, rgba(91,217,230,.8) 25%, rgba(124,108,255,.8) 75%, transparent); pointer-events: none; }
.hd.is-scrolled .hd-bar { box-shadow: 0 16px 40px -18px rgba(0,0,0,.85); }
.hd-bar > .hd-wrap { display: flex; align-items: center; gap: 10px; padding-top: 9px; padding-bottom: 9px; }
.hd-logo { display: flex; align-items: center; flex: none; transition: opacity .2s; }
.hd-logo img { display: block; width: 130px; height: 44px; }
.hd-logo:hover { opacity: .85; }
/* meniul: capsulă de sticlă cu pastile, fiecare cu iconița ei colorată */
.hd-nav { display: none; align-items: center; gap: 2px; padding: 4px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
.hd-l { --c: #5bd9e6; --c-l: #9beef5; position: relative; display: inline-flex; align-items: center; gap: 9px; padding: 5px 14px 5px 5px; border-radius: 8px; font-size: 14.5px; font-weight: 700; color: var(--hd-txt); white-space: nowrap; transition: background .2s, color .2s; }
.hd-l-blue { --c: #18afff; --c-l: #9dd0ff; } .hd-l-violet { --c: #7c6cff; --c-l: #c4b8ff; }
.hd-l i { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); color: var(--c-l); transition: background .25s, box-shadow .25s, transform .25s, color .25s; }
.hd-l svg { width: 17px; height: 17px; }
.hd-l::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 1px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, var(--c), var(--c-l)); scale: 0 1; transform-origin: left; transition: scale .25s; }
.hd-l:hover { background: rgba(255,255,255,.07); color: #fff; }
.hd-l:hover i { background: color-mix(in srgb, var(--c) 22%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 55%, transparent); transform: rotate(-8deg) scale(1.1); color: #fff; }
.hd-l:hover::after { scale: 1 1; }
.hd-l[aria-current="page"] { background: color-mix(in srgb, var(--c) 16%, transparent); color: #fff; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 45%, transparent); }
.hd-l[aria-current="page"] i { background: linear-gradient(135deg, var(--c-l), var(--c)); color: #06201f; box-shadow: 0 6px 14px -6px var(--c); }
.hd-l[aria-current="page"]::after { display: none; }
/* căutarea */
.hd-search { position: relative; display: none; align-items: center; flex: 0 1 260px; min-width: 0; height: 42px; padding: 0 4px 0 12px; border-radius: 10px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); color: var(--hd-mute); transition: flex-basis .3s, border-color .2s, box-shadow .2s, background .2s; }
.hd-search > svg { flex: none; width: 17px; height: 17px; }
.hd-search input { flex: 1; min-width: 0; height: 100%; margin: 0; padding: 0 8px; border: 0; background: transparent; color: #fff; font: inherit; font-size: 14px; outline: none; }
.hd-search input::placeholder { color: var(--hd-mute); }
.hd-search input::-webkit-search-cancel-button { display: none; }
.hd-search button { display: flex; align-items: center; justify-content: center; flex: none; width: 32px; height: 32px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: rgba(255,255,255,.08); color: #fff; cursor: pointer; opacity: .6; transition: background .2s, opacity .2s, transform .2s; }
.hd-search button svg { width: 16px; height: 16px; }
.hd-search:focus-within { flex-basis: 340px; background: rgba(255,255,255,.09); border-color: rgba(91,217,230,.7); box-shadow: 0 0 0 3px rgba(91,217,230,.18); color: #7ff0ee; }
.hd-search:focus-within button, .hd-search button:hover { opacity: 1; background: linear-gradient(135deg, #5bd9e6, #18afff); color: #06201f; }
.hd-search button:hover { transform: translateX(2px); }
/* dreapta: butoane, contul, hamburger */
.hd-right { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.hd-btn { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 16px 0 10px; border-radius: 10px; font-size: 14.5px; font-weight: 800; white-space: nowrap; transition: transform .2s, box-shadow .25s, background .25s; }
.hd-btn i { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 7px; transition: transform .25s, background .25s; }
.hd-btn svg { width: 16px; height: 16px; }
.hd-btn:hover { transform: translateY(-1px); }
.hd-btn-ghost { display: none; border: 1px solid transparent; background: linear-gradient(#0f1a2a, #0f1a2a) padding-box, linear-gradient(135deg, rgba(91,217,230,.75), rgba(124,108,255,.75)) border-box; color: #fff; }
.hd-btn-ghost i { background: rgba(255,255,255,.08); color: #c4b8ff; }
.hd-btn-ghost:hover { background: linear-gradient(#152540, #152540) padding-box, linear-gradient(135deg, #5bd9e6, #7c6cff) border-box; box-shadow: 0 10px 24px -14px rgba(124,108,255,.9); }
.hd-btn-ghost:hover i { background: rgba(124,108,255,.3); color: #fff; transform: rotate(-8deg) scale(1.1); }
.hd-btn-primary { position: relative; overflow: hidden; background: linear-gradient(135deg, #9beef5, #5bd9e6 55%, #18afff); color: #06201f; box-shadow: 0 10px 24px -10px rgba(91,217,230,.9), inset 0 1px 0 rgba(255,255,255,.6); }
.hd-btn-primary i { background: rgba(6,32,31,.12); color: #06201f; }
.hd-btn-primary::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.6) 50%, transparent 70%); transform: translateX(-130%); animation: hp-shine 4s ease-out 2s infinite; pointer-events: none; }
.hd-btn-primary:hover { box-shadow: 0 14px 30px -10px rgba(24,175,255,.9), inset 0 1px 0 rgba(255,255,255,.6); }
.hd-btn-primary:hover i { transform: translateX(3px); }
.hd-btn-sell { background: linear-gradient(135deg, #5bd9e6, #18afff); color: #06201f; box-shadow: 0 10px 24px -10px rgba(24,175,255,.9), inset 0 1px 0 rgba(255,255,255,.4); }
.hd-btn-sell i { background: rgba(255,255,255,.35); color: #06201f; }
.hd-btn-sell span { display: none; }
.hd-btn-sell:hover { box-shadow: 0 14px 30px -10px rgba(24,175,255,1), inset 0 1px 0 rgba(255,255,255,.4); }
.hd-btn-sell:hover i { transform: rotate(90deg); }
/* contul: avatar în inel gradient + meniu <details> */
.hd-av { position: relative; isolation: isolate; display: flex; align-items: center; justify-content: center; flex: none; width: 34px; height: 34px; border-radius: 10px; background: #16243a; color: #fff; font-style: normal; font-weight: 800; font-size: 14px; text-transform: uppercase; }
.hd-av::before { content: ""; position: absolute; inset: -2px; border-radius: 10px; background: conic-gradient(from var(--hp-a), #5bd9e6, #18afff, #7c6cff, #5bd9e6); z-index: -1; }
.hd-user { position: relative; }
.hd-user summary { display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 8px 0 4px; border-radius: 10px; list-style: none; cursor: pointer; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); color: #fff; font-weight: 800; font-size: 14.5px; transition: background .2s, border-color .2s; }
.hd-user summary::-webkit-details-marker { display: none; }
.hd-user summary > svg { width: 14px; height: 14px; color: var(--hd-mute); transition: transform .25s; }
.hd-user summary:hover, .hd-user[open] summary { background: rgba(255,255,255,.09); border-color: rgba(91,217,230,.45); }
.hd-user:hover .hd-av::before, .hd-user[open] .hd-av::before { animation: hp-holo 3s linear infinite; }
.hd-user[open] summary > svg { transform: rotate(180deg); }
.hd-user-name { display: none; }
.hd-menu { position: absolute; right: 0; top: calc(100% + 10px); width: 280px; padding: 8px; border-radius: 10px; background: #fff; color: var(--hd-ink); box-shadow: 0 30px 60px -24px rgba(15,26,42,.5), 0 0 0 1px rgba(15,26,42,.06); animation: hd-drop .18s ease-out; }
.hd-menu::before { content: ""; position: absolute; right: 18px; top: -6px; width: 12px; height: 12px; background: #fff; rotate: 45deg; box-shadow: -1px -1px 0 rgba(15,26,42,.06); }
@keyframes hd-drop { from { opacity: 0; translate: 0 -6px; } to { opacity: 1; translate: 0 0; } }
.hd-menu-head { display: flex; align-items: center; gap: 10px; padding: 8px 8px 12px; margin-bottom: 6px; border-bottom: 1px solid rgba(15,26,42,.08); }
.hd-menu-head .hd-av { width: 40px; height: 40px; }
.hd-menu-head b { display: block; font-size: 14px; } .hd-menu-head small { display: block; font-size: 12px; color: #5a6a80; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 200px; }
.hd-m { --c: #5bd9e6; --c-l: #9beef5; display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 8px; border: 0; border-radius: 8px; background: transparent; color: var(--hd-ink); font: inherit; font-size: 14px; font-weight: 700; text-align: left; cursor: pointer; transition: background .15s; }
.hd-m-blue { --c: #18afff; --c-l: #9dd0ff; } .hd-m-violet { --c: #7c6cff; --c-l: #c4b8ff; } .hd-m-amber { --c: #ffb547; --c-l: #ffd699; } .hd-m-slate { --c: #64748b; --c-l: #cbd5e1; } .hd-m-red { --c: #e5484d; --c-l: #ffb3b5; } .hd-m-admin { --c: #7c6cff; --c-l: #18afff; }
.hd-m i { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, var(--c-l), var(--c)); color: #06201f; transition: transform .2s; }
.hd-m-admin i { background: linear-gradient(135deg, #18afff, #7c6cff); color: #fff; }
.hd-m svg { width: 15px; height: 15px; }
.hd-m:hover { background: color-mix(in srgb, var(--c) 12%, #fff); }
.hd-m:hover i { transform: rotate(-8deg) scale(1.1); }
.hd-out { margin: 6px 0 0; padding-top: 6px; border-top: 1px solid rgba(15,26,42,.08); }
/* comutatorul de limbă (2026-09-25): două butoane alăturate, EN | RO, cel activ plin cu gradient (operatorul a respins meniul derulant) */
.hd-lang { display: inline-flex; gap: 2px; padding: 3px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); }
.hd-lang form { margin: 0; }
.hd-flag { width: 20px; height: 13px; border-radius: 3px; box-shadow: 0 0 0 1px rgba(255,255,255,.25); flex: none; }
.hd-lang-opt { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px 0 8px; border: 0; border-radius: 8px; background: transparent; color: #dfe7f1; font: inherit; font-size: 12.5px; font-weight: 800; letter-spacing: .06em; cursor: pointer; transition: background .2s, color .2s; }
.hd-lang-opt:hover { background: rgba(255,255,255,.09); color: #fff; }
.hd-lang-opt.is-on { background: linear-gradient(135deg, #5bd9e6, #18afff); color: #06201f; box-shadow: 0 8px 16px -10px #18afff; cursor: default; }
.hd-lang-opt.is-on .hd-flag { box-shadow: 0 0 0 1px rgba(6,32,31,.35); }
.hd-mobile-lang { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.hd-mobile-lang form { margin: 0; }
.hd-mobile-lang .hd-lang-opt { width: 100%; height: 42px; justify-content: center; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); color: #fff; font-size: 13.5px; letter-spacing: 0; }
.hd-mobile-lang .hd-lang-opt.is-on { background: linear-gradient(135deg, #5bd9e6, #18afff); border-color: transparent; color: #06201f; }
@media (max-width: 1179px) { .hd-lang { display: none; } }
/* hamburger + sertarul mobil (checkbox, fără JS) */
.hd-toggle { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.hd-burger { position: relative; display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 10px; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); cursor: pointer; transition: background .2s; }
.hd-burger span { position: absolute; left: 12px; width: 18px; height: 2px; border-radius: 2px; background: #fff; transition: transform .25s, opacity .2s, top .25s; }
.hd-burger span:nth-child(1) { top: 14px; } .hd-burger span:nth-child(2) { top: 20px; } .hd-burger span:nth-child(3) { top: 26px; }
.hd-burger:hover, .hd-toggle:checked ~ .hd-wrap .hd-burger { background: rgba(91,217,230,.18); box-shadow: inset 0 0 0 1px rgba(91,217,230,.45); }
.hd-toggle:focus-visible ~ .hd-wrap .hd-burger { outline: 2px solid #5bd9e6; outline-offset: 2px; }
.hd-toggle:checked ~ .hd-wrap .hd-burger span:nth-child(1) { top: 20px; transform: rotate(45deg); }
.hd-toggle:checked ~ .hd-wrap .hd-burger span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hd-toggle:checked ~ .hd-wrap .hd-burger span:nth-child(3) { top: 20px; transform: rotate(-45deg); }
.hd-mobile { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows .3s ease, visibility 0s .3s; }
.hd-mobile-in { min-height: 0; overflow: hidden; }
.hd-toggle:checked ~ .hd-mobile { grid-template-rows: 1fr; visibility: visible; transition: grid-template-rows .3s ease; }
.hd-mobile-in > * { margin: 0 16px; }
.hd-mobile-in > :first-child { margin-top: 6px; }
.hd-mobile-in > :last-child { margin-bottom: 16px; }
.hd-mobile-user { display: flex; align-items: center; gap: 10px; padding: 10px; margin-bottom: 10px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); }
.hd-mobile-user > div { min-width: 0; flex: 1; }
.hd-mobile-user b { display: block; font-size: 14px; color: #fff; } .hd-mobile-user small { display: block; font-size: 12px; color: var(--hd-mute); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hd-mobile-user form { margin: 0; }
.hd-mobile-user button { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px; border: 0; border-radius: 8px; background: rgba(229,72,77,.18); color: #ffb3b5; font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; }
.hd-mobile-user button svg { width: 14px; height: 14px; }
.hd-search-m { display: flex; margin-bottom: 10px; flex: none; }
.hd-search-m:focus-within { flex-basis: auto; }
.hd-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.hd-t { --c: #5bd9e6; --c-l: #9beef5; display: flex; align-items: center; gap: 10px; min-width: 0; padding: 8px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); color: #fff; transition: background .2s, border-color .2s; }
.hd-t-blue { --c: #18afff; --c-l: #9dd0ff; } .hd-t-violet { --c: #7c6cff; --c-l: #c4b8ff; } .hd-t-amber { --c: #ffb547; --c-l: #ffd699; } .hd-t-sell { --c: #18afff; --c-l: #5bd9e6; } .hd-t-admin { --c: #7c6cff; --c-l: #18afff; }
.hd-t i { display: flex; align-items: center; justify-content: center; flex: none; width: 36px; height: 36px; border-radius: 9px; background: linear-gradient(135deg, var(--c-l), var(--c)); color: #06201f; box-shadow: 0 8px 16px -8px var(--c); }
.hd-t-admin i { color: #fff; }
.hd-t svg { width: 17px; height: 17px; }
.hd-t span { min-width: 0; display: grid; }
.hd-t b { font-size: 13.5px; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .hd-t small { font-size: 11px; color: var(--hd-mute); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hd-t:hover, .hd-t[aria-current="page"] { background: color-mix(in srgb, var(--c) 16%, transparent); border-color: color-mix(in srgb, var(--c) 50%, transparent); }
.hd-mobile-auth { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.hd-mobile-auth .hd-btn { display: inline-flex; justify-content: center; }
.hd-mobile-ct { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 12px; font-size: 13px; }
.hd-mobile-ct a { display: inline-flex; align-items: center; gap: 6px; color: var(--hd-mute); font-weight: 700; }
.hd-mobile-ct a:hover { color: #7ff0ee; }
.hd-mobile-ct svg { width: 13px; height: 13px; color: #7ff0ee; }
@media (max-width: 379px) { .hd-tiles { grid-template-columns: 1fr; } .hd-mobile-auth { grid-template-columns: 1fr; } }
/* desktop: meniul, căutarea și butoanele întregi; sertarul dispare */
@media (min-width: 1180px) {
	.hd-nav, .hd-search, .hd-btn-ghost { display: inline-flex; }
	.hd-btn-sell span, .hd-user-name { display: inline; }
	.hd-burger, .hd-mobile { display: none; }
	.hd-bar > .hd-wrap { gap: 14px; }
}
@media (max-width: 1179px) { .hd-btn-sell { padding: 0 8px; } .hd-btn-primary { display: none; } .hd-user summary { padding-right: 4px; } .hd-user summary > svg { display: none; } }
@media (prefers-reduced-motion: reduce) { .hd-live i, .hd-btn-primary::after, .hd-user .hd-av::before, .hd-menu { animation: none; } .hd-mobile { transition: none; } }
.top-bar .signup-btn { text-decoration: none; }
.home-page .item { text-decoration: none; color: inherit; }
.home-page .top-banner .icons-list .ic-wrapper { border: 0; font: inherit; }
.home-page .layer-testimonials .testi-slider { display: grid; gap: 18px; grid-template-columns: 1fr; }
@media (min-width: 768px) { .home-page .layer-testimonials .testi-slider { grid-template-columns: repeat(3, 1fr); } }
.home-page .layer-trust .t-value { font-variant-numeric: tabular-nums; }


/* ===== Prima pagină — temă „din viitor” (2026-09-22) ===== */
.hp { --bg: #f7f9fc; --ink: #0f1a2a; --mute: #5b6878; --line: rgba(15,26,42,.09); --glass: rgba(255,255,255,.78); --teal: #5bd9e6; --teal-2: #0c7a79; --violet: #7c6cff; --blue: #2b7fd6; position: relative; overflow: hidden; background: var(--bg); color: var(--ink); font-size: 16px; }
.hp-wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); position: relative; z-index: 1; }
.hp-sr { position: absolute; left: -9999px; }
.hp h1, .hp h2, .hp h3 { font-weight: 800; letter-spacing: -.02em; color: var(--ink); margin: 0; }
.hp h2 { font-size: clamp(28px, 3.6vw, 44px); line-height: 1.1; margin: 8px 0 12px; }
.hp h3 { font-size: 19px; margin: 12px 0 8px; }
.hp p { margin: 0 0 12px; }
.hp .hp-lead { font-size: clamp(16px, 1.3vw, 19px); color: var(--mute); max-width: 62ch; line-height: 1.6; }
.hp .hp-muted { color: var(--mute); }
.hp .hp-muted a, .hp-link { color: var(--teal-2); font-weight: 700; }
.hp-grad { background: linear-gradient(90deg, #14a6a4, #2b7fd6 60%, var(--violet)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hp-mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 13px; letter-spacing: .04em; color: var(--mute); }

/* Fundal: sfere de lumină + grilă fină */
.hp-bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.hp-orb { position: absolute; border-radius: 10px; filter: blur(80px); opacity: .5; animation: hp-float 18s ease-in-out infinite; }
.hp-orb-1 { width: 620px; height: 620px; left: -160px; top: 560px; background: radial-gradient(circle, rgba(91,217,230,.45), transparent 60%); }
.hp-orb-2 { width: 720px; height: 720px; right: -240px; top: 120px; background: radial-gradient(circle, rgba(124,108,255,.28), transparent 60%); animation-delay: -6s; }
.hp-orb-3 { width: 520px; height: 520px; left: 30%; top: 1300px; background: radial-gradient(circle, rgba(62,160,255,.22), transparent 60%); animation-delay: -12s; }
@keyframes hp-float { 0%, 100% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(40px, -30px, 0) scale(1.08); } }

/* Eyebrow, butoane */
.hp-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--teal-2); margin: 0 0 14px; }
.hp-pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 0 rgba(91,217,230,.6); animation: hp-pulse 2s infinite; }
@keyframes hp-pulse { 0% { box-shadow: 0 0 0 0 rgba(91,217,230,.6); } 70% { box-shadow: 0 0 0 10px rgba(91,217,230,0); } 100% { box-shadow: 0 0 0 0 rgba(91,217,230,0); } }
.hp-btn { display: inline-flex; align-items: center; gap: 8px; padding: 14px 26px; border-radius: 10px; font-weight: 800; font-size: 16px; text-decoration: none; transition: transform 150ms ease-out, box-shadow 150ms, background 150ms; border: 1px solid transparent; }
.hp-btn:hover { text-decoration: none; transform: translateY(-2px); }
.hp-btn-primary { background: linear-gradient(90deg, #5fe3e1, var(--teal)); color: #06201f; box-shadow: 0 12px 30px -10px rgba(91,217,230,.8); }
.hp-btn-primary:hover { box-shadow: 0 16px 50px -10px rgba(91,217,230,.9); }
.hp-btn-ghost { background: #fff; color: var(--ink); border-color: rgba(15,26,42,.14); box-shadow: 0 8px 24px -14px rgba(15,26,42,.25); }
.hp-btn-ghost:hover { border-color: var(--teal); }
.hp-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 26px 0; }
.hp-actions.hp-center { justify-content: center; }
.hp-chip { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #06201f; background: var(--teal); padding: 5px 10px; border-radius: 10px; }

/* Hero: bandă închisă sub bară (ca la escrow.com), card de pornire alb cu tab-uri fără JS */
.hp-hero { position: relative; z-index: 1; padding: 56px 0 0; background: linear-gradient(180deg, #0f1a2a 0%, #13233a 60%, #172c4c 100%); color: #e8eef6; overflow: hidden; }
.hp-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(720px 420px at 88% 8%, rgba(91,217,230,.30), transparent 65%), radial-gradient(620px 420px at 6% 96%, rgba(124,108,255,.24), transparent 65%); pointer-events: none; }
.hp-hero .hp-eyebrow { color: var(--teal); }
.hp-hero h1 { color: #fff; font-size: clamp(36px, 4.6vw, 60px); line-height: 1.06; margin: 0 0 18px; }
.hp-hero .hp-lead { color: #b7c3d3; }
.hp-hero .hp-grad { background: linear-gradient(90deg, #5bd9e6, #18afff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hp-hero-grid { display: grid; gap: 40px; align-items: center; }
.hp-ticks { list-style: none; margin: 24px 0 0; padding: 0; display: grid; gap: 10px; font-weight: 600; color: #dfe7f1; }
.hp-ticks li { position: relative; padding-left: 34px; }
.hp-ticks li::before { content: "✓"; position: absolute; left: 0; top: -1px; width: 24px; height: 24px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: rgba(91,217,230,.2); color: #7ff0ee; font-size: 12px; font-weight: 900; }
.hp-start { position: relative; background: #fff; color: var(--ink); border-radius: 10px; padding: 22px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.6); }
.hp-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; background: var(--bg); border: 1px solid var(--line); border-radius: 10px; padding: 5px; margin-bottom: 18px; }
.hp-tabs label { text-align: center; padding: 11px 12px; border-radius: 10px; font-weight: 800; color: var(--mute); cursor: pointer; user-select: none; }
#hp-buy:checked ~ .hp-tabs label[for="hp-buy"], #hp-sell:checked ~ .hp-tabs label[for="hp-sell"] { background: #fff; color: var(--ink); box-shadow: 0 4px 14px -6px rgba(15,26,42,.4); }
#hp-buy:focus-visible ~ .hp-tabs label[for="hp-buy"], #hp-sell:focus-visible ~ .hp-tabs label[for="hp-sell"] { outline: 2px solid var(--teal); outline-offset: 1px; }
.hp-pane { display: none; }
#hp-buy:checked ~ .hp-pane-buy, #hp-sell:checked ~ .hp-pane-sell { display: block; }
.hp-start-title { font-weight: 800; font-size: 18px; margin: 0 0 6px; color: var(--ink); }
.hp-pane label { display: block; font-size: 13px; font-weight: 700; color: var(--mute); margin: 14px 0 6px; }
.hp-pane select, .hp-pane input { width: 100%; padding: 13px 14px; border: 1px solid rgba(15,26,42,.16); border-radius: 10px; font: inherit; font-weight: 600; color: var(--ink); background: #fff; }
.hp-pane select:focus, .hp-pane input:focus { outline: 0; border-color: var(--teal); box-shadow: 0 0 0 3px rgba(91,217,230,.25); }
.hp-pane input::placeholder { color: #8a95a5; }
.hp-btn-block { width: 100%; justify-content: center; margin-top: 20px; border-radius: 10px; font-size: 17px; cursor: pointer; }
.hp-fee { margin: 14px 0 0; font-size: 13px; color: var(--mute); text-align: center; }
.hp-fee a { color: var(--teal-2); font-weight: 700; }
/* Slider cu scenarii (scroll-snap; merge fără JS, JS adaugă săgeți, tab activ și derulare automată) */
.hp-uses { position: relative; margin-top: 48px; padding: 22px 22px 18px; border-radius: 10px; background: linear-gradient(160deg, rgba(255,255,255,.10), rgba(255,255,255,.04)); border: 1px solid rgba(255,255,255,.14); box-shadow: 0 30px 80px -40px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.14); backdrop-filter: blur(14px); }
.hp-uses-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.hp-uses-head .hp-eyebrow { margin: 0; }
.hp-uses-nav { display: flex; flex-wrap: wrap; gap: 6px; }
.hp-uses-nav a { padding: 8px 14px; border-radius: 10px; font-size: 13px; font-weight: 800; color: #b7c3d3; text-decoration: none; border: 1px solid transparent; }
.hp-uses-nav a:hover { color: #fff; text-decoration: none; border-color: rgba(255,255,255,.2); }
.hp-uses-nav a.is-on { color: #06201f; background: var(--teal); box-shadow: 0 8px 24px -8px rgba(91,217,230,.8); }
.hp-uses-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; margin: 18px -22px 0; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.hp-uses-track::-webkit-scrollbar { display: none; }
.hp-uses-track:focus-visible { outline: 2px solid var(--teal); outline-offset: 4px; border-radius: 10px; }
.hp-use { flex: 0 0 100%; box-sizing: border-box; scroll-snap-align: start; scroll-snap-stop: always; display: grid; gap: 22px; padding: 4px 22px 10px; }
.hp-use-icon { width: 48px; height: 48px; fill: none; stroke: #7ff0ee; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 12px rgba(91,217,230,.6)); }
.hp-use h2 { color: #fff; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.15; margin: 12px 0 8px; }
.hp-use-copy p { color: #b7c3d3; margin: 0; font-size: 15px; line-height: 1.55; }
.hp-flow { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; counter-reset: none; }
.hp-flow li { position: relative; display: grid; grid-template-columns: 34px 1fr; column-gap: 12px; align-items: start; }
.hp-flow li i { width: 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-style: normal; font-weight: 900; font-size: 13px; color: #06201f; background: linear-gradient(135deg, #7ff0ee, var(--teal)); box-shadow: 0 0 0 4px rgba(91,217,230,.16), 0 0 22px rgba(91,217,230,.5); }
.hp-flow li span { font-size: 14px; font-weight: 600; color: #e8eef6; line-height: 1.35; padding-top: 7px; }
.hp-flow li + li::before { content: ""; position: absolute; left: 16px; top: -12px; width: 2px; height: 14px; background: rgba(91,217,230,.45); }
.hp-uses-ctrl { display: none; align-items: center; justify-content: center; gap: 14px; margin-top: 14px; }
.js .hp-uses-ctrl { display: flex; }
.hp-uses-ctrl button { width: 40px; height: 40px; border-radius: 10px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: #fff; font: inherit; font-size: 18px; font-weight: 800; cursor: pointer; margin: 0; padding: 0; transition: background 150ms, border-color 150ms; }
.hp-uses-ctrl button:hover { background: rgba(91,217,230,.2); border-color: var(--teal); }
.hp-uses-dots { display: flex; gap: 8px; }
.hp-uses-dots i { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.25); transition: width 200ms, background 200ms; }
.hp-uses-dots i.is-on { width: 26px; border-radius: 10px; background: var(--teal); box-shadow: 0 0 14px rgba(91,217,230,.7); }
/* Hero: formular în linie (stânga) + slider vertical cu scenarii (dreapta) */
/* Consola de pornire: sticlă cu chenar holografic, comutator cu pastilă glisantă, câmpuri cu iconițe, calcul live */
.hp-console { margin-top: 28px; padding: 18px 20px 16px; color: #e8eef6; border-radius: 10px; border: 1px solid transparent; background: linear-gradient(165deg, rgba(21,37,64,.85), rgba(14,24,39,.9)) padding-box, conic-gradient(from var(--hp-a), rgba(255,255,255,.06), rgba(91,217,230,.9) 30%, rgba(255,255,255,.06) 55%, rgba(124,108,255,.8) 80%, rgba(255,255,255,.06)) border-box; box-shadow: 0 30px 70px -30px rgba(0,0,0,.8); backdrop-filter: blur(12px); animation: hp-holo 9s linear infinite, hp-rise .6s ease-out both .1s; transition: box-shadow .3s; }
.hp-console:focus-within { box-shadow: 0 30px 70px -30px rgba(0,0,0,.8), 0 0 0 1px rgba(91,217,230,.5), 0 0 40px rgba(91,217,230,.25); }
.hp-seg { position: relative; display: inline-grid; grid-template-columns: 1fr 1fr; gap: 6px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: 10px; padding: 5px; margin-bottom: 14px; }
.hp-seg-pill { position: absolute; top: 5px; bottom: 5px; left: 5px; width: calc(50% - 8px); border-radius: 10px; background: linear-gradient(90deg, #5fe3e1, var(--teal)); box-shadow: 0 8px 24px -8px rgba(91,217,230,.9); transition: transform .35s cubic-bezier(.2,.8,.2,1); }
#hp-sell:checked ~ .hp-seg .hp-seg-pill { transform: translateX(calc(100% + 6px)); }
.hp-seg label { position: relative; z-index: 1; color: #b7c3d3; padding: 9px 24px; transition: color .25s; }
.hp-console #hp-buy:checked ~ .hp-tabs label[for="hp-buy"], .hp-console #hp-sell:checked ~ .hp-tabs label[for="hp-sell"] { background: none; color: #06201f; box-shadow: none; }
.hp-console .hp-start-title { color: #fff; font-size: 17px; margin: 0 0 2px; }
.hp-row { display: grid; gap: 10px; align-items: end; }
.hp-console .hp-pane label { color: #9fb0c4; margin: 10px 0 6px; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.hp-ctl { position: relative; display: flex; align-items: center; }
.hp-ctl > svg { position: absolute; left: 13px; width: 18px; height: 18px; fill: none; stroke: #7ff0ee; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.hp-console .hp-pane select, .hp-console .hp-pane input { padding: 13px 14px 13px 40px; border: 1px solid rgba(255,255,255,.14); border-radius: 10px; background: rgba(255,255,255,.06); color: #fff; color-scheme: dark; transition: border-color .2s, box-shadow .2s, background .2s; }
.hp-console .hp-pane input { padding-right: 44px; }
.hp-console .hp-pane select:focus, .hp-console .hp-pane input:focus { border-color: var(--teal); background: rgba(91,217,230,.08); box-shadow: 0 0 0 3px rgba(91,217,230,.22), 0 0 24px rgba(91,217,230,.25); }
.hp-console .hp-pane input::placeholder { color: #7d8b9c; }
.hp-unit { position: absolute; right: 14px; font-size: 12px; font-weight: 800; letter-spacing: .08em; color: #9fb0c4; pointer-events: none; }
.hp-row .hp-btn { justify-content: center; border-radius: 10px; padding: 13px 22px; white-space: nowrap; }
.hp-btn-shine { position: relative; overflow: hidden; }
.hp-btn-shine::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.6) 50%, transparent 70%); transform: translateX(-130%); }
.hp-btn-shine:hover::after { animation: hp-shine .8s ease-out; }
.hp-btn-shine span { transition: transform .2s; }
.hp-btn-shine:hover span { transform: translateX(4px); }
@keyframes hp-shine { to { transform: translateX(130%); } }
.hp-calc { min-height: 1.4em; margin: 10px 0 0; font-size: 13px; font-weight: 600; color: #7ff0ee; }
.hp-calc:empty { margin: 0; min-height: 0; }
.hp-calc b { color: #fff; font-variant-numeric: tabular-nums; }
.hp-console .hp-fee { text-align: left; color: #9fb0c4; margin: 10px 0 0; font-size: 12.5px; }
.hp-console .hp-fee a { color: #7ff0ee; }
.hp-chips { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; }
.hp-chips li { display: grid; grid-template-columns: 38px 1fr; column-gap: 12px; align-items: center; padding: 10px 14px 10px 10px; border-radius: 10px; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.05); animation: hp-rise .5s ease-out both; }
.hp-chips li:nth-child(1) { animation-delay: .35s; } .hp-chips li:nth-child(2) { animation-delay: .5s; } .hp-chips li:nth-child(3) { animation-delay: .65s; }
.hp-chips svg { grid-row: 1 / 3; width: 38px; height: 38px; padding: 8px; box-sizing: border-box; border-radius: 10px; fill: none; stroke: #7ff0ee; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; background: rgba(91,217,230,.14); box-shadow: inset 0 0 0 1px rgba(91,217,230,.3); }
.hp-chips b { font-size: 14px; color: #fff; }
.hp-chips span { font-size: 12.5px; color: #9fb0c4; }
.hp-uses-v { margin-top: 0; padding: 20px 20px 14px; }
.hp-uses-v .hp-uses-nav a { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px 7px 9px; font-size: 12.5px; }
.hp-uses-nav svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.hp-uses-v .hp-uses-track { flex-direction: column; overflow: hidden auto; scroll-snap-type: y mandatory; height: 440px; margin: 14px 0 0; }
.js .hp-uses-v .hp-uses-track { overflow: hidden; }
.hp-uses-v .hp-use { flex: 0 0 100%; height: 100%; padding: 4px 2px; gap: 14px; grid-template-columns: 1fr; align-content: start; align-items: start; }
.hp-uses-v .hp-use-icon { width: 40px; height: 40px; }
.hp-uses-v .hp-use h2 { font-size: 22px; margin: 10px 0 6px; }
.hp-uses-v .hp-use-copy p { font-size: 14px; }
.hp-uses-v .hp-flow { grid-template-columns: 1fr; gap: 8px; }
.hp-uses-v .hp-flow li { grid-template-columns: 30px 1fr; column-gap: 10px; row-gap: 0; }
.hp-uses-v .hp-flow li i { width: 30px; height: 30px; font-size: 12px; }
.hp-uses-v .hp-flow li span { padding-top: 6px; font-size: 13.5px; }
.hp-uses-v .hp-flow li + li::before { left: 14px; right: auto; top: -10px; width: 2px; height: 12px; background: rgba(91,217,230,.45); }
.hp-uses-v .hp-uses-ctrl { margin-top: 10px; }
.hp-uses-v .hp-uses-dots { flex-direction: row; }
/* Teanc 3D (doar cu JS): cardul activ în față cu chenar holografic, următoarele în spate; pașii se aprind pe rând ca o tranzacție care rulează */
@property --hp-a { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.hp-uses-v .hp-use { --acc: #5bd9e6; --acc-2: #7ff0ee; }
.hp-uses-v .hp-use.hp-use-vehicule { --acc: #3ea0ff; --acc-2: #9dd0ff; }
.hp-uses-v .hp-use.hp-use-produse { --acc: #8f7bff; --acc-2: #c4b8ff; }
.hp-uses-v .hp-use.hp-use-servicii { --acc: #ffb547; --acc-2: #ffd699; }
.hp-uses-v .hp-use-icon { stroke: var(--acc-2); filter: drop-shadow(0 0 12px color-mix(in srgb, var(--acc) 60%, transparent)); }
.hp-uses-v .hp-flow li i { background: linear-gradient(135deg, var(--acc-2), var(--acc)); box-shadow: 0 0 0 4px color-mix(in srgb, var(--acc) 16%, transparent), 0 0 22px color-mix(in srgb, var(--acc) 50%, transparent); }
.hp-uses-v .hp-flow li + li::before { background: color-mix(in srgb, var(--acc) 45%, transparent); }
.js .hp-deck .hp-uses-track { overflow: visible; position: relative; min-height: 430px; margin: 16px 0 46px; perspective: 1400px; }
.js .hp-deck .hp-use { position: absolute; left: 0; right: 0; top: 0; height: auto; box-sizing: border-box; padding: 22px 24px 24px; border-radius: 10px; border: 1px solid transparent; background: linear-gradient(165deg, #152540, #0e1827 70%) padding-box, conic-gradient(from var(--hp-a), rgba(255,255,255,.05), var(--acc) 28%, rgba(255,255,255,.05) 52%, var(--acc-2) 78%, rgba(255,255,255,.05)) border-box; box-shadow: 0 30px 60px -30px rgba(0,0,0,.8); transform-origin: 50% 100%; transition: transform .8s cubic-bezier(.2,.8,.2,1), opacity .6s ease, filter .6s ease; opacity: 0; pointer-events: none; transform: translateY(80px) scale(.86); }
.js .hp-deck .hp-use > * { transition: opacity .35s ease; }
.js .hp-deck .hp-use:not(.is-active) > * { opacity: 0; }
.js .hp-deck .hp-use.is-next2 { opacity: .35; transform: translateY(54px) scale(.9); filter: blur(1px); z-index: 1; }
.js .hp-deck .hp-use.is-next { opacity: .6; transform: translateY(27px) scale(.95); z-index: 2; }
.js .hp-deck .hp-use.is-prev { opacity: 0; transform: translateY(-50px) scale(.96) rotateX(12deg); z-index: 0; }
.js .hp-deck .hp-use.is-active { opacity: 1; pointer-events: auto; z-index: 3; transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); animation: hp-holo 6s linear infinite, hp-card-glow 7s ease-out both; }
@keyframes hp-holo { to { --hp-a: 360deg; } }
@keyframes hp-card-glow { 0%, 60% { box-shadow: 0 30px 60px -30px rgba(0,0,0,.8); } 70% { box-shadow: 0 30px 60px -30px rgba(0,0,0,.8), 0 0 0 5px color-mix(in srgb, var(--acc) 28%, transparent), 0 0 70px color-mix(in srgb, var(--acc) 55%, transparent); } 100% { box-shadow: 0 30px 60px -30px rgba(0,0,0,.8), 0 0 36px color-mix(in srgb, var(--acc) 28%, transparent); } }
.js .hp-deck .hp-use-copy > * { opacity: 0; }
.js .hp-deck .is-active .hp-use-copy > * { animation: hp-rise .6s ease-out both; }
.js .hp-deck .is-active .hp-use-copy > :nth-child(2) { animation-delay: .08s; }
.js .hp-deck .is-active .hp-use-copy > :nth-child(3) { animation-delay: .16s; }
@keyframes hp-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.js .hp-deck .hp-use-icon * { stroke-dasharray: 180; stroke-dashoffset: 180; }
.js .hp-deck .is-active .hp-use-icon * { animation: hp-draw 1.6s ease-out both; }
@keyframes hp-draw { to { stroke-dashoffset: 0; } }
.js .hp-deck .hp-flow li i { position: relative; isolation: isolate; overflow: hidden; background: rgba(255,255,255,.05); color: #93a1b3; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.16); }
.js .hp-deck .hp-flow li i::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 10px; background: linear-gradient(135deg, var(--acc-2), var(--acc)); opacity: 0; }
.js .hp-deck .hp-flow li span { color: #8e9cae; }
.js .hp-deck .hp-flow li + li::before { transform: scaleY(0); transform-origin: top; background: var(--acc); }
.js .hp-deck .is-active .hp-flow li i::after { animation: hp-fill .4s ease-out both; }
.js .hp-deck .is-active .hp-flow li i { animation: hp-node .4s ease-out both; }
.js .hp-deck .is-active .hp-flow li span { animation: hp-text .4s ease-out both; }
.js .hp-deck .is-active .hp-flow li + li::before { animation: hp-link .45s ease-in both; }
.js .hp-deck .is-active .hp-flow li:nth-child(1) i, .js .hp-deck .is-active .hp-flow li:nth-child(1) i::after, .js .hp-deck .is-active .hp-flow li:nth-child(1) span { animation-delay: .6s; }
.js .hp-deck .is-active .hp-flow li:nth-child(2) i, .js .hp-deck .is-active .hp-flow li:nth-child(2) i::after, .js .hp-deck .is-active .hp-flow li:nth-child(2) span { animation-delay: 1.5s; }
.js .hp-deck .is-active .hp-flow li:nth-child(3) i, .js .hp-deck .is-active .hp-flow li:nth-child(3) i::after, .js .hp-deck .is-active .hp-flow li:nth-child(3) span { animation-delay: 2.4s; }
.js .hp-deck .is-active .hp-flow li:nth-child(4) i, .js .hp-deck .is-active .hp-flow li:nth-child(4) i::after, .js .hp-deck .is-active .hp-flow li:nth-child(4) span { animation-delay: 3.3s; }
.js .hp-deck .is-active .hp-flow li:nth-child(5) i, .js .hp-deck .is-active .hp-flow li:nth-child(5) i::after, .js .hp-deck .is-active .hp-flow li:nth-child(5) span { animation-delay: 4.2s; }
.js .hp-deck .is-active .hp-flow li:nth-child(2)::before { animation-delay: 1.05s; }
.js .hp-deck .is-active .hp-flow li:nth-child(3)::before { animation-delay: 1.95s; }
.js .hp-deck .is-active .hp-flow li:nth-child(4)::before { animation-delay: 2.85s; }
.js .hp-deck .is-active .hp-flow li:nth-child(5)::before { animation-delay: 3.75s; }
@keyframes hp-fill { to { opacity: 1; } }
@keyframes hp-node { to { color: #06201f; box-shadow: 0 0 0 4px color-mix(in srgb, var(--acc) 18%, transparent), 0 0 22px color-mix(in srgb, var(--acc) 55%, transparent); } }
@keyframes hp-text { to { color: #fff; } }
@keyframes hp-link { to { transform: scaleY(1); } }
.js .hp-deck .hp-uses-dots i { position: relative; overflow: hidden; }
.js .hp-deck .hp-uses-dots i.is-on::after { content: ""; position: absolute; inset: 0; background: rgba(255,255,255,.55); transform-origin: left; transform: scaleX(0); animation: hp-progress 7s linear both; }
.js .hp-deck.is-paused .hp-uses-dots i.is-on::after { animation-play-state: paused; }
@keyframes hp-progress { to { transform: scaleX(1); } }
.hp-deck .hp-uses-nav a.is-on { background: var(--acc-on, var(--teal)); }
.hp-deck.on-vehicule { --acc-on: #3ea0ff; } .hp-deck.on-produse { --acc-on: #8f7bff; } .hp-deck.on-servicii { --acc-on: #ffb547; }
.hp-eyebrow-pill { padding: 7px 14px 7px 9px; border: 1px solid rgba(91,217,230,.5); border-radius: 10px; background: rgba(91,217,230,.08); box-shadow: 0 0 24px rgba(91,217,230,.18), inset 0 0 0 1px rgba(255,255,255,.04); }
.hp-eyebrow-pill svg { width: 18px; height: 18px; fill: none; stroke: #7ff0ee; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.hp-eyebrow-ic svg { width: 22px; height: 22px; padding: 4px; box-sizing: border-box; border-radius: 7px; fill: none; stroke: #7ff0ee; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; background: rgba(91,217,230,.16); box-shadow: inset 0 0 0 1px rgba(91,217,230,.35), 0 0 14px rgba(91,217,230,.3); }
.hp-ctl-select::after { content: ""; position: absolute; right: 16px; top: 50%; width: 8px; height: 8px; border-right: 2px solid #7ff0ee; border-bottom: 2px solid #7ff0ee; transform: translateY(-70%) rotate(45deg); pointer-events: none; transition: transform .2s; }
.hp-ctl-select:focus-within::after { transform: translateY(-30%) rotate(225deg); }
.hp-console .hp-pane select { appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer; }
.hp-console .hp-pane select:hover { border-color: rgba(91,217,230,.5); }
.hp-console .hp-pane select option, .hp-console .hp-pane select optgroup { background: #0f1a2a; color: #e8eef6; font-weight: 600; }
/* Banda de încredere: linie de date cu punct de lumină, plăci cu cifre numărate de JS, insigne-medalion cu inel rotitor */
.hp-trust { position: relative; margin-top: 48px; padding: 26px 0 28px; display: grid; gap: 18px; }
.hp-trust::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(91,217,230,.55) 20%, rgba(124,108,255,.55) 80%, transparent); }
.hp-trust::after { content: ""; position: absolute; top: -3px; left: 0; width: 120px; height: 7px; border-radius: 10px; background: radial-gradient(closest-side, #7ff0ee, rgba(91,217,230,.5) 50%, transparent); filter: blur(1px); animation: hp-run 5s linear infinite; }
@keyframes hp-run { from { left: -120px; } to { left: 100%; } }
.hp-stats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.hp-stats li { --acc: var(--teal); --acc-2: #7ff0ee; position: relative; padding: 12px 12px 12px 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,.1); background: linear-gradient(160deg, rgba(255,255,255,.07), rgba(255,255,255,.02)); transition: transform .2s, border-color .2s; }
.hp-stats li:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--acc) 50%, transparent); }
.hp-stats li.hp-stat-b { --acc: #3ea0ff; --acc-2: #9dd0ff; }
.hp-stats li.hp-stat-c { --acc: #8f7bff; --acc-2: #c4b8ff; }
.hp-stats li i { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 9px; background: color-mix(in srgb, var(--acc) 16%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--acc) 35%, transparent), 0 0 18px color-mix(in srgb, var(--acc) 25%, transparent); margin-bottom: 8px; }
.hp-stats li i svg { width: 16px; height: 16px; fill: none; stroke: var(--acc-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hp-stats strong { display: block; font-size: 30px; font-weight: 900; letter-spacing: -.02em; line-height: 1; font-variant-numeric: tabular-nums; background: linear-gradient(90deg, #fff, var(--acc-2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hp-stats span { display: block; margin-top: 4px; font-size: 12.5px; color: #b7c3d3; }
.hp-badges { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.hp-badges li { display: flex; align-items: center; gap: 12px; padding: 8px 14px 8px 8px; border: 1px solid rgba(255,255,255,.1); border-radius: 10px; background: rgba(255,255,255,.05); font-size: 12px; color: #b7c3d3; line-height: 1.25; }
.hp-badges b { position: relative; flex: none; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: #0f1a2a; }
.hp-badges b::before { content: ""; position: absolute; inset: -2px; border-radius: 10px; background: conic-gradient(from var(--hp-a), rgba(91,217,230,.1), #5bd9e6 35%, rgba(124,108,255,.9) 60%, rgba(91,217,230,.1)); z-index: -1; animation: hp-holo 4s linear infinite; }
.hp-badges b::after { content: ""; position: absolute; inset: 0; border-radius: 10px; background: #0f1a2a; z-index: -1; }
.hp-badges b svg { width: 18px; height: 18px; fill: none; stroke: #7ff0ee; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hp-badges em { display: block; font-style: normal; font-weight: 900; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: #fff; }

/* Secțiuni */
.hp-section { padding: 72px 0; }
.hp-head { max-width: 760px; margin-bottom: 30px; }
.hp-head-row { max-width: none; display: flex; justify-content: space-between; align-items: end; flex-wrap: wrap; gap: 12px; }
.hp-mt { margin-top: 56px; }
/* Cum funcționează: harta escrow — trei noduri, săgeți cu flux animat și obiecte în mișcare (SMIL), carduri cu pașii pe fiecare flux, apoi lista pașilor */
.hp-lane-buyer { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #7ff0ee; }
.hp-lane-us { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
.hp-lane-seller { --lane: #2b7fd6; --lane-2: #1b5aa3; --lane-l: #9dd0ff; }
.hp-how { padding: 64px 0; }
.hp-how .hp-head { margin-bottom: 22px; }
/* Antetul secțiunii „Cum funcționează”: pastilă cu iconiță, titlu cu accent, mini-stepper sincronizat cu povestea, trei fapte-cheie */
.hp-how-head { max-width: none; display: grid; gap: 28px; margin-bottom: 36px; }
.hp-eyebrow-fancy { position: relative; display: inline-flex; align-items: center; gap: 10px; padding: 6px 8px 6px 6px; border-radius: 10px; border: 1px solid transparent; background: linear-gradient(#fff, #fff) padding-box, conic-gradient(from var(--hp-a), #5bd9e6, #18afff 35%, #7c6cff 60%, #5bd9e6) border-box; box-shadow: 0 10px 30px -14px rgba(24,175,255,.55), 0 1px 2px rgba(15,26,42,.05); animation: hp-holo 8s linear infinite; letter-spacing: .06em; white-space: nowrap; }
.hp-eyebrow-fancy i { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 10px; background: linear-gradient(135deg, #5bd9e6, #18afff); box-shadow: 0 6px 14px -6px rgba(24,175,255,.9); }
.hp-eyebrow-fancy i svg { width: 15px; height: 15px; fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.hp-eyebrow-fancy span { background: linear-gradient(90deg, #0c7a79, #18afff 60%, #4b3fd6); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hp-eyebrow-fancy b { font-size: 10px; letter-spacing: .08em; color: #fff; background: linear-gradient(135deg, #18afff, #7c6cff); border-radius: 10px; padding: 4px 9px; box-shadow: 0 6px 14px -8px rgba(124,108,255,.9); }
@media (prefers-reduced-motion: reduce) { .hp-eyebrow-fancy, .hp-panel-ill { animation: none; } }
.hp-eyebrow-light { color: var(--teal-2); border-color: rgba(12,122,121,.35); background: rgba(91,217,230,.12); box-shadow: 0 0 22px rgba(91,217,230,.18); }
.hp-eyebrow-light svg { stroke: var(--teal-2); }
.hp-how-head h2 { margin-bottom: 22px; }
.hp-grad-2 { background: linear-gradient(90deg, #18afff, #7c6cff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hp-how-dots { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 0; }
.hp-how-dots li { display: flex; align-items: center; gap: 6px; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11px; font-weight: 800; letter-spacing: .06em; color: var(--lane-2); }
.hp-how-dots li i { width: 12px; height: 12px; border-radius: 50%; background: var(--lane); box-shadow: 0 0 0 3px color-mix(in srgb, var(--lane) 18%, transparent); transition: transform .3s, box-shadow .3s; }
.hp-how-dots li::after { content: ""; width: 22px; height: 2px; margin: 0 8px; background: linear-gradient(90deg, color-mix(in srgb, var(--lane) 50%, transparent), rgba(15,26,42,.1)); }
.hp-how-dots li:last-child::after { display: none; }
.hp-how-dots li.is-on i { transform: scale(1.35); box-shadow: 0 0 0 5px color-mix(in srgb, var(--lane) 22%, transparent), 0 0 18px color-mix(in srgb, var(--lane) 70%, transparent); }
.hp-how-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.hp-how-facts li { display: grid; grid-template-columns: 44px 1fr; column-gap: 14px; align-items: center; padding: 14px 18px 14px 12px; row-gap: 2px; border-radius: 10px; background: #fff; border: 1px solid color-mix(in srgb, var(--lane) 20%, #e6ebf2); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 16px 30px -24px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.3)); transition: translate .2s, box-shadow .3s; }
.hp-how-facts li:hover { translate: 0 -3px; }
.hp-how-facts li i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 8px 16px -8px color-mix(in srgb, var(--lane) 80%, transparent); }
.hp-how-facts li svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.hp-how-facts b { font-size: 14px; color: var(--ink); }
.hp-how-facts span { font-size: 12.5px; color: var(--mute); }
.hp-map { position: relative; display: grid; grid-template-columns: 1fr; gap: 12px; }
.hp-map-svg, .hp-map-tag { display: none; }
.hp-map-node { position: relative; display: grid; grid-template-columns: 150px 1fr; column-gap: 14px; align-items: center; padding: 6px 0; }
.hp-ill { width: 100%; height: auto; display: block; filter: drop-shadow(0 14px 18px rgba(15,26,42,.12)); }
.hp-ill-wrap { position: relative; grid-row: 1 / 5; }
.hp-map-amount { position: absolute; left: 26%; right: 26%; top: 29%; height: 15%; display: flex; align-items: center; justify-content: center; margin: 0; white-space: nowrap; font-size: 9.5px; font-weight: 900; color: #4b3fd6; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.hp-map-node b { font-size: 15px; color: var(--ink); }
.hp-map-node span { font-size: 12.5px; color: var(--mute); line-height: 1.4; }
.hp-map-node > svg { grid-row: 1 / 5; }
.hp-map-node em { grid-column: 2; font-style: normal; font-size: 11.5px; color: var(--mute); }
.hp-map-vault .hp-map-cur { grid-column: 2; }
.hp-map-cur { font-size: 10.5px; font-weight: 800; letter-spacing: .12em; color: var(--lane-2); }
.hp-lock-open, .hp-map-badge { display: none; }
.hp-map.ph-out .hp-lock-closed { display: none; } .hp-map.ph-out .hp-lock-open { display: block; }
.hp-map-phases span { color: var(--mute); }
.hp-map-phases { position: relative; display: block; height: 2.6em; width: 100%; }
.hp-map-phases span { position: absolute; left: 0; right: 0; top: 0; opacity: 0; transition: opacity .35s; }
.hp-map-phases .hp-ph-2 { opacity: 1; }
.hp-map-steps { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.hp-map-steps li { position: relative; display: grid; grid-template-columns: 82px 1fr; column-gap: 12px; align-items: start; padding: 12px; border-radius: 10px; border: 1px solid rgba(15,26,42,.08); background: #fff; box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 18px 34px -26px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.3)); transition: translate .25s, box-shadow .3s, border-color .3s, opacity .5s, transform .5s; }
.hp-step-ill { grid-row: 1 / 4; width: 82px; height: 62px; padding: 4px; box-sizing: border-box; border-radius: 10px; background: linear-gradient(180deg, color-mix(in srgb, var(--lane) 10%, #fff), color-mix(in srgb, var(--lane) 3%, #fff)); filter: drop-shadow(0 6px 8px rgba(15,26,42,.12)); }
.hp-map-steps b { position: absolute; left: 8px; top: 8px; width: 24px; height: 24px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 10.5px; font-weight: 900; color: #fff; background: linear-gradient(135deg, color-mix(in srgb, var(--lane) 70%, #fff), var(--lane-2)); box-shadow: 0 0 0 2px #fff, 0 4px 10px -4px color-mix(in srgb, var(--lane) 90%, transparent); font-variant-numeric: tabular-nums; }
.hp-map-steps strong { display: block; font-size: 14.5px; color: var(--ink); margin-bottom: 3px; }
.hp-map-steps span { font-size: 13px; color: var(--mute); line-height: 1.45; }
.hp-map-steps em { grid-column: 2; justify-self: start; margin-top: 8px; font-style: normal; font-size: 9.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--lane-2); background: color-mix(in srgb, var(--lane) 12%, transparent); border-radius: 10px; padding: 3px 8px; }
.hp-map-steps li.is-on { border-color: var(--lane); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 18px 34px -26px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.3)), 0 0 0 4px color-mix(in srgb, var(--lane) 16%, transparent), 0 0 30px color-mix(in srgb, var(--lane) 30%, transparent); translate: 0 -4px; }
.hp-map-steps li:hover { translate: 0 -4px; }
@media (min-width: 900px) {
  .hp-how { padding: 104px 0 96px; }
  .hp-how-head { grid-template-columns: 1.25fr .75fr; align-items: center; gap: 72px; margin-bottom: 44px; }
  .hp-map { display: block; aspect-ratio: 1000 / 460; padding: 0; margin-top: 16px; }
  .hp-map-svg { display: block; position: absolute; inset: 0; width: 100%; height: 100%; }
  .hp-map-track { fill: none; stroke: rgba(15,26,42,.1); stroke-width: 2; }
  .hp-map-flow { fill: none; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 10 12; animation: hp-map-dash 3s linear infinite; }
  .hp-map-teal { stroke: #5bd9e6; } .hp-map-violet { stroke: #7c6cff; } .hp-map-blue { stroke: #2b7fd6; }
  @keyframes hp-map-dash { to { stroke-dashoffset: -22; } }
  .hp-map-mover { filter: drop-shadow(0 4px 8px rgba(15,26,42,.3)); }
  .hp-map-node { position: absolute; top: 50%; transform: translate(-50%, -50%); width: 19%; grid-template-columns: 1fr; justify-items: center; text-align: center; row-gap: 3px; padding: 0; animation: hp-float 6s ease-in-out infinite; }
  .hp-map-node > svg, .hp-ill-wrap { grid-row: auto; width: 100%; margin-bottom: 6px; }
  .hp-map-amount { font-size: clamp(11px, 1.05vw, 17px); }
  .hp-map-node:hover .hp-ill { filter: drop-shadow(0 22px 24px rgba(15,26,42,.18)); }
  @keyframes hp-float { 50% { translate: 0 -7px; } }
  .hp-map-seller { animation-delay: -2s; } .hp-map-vault { animation-delay: -4s; }
  @keyframes hp-float { 50% { translate: 0 -7px; } }
  .hp-map-seller { animation-delay: 0s, -2s; } .hp-map-vault { animation-delay: 0s, -4s; }
  .hp-map-cur { grid-column: auto; }
  .hp-map-vault .hp-map-cur { grid-column: auto; }
  .hp-map-node em { grid-column: auto; margin-top: 2px; }
  .hp-map-buyer { left: 12%; } .hp-map-vault { left: 50%; width: 22%; } .hp-map-seller { left: 88%; }
  .hp-map-vault .hp-ill { filter: drop-shadow(0 16px 22px rgba(124,108,255,.28)); }
  .hp-map.ph-goods .hp-ill-safe, .hp-map.ph-ok .hp-ill-safe { filter: drop-shadow(0 16px 22px rgba(124,108,255,.28)) drop-shadow(0 0 18px rgba(124,108,255,.55)); }
  .hp-map-tag { position: absolute; display: grid; gap: 6px; transform: translate(-50%, -50%); padding: 12px 14px 12px 12px; border-radius: 10px; background: linear-gradient(180deg, color-mix(in srgb, var(--lane) 9%, #fff) 0%, #fff 42%); border: 1px solid color-mix(in srgb, var(--lane) 24%, #e6ebf2); box-shadow: 0 1px 2px rgba(15,26,42,.05), 0 24px 44px -26px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.4)); font-size: 13px; color: var(--ink); white-space: nowrap; animation: hp-float 7s ease-in-out infinite -1s; transition: box-shadow .4s, border-color .4s, translate .25s; }
  .hp-map-tag::after { content: ""; position: absolute; left: 50%; bottom: -8px; width: 14px; height: 14px; background: #fff; border-right: 1px solid color-mix(in srgb, var(--lane) 22%, #e6ebf2); border-bottom: 1px solid color-mix(in srgb, var(--lane) 22%, #e6ebf2); transform: translateX(-50%) rotate(45deg); }
  .hp-map-tag-goods::after { bottom: auto; top: -8px; border: 0; border-left: 1px solid color-mix(in srgb, var(--lane) 22%, #e6ebf2); border-top: 1px solid color-mix(in srgb, var(--lane) 22%, #e6ebf2); }
  .hp-map-tag p { display: flex; align-items: center; gap: 10px; margin: -4px 0 6px; font-size: 13px; font-weight: 800; letter-spacing: .01em; color: var(--ink); }
  .hp-tag-ill { width: 76px; height: 55px; flex: none; filter: drop-shadow(0 6px 8px rgba(15,26,42,.14)); }
  .hp-map-tag span { display: flex; align-items: center; gap: 9px; padding: 6px 8px 6px 6px; border-radius: 10px; background: rgba(15,26,42,.035); font-weight: 700; color: var(--ink); }
  .hp-map-tag span b { flex: none; width: 24px; height: 24px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 10.5px; font-weight: 900; color: #fff; background: linear-gradient(135deg, color-mix(in srgb, var(--lane) 70%, #fff), var(--lane-2)); box-shadow: 0 0 0 2px #fff, 0 4px 10px -4px color-mix(in srgb, var(--lane) 90%, transparent); }
  .hp-map-tag span i { margin-left: 6px; font-style: normal; font-weight: 800; font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--lane-2); background: color-mix(in srgb, var(--lane) 12%, transparent); border-radius: 10px; padding: 3px 8px; }
  .hp-map-tag span i::before { content: ""; }
  .hp-map-tag-in { left: 25%; top: 12%; } .hp-map-tag-out { left: 75%; top: 12%; animation-delay: -3.5s; } .hp-map-tag-goods { left: 50%; top: 91%; animation-delay: -5s; }
  /* Povestea în buclă de 10 s: fazele sunt clase puse de JS pe .hp-map din ceasul SVG (ph-in, ph-goods, ph-ok, ph-out); fără JS: stare statică */
  .hp-map-phases { position: relative; display: block; height: 2.6em; width: 100%; justify-self: stretch; text-align: center; }
  .hp-map-phases { text-align: center; }
  .hp-map-phases .hp-ph-2 { opacity: 1; }
  .hp-map.ph-in .hp-ph-2, .hp-map.ph-out .hp-ph-2 { opacity: 0; }
  .hp-map.ph-in .hp-ph-1, .hp-map.ph-out .hp-ph-3 { opacity: 1; }
  .hp-map-badge { display: flex; align-items: center; gap: 7px; position: absolute; right: 4%; top: 2%; z-index: 2; font-size: 12.5px; font-weight: 900; letter-spacing: .01em; text-decoration: none; color: #06201f; padding: 5px 13px 5px 6px; border-radius: 10px; background: linear-gradient(135deg, #9beef5, #5bd9e6 60%, #2fb7c6); box-shadow: 0 10px 24px -8px rgba(91,217,230,.9), inset 0 1px 0 rgba(255,255,255,.7); opacity: 0; transform: scale(.4) rotate(-8deg); }
  .hp-map-badge i { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 10px; background: #fff; box-shadow: 0 2px 6px rgba(15,26,42,.2); }
  .hp-map-badge i svg { width: 15px; height: 15px; fill: none; stroke: #0c7a79; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 40; stroke-dashoffset: 40; }
  .hp-map-badge::before { content: ""; position: absolute; inset: -3px; border-radius: 10px; border: 1.5px solid #5bd9e6; opacity: 0; pointer-events: none; }
  .hp-map-badge::after { content: ""; position: absolute; left: 50%; top: 50%; width: 5px; height: 5px; border-radius: 50%; background: #fff; opacity: 0; pointer-events: none; box-shadow: -34px -18px 0 #fff, 32px -20px 0 #9beef5, -28px 16px 0 #9beef5, 36px 14px 0 #fff, 0 -30px 0 #fff, 0 28px 0 #9beef5; }
  .hp-map-badge.is-on { animation: hp-pop .7s cubic-bezier(.2,1.6,.4,1) both; }
  .hp-map-badge.is-on i svg { animation: hp-draw-badge .5s ease-out .25s both; }
  .hp-map-badge.is-on::before { animation: hp-ring .7s ease-out .1s both; }
  .hp-map-badge.is-on::after { animation: hp-sparks .9s ease-out .15s both; }
  @keyframes hp-pop { 0% { opacity: 0; transform: scale(.4) rotate(-8deg); } 100% { opacity: 1; transform: scale(1) rotate(0); } }
  @keyframes hp-draw-badge { to { stroke-dashoffset: 0; } }
  @keyframes hp-ring { 0% { opacity: .75; transform: scale(.9); } 100% { opacity: 0; transform: scale(1.45); } }
  @keyframes hp-sparks { 0% { opacity: 0; transform: translate(-50%, -50%) scale(.2); } 30% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, -50%) scale(1.5); } }
  .hp-map-shipped { left: 2%; right: auto; color: #fff; background: linear-gradient(135deg, #9dd0ff, #2b7fd6 60%, #1b5aa3); box-shadow: 0 10px 24px -8px rgba(43,127,214,.9), inset 0 1px 0 rgba(255,255,255,.45); }
  .hp-map-shipped i svg { stroke: #1b5aa3; } .hp-map-shipped::before { border-color: #2b7fd6; } .hp-map-shipped::after { box-shadow: -34px -18px 0 #fff, 32px -20px 0 #9dd0ff, -28px 16px 0 #9dd0ff, 36px 14px 0 #fff, 0 -30px 0 #fff, 0 28px 0 #9dd0ff; }
  .hp-map-paid { color: #fff; background: linear-gradient(135deg, #c4b8ff, #7c6cff 60%, #4b3fd6); box-shadow: 0 10px 24px -8px rgba(124,108,255,.9), inset 0 1px 0 rgba(255,255,255,.45); }
  .hp-map-paid i svg { stroke: #4b3fd6; } .hp-map-paid::before { border-color: #7c6cff; } .hp-map-paid::after { box-shadow: -34px -18px 0 #fff, 32px -20px 0 #c4b8ff, -28px 16px 0 #c4b8ff, 36px 14px 0 #fff, 0 -30px 0 #fff, 0 28px 0 #c4b8ff; }
  .hp-map-badge.is-on { opacity: 1; transform: none; }
  .hp-map.ph-paid .hp-lock-closed { display: none; } .hp-map.ph-paid .hp-lock-open { display: block; }
  .hp-map.ph-paid .hp-ph-2 { opacity: 0; } .hp-map.ph-paid .hp-ph-3 { opacity: 1; }
  .hp-map-tag:hover { translate: 0 -4px; }
  .hp-map.ph-in .hp-map-tag-in, .hp-map.ph-goods .hp-map-tag-goods, .hp-map.ph-ok .hp-map-tag-goods, .hp-map.ph-out .hp-map-tag-out, .hp-map.ph-paid .hp-map-tag-out { border-color: var(--lane); box-shadow: 0 1px 2px rgba(15,26,42,.05), 0 24px 44px -26px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.4)), 0 0 0 4px color-mix(in srgb, var(--lane) 16%, transparent), 0 0 36px color-mix(in srgb, var(--lane) 35%, transparent); }
  /* Intrare la derulare: starea finală e cea de bază, doar starea „înainte” e diferită */
  .js .hp-map:not(.is-in) .hp-map-node { opacity: 0; transform: translate(-50%, -40%) scale(.94); }
  .js .hp-map:not(.is-in) .hp-map-tag { opacity: 0; transform: translate(-50%, -70%); }
  .js .hp-map:not(.is-in) .hp-map-svg { opacity: 0; }
  .js .hp-map .hp-map-node { transition: opacity .6s ease-out, transform .7s cubic-bezier(.2,1.2,.3,1); }
  .js .hp-map .hp-map-tag { transition: opacity .5s ease-out .35s, transform .6s cubic-bezier(.2,1.2,.3,1) .35s, box-shadow .4s; }
  .js .hp-map .hp-map-svg { transition: opacity .8s ease-out .5s; }
  .js .hp-map .hp-map-vault { transition-delay: .12s; } .js .hp-map .hp-map-seller { transition-delay: .24s; }
  .hp-map-steps { grid-template-columns: repeat(5, 1fr); gap: 20px; margin-top: 64px; }
  .hp-map-steps li { grid-template-columns: 1fr; row-gap: 10px; padding: 14px 16px 18px; }
  .hp-step-ill { grid-row: auto; width: 100%; height: 96px; padding: 8px; margin-bottom: 4px; }
  .hp-map-steps b { left: auto; right: 20px; top: 20px; }
  .hp-map-steps li + li::before { content: ""; position: absolute; left: -20px; top: 62px; width: 20px; border-top: 2px dashed color-mix(in srgb, var(--lane) 45%, transparent); }
  .js .hp-map-steps:not(.is-in) li { opacity: 0; transform: translateY(18px); }
  .js .hp-map-steps.is-in li:nth-child(2) { transition-delay: .1s; } .js .hp-map-steps.is-in li:nth-child(3) { transition-delay: .2s; } .js .hp-map-steps.is-in li:nth-child(4) { transition-delay: .3s; } .js .hp-map-steps.is-in li:nth-child(5) { transition-delay: .4s; }
  .hp-map-steps em { grid-column: auto; }
}
.hp-btn-sm { padding: 11px 18px; font-size: 14px; }
@keyframes hp-ring { 0% { opacity: .75; transform: scale(.9); } 100% { opacity: 0; transform: scale(1.45); } }
.hp-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.hp-cat { --lane: #5bd9e6; --lane-2: #0c7a79; --lane-l: #9beef5; position: relative; display: flex; flex-direction: column; padding: 16px 16px 12px; background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--lane) 4%, #fff)); border: 1px solid color-mix(in srgb, var(--lane) 20%, #e6ebf2); border-radius: 10px; color: var(--ink); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 18px 34px -28px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.3)); overflow: hidden; transition: translate .2s, box-shadow .3s, border-color .3s; }
.hp-cat::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: linear-gradient(90deg, var(--lane-l), var(--lane), var(--lane-2)); transform: scaleX(0); transform-origin: left; transition: transform .45s cubic-bezier(.2,.8,.2,1); }
.hp-cat:hover::before { transform: scaleX(1); }
.hp-cat-c1 { --lane: #18afff; --lane-2: #1b5aa3; --lane-l: #9dd0ff; }
.hp-cat-c2 { --lane: #7c6cff; --lane-2: #4b3fd6; --lane-l: #c4b8ff; }
.hp-cat:hover { translate: 0 -4px; border-color: var(--lane); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 24px 44px -26px color-mix(in srgb, var(--lane) 70%, rgba(15,26,42,.35)), 0 0 0 4px color-mix(in srgb, var(--lane) 14%, transparent); }
/* the big faint icon in the corner, behind everything */
.hp-cat-mark { position: absolute; right: -22px; top: -18px; width: 150px; height: 150px; pointer-events: none; opacity: .07; transform: rotate(-10deg); transition: transform .5s, opacity .3s; }
.hp-cat-mark svg { width: 100%; height: 100%; fill: none; stroke: var(--lane-2); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.hp-cat:hover .hp-cat-mark { opacity: .12; transform: rotate(-4deg) scale(1.06); }
/* the main link: icon, name, count and the arrow; it also covers the card (::after), the subcategory links sit above it */
.hp-cat-main { position: static; display: grid; grid-template-columns: 52px 1fr; grid-template-rows: auto auto; column-gap: 14px; align-items: center; padding-right: 52px; color: inherit; text-decoration: none; }
.hp-cat-main::after { content: ""; position: absolute; inset: 0; }
.hp-cat-ic { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 10px 20px -10px color-mix(in srgb, var(--lane) 85%, transparent), inset 0 1px 0 rgba(255,255,255,.6); transition: transform .3s; }
.hp-cat:hover .hp-cat-ic { transform: scale(1.06) rotate(-4deg); }
.hp-cat-ic svg { width: 26px; height: 26px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hp-cat-name { display: block; font-weight: 800; font-size: 18px; letter-spacing: -.01em; line-height: 1.15; }
.hp-cat-n { display: block; margin-top: 3px; font-size: 12px; font-weight: 700; color: var(--lane-2); opacity: .85; }
/* subcategories: a menu of rails — dot, name, arrow; the dots light up one after another on hover */
.hp-cat-subs { position: relative; z-index: 1; margin: 12px 0 0; padding: 10px 0 0; list-style: none; border-top: 1px dashed color-mix(in srgb, var(--lane) 35%, #e6ebf2); }
.hp-cat-subs li + li { margin-top: 2px; }
.hp-cat-subs a { position: relative; display: grid; grid-template-columns: 22px 1fr 16px; align-items: center; gap: 8px; min-height: 30px; padding: 3px 8px 3px 6px; border-radius: 8px; color: var(--ink); font-size: 13px; font-weight: 600; text-decoration: none; overflow: hidden; isolation: isolate; transition: color .2s; }
.hp-cat-subs a::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 8px; background: linear-gradient(90deg, color-mix(in srgb, var(--lane) 18%, #fff), color-mix(in srgb, var(--lane) 6%, #fff) 70%, transparent); transform: translateX(-101%); transition: transform .3s cubic-bezier(.2,.8,.2,1); }
.hp-cat-subs a:hover::before, .hp-cat-subs a:focus-visible::before { transform: translateX(0); }
.hp-cat-subs a > i { position: relative; width: 22px; height: 22px; border-radius: 7px; background: color-mix(in srgb, var(--lane) 14%, #fff); transition: background .25s, transform .25s, box-shadow .25s; }
.hp-cat-subs a > i::before { content: ""; position: absolute; left: 50%; top: 50%; width: 6px; height: 6px; border-radius: 50%; background: var(--lane); transform: translate(-50%, -50%); transition: transform .25s, background .25s; }
.hp-cat:hover .hp-cat-subs a > i::before { animation: hp-sub-blink .9s ease-out both; }
.hp-cat-subs li:nth-child(1) a > i::before { animation-delay: 0s; } .hp-cat-subs li:nth-child(2) a > i::before { animation-delay: .08s; } .hp-cat-subs li:nth-child(3) a > i::before { animation-delay: .16s; } .hp-cat-subs li:nth-child(4) a > i::before { animation-delay: .24s; } .hp-cat-subs li:nth-child(5) a > i::before { animation-delay: .32s; } .hp-cat-subs li:nth-child(6) a > i::before { animation-delay: .4s; }
.hp-cat-subs a:hover > i { background: linear-gradient(135deg, var(--lane-l), var(--lane)); transform: scale(1.1) rotate(-6deg); box-shadow: 0 6px 12px -6px color-mix(in srgb, var(--lane) 90%, transparent); }
.hp-cat-subs a:hover > i::before { background: #fff; transform: translate(-50%, -50%) scale(1.15); }
.hp-cat-subs a > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: transform .25s; }
.hp-cat-subs a:hover { color: var(--lane-2); } .hp-cat-subs a:hover > span { transform: translateX(3px); }
.hp-cat-subs a > svg { width: 16px; height: 16px; fill: none; stroke: var(--lane-2); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; opacity: 0; transform: translateX(-6px); transition: opacity .25s, transform .25s; }
.hp-cat-subs a:hover > svg { opacity: 1; transform: translateX(0); }
.hp-cat-more a { color: var(--lane-2); font-weight: 800; }
.hp-cat-more a > i { display: flex; align-items: center; justify-content: center; width: auto; min-width: 22px; padding: 0 5px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); color: #06201f; font-style: normal; font-size: 11px; font-weight: 900; line-height: 22px; }
.hp-cat-more a > i::before { content: none; }
@keyframes hp-sub-blink { 0% { transform: translate(-50%, -50%) scale(1); box-shadow: 0 0 0 0 color-mix(in srgb, var(--lane) 50%, transparent); } 40% { transform: translate(-50%, -50%) scale(1.5); box-shadow: 0 0 0 6px transparent; } 100% { transform: translate(-50%, -50%) scale(1); } }
@media (prefers-reduced-motion: reduce) { .hp-cat:hover .hp-cat-subs a > i::before { animation: none; } .hp-cat::before, .hp-cat-mark, .hp-cat-subs a::before { transition: none; } }
.hp-cat-go { position: absolute; right: 16px; top: 22px; transform: translateY(0); width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 10px 22px -10px color-mix(in srgb, var(--lane) 90%, transparent), inset 0 1px 0 rgba(255,255,255,.6); overflow: hidden; transition: transform .3s cubic-bezier(.2,1.2,.3,1), box-shadow .3s; }
.hp-cat-go::before { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.6) 50%, transparent 70%); transform: translateX(-130%); }
.hp-cat-go::after { content: ""; position: absolute; inset: -3px; border-radius: 10px; border: 2px solid color-mix(in srgb, var(--lane) 60%, transparent); opacity: 0; }
.hp-cat-go svg { width: 20px; height: 20px; fill: none; stroke: #06131f; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s cubic-bezier(.2,1.2,.3,1); }
.hp-cat-go .hp-go-line { stroke-dasharray: 14; stroke-dashoffset: 8; transition: stroke-dashoffset .3s; }
.hp-cat:hover .hp-cat-go { transform: translateY(0) scale(1.08); box-shadow: 0 14px 28px -10px color-mix(in srgb, var(--lane) 100%, transparent), 0 0 0 5px color-mix(in srgb, var(--lane) 16%, transparent); }
.hp-cat:hover .hp-cat-go::before { animation: hp-shine .7s ease-out; }
.hp-cat:hover .hp-cat-go::after { animation: hp-ring .8s ease-out; }
.hp-cat:hover .hp-cat-go svg { transform: translateX(3px); }
.hp-cat:hover .hp-cat-go .hp-go-line { stroke-dashoffset: 0; }
.hp-latest .cards { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 22px; margin: 0; }
.hp-latest .card { --fg: var(--ink); }
.hp-empty { display: grid; justify-items: center; text-align: center; gap: 8px; padding: 40px 24px; border-radius: 10px; background: #fff; border: 1px dashed rgba(91,217,230,.6); }
.hp-empty i { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 10px; background: linear-gradient(135deg, #9beef5, #5bd9e6); box-shadow: 0 12px 24px -10px rgba(91,217,230,.9); margin-bottom: 6px; }
.hp-empty i svg { width: 30px; height: 30px; fill: none; stroke: #06201f; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hp-empty b { font-size: 18px; color: var(--ink); }
.hp-empty span { color: var(--mute); }
.hp-empty .hp-btn { margin-top: 10px; }
.hp-two { display: grid; gap: 22px; }
.hp-panel { position: relative; overflow: hidden; background: linear-gradient(165deg, color-mix(in srgb, var(--lane) 14%, #fff), #fff 60%); border: 1px solid color-mix(in srgb, var(--lane) 24%, #e6ebf2); border-radius: 10px; padding: 28px; box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 30px 60px -40px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.4)); }
.hp-panel::before { content: ""; position: absolute; right: -80px; top: -80px; width: 260px; height: 260px; border-radius: 10px; background: radial-gradient(circle, color-mix(in srgb, var(--lane) 22%, transparent), transparent 65%); pointer-events: none; }
.hp-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.hp-panel-ill { width: 120px; height: 96px; flex: none; margin: -10px -6px 0 0; filter: drop-shadow(0 12px 14px rgba(15,26,42,.14)); animation: hp-float 6s ease-in-out infinite; }
.hp-lane-us .hp-panel-ill { animation-delay: -3s; }
.hp-panel h2 { font-size: clamp(24px, 2.3vw, 31px); margin: 10px 0 18px; }
.hp-benefits { list-style: none; padding: 0; margin: 0 0 24px; display: grid; gap: 10px; }
.hp-benefits li { display: grid; grid-template-columns: 40px 1fr; column-gap: 12px; align-items: center; padding: 10px 12px 10px 10px; border-radius: 10px; background: rgba(255,255,255,.75); border: 1px solid color-mix(in srgb, var(--lane) 16%, #e6ebf2); transition: translate .2s, box-shadow .3s, border-color .3s; }
.hp-benefits li:hover { translate: 0 -3px; border-color: var(--lane); box-shadow: 0 16px 30px -22px color-mix(in srgb, var(--lane) 70%, rgba(15,26,42,.3)); }
.hp-benefits li i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 8px 16px -8px color-mix(in srgb, var(--lane) 85%, transparent); }
.hp-benefits li svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.hp-benefits b { font-size: 14.5px; color: var(--ink); }
.hp-benefits span { font-size: 12.5px; color: var(--mute); }
.hp-panel .hp-btn { position: relative; z-index: 1; }
.hp-lane-us.hp-panel .hp-btn-ghost { border-color: color-mix(in srgb, var(--lane) 45%, transparent); color: var(--lane-2); }
.hp-lane-us.hp-panel .hp-btn-ghost:hover { border-color: var(--lane); }
.hp-two-uneven { grid-template-columns: 1fr; }
.hp-faq-col h2 { margin-bottom: 18px; }
.hp-faq { border: 1px solid rgba(15,26,42,.08); border-radius: 10px; padding: 0 18px; margin: 0 0 10px; background: #fff; box-shadow: 0 1px 2px rgba(15,26,42,.04); transition: border-color .3s, box-shadow .3s, translate .2s; }
.hp-faq:hover { translate: 0 -2px; border-color: color-mix(in srgb, var(--lane) 45%, #e6ebf2); }
.hp-faq[open] { border-color: var(--lane); box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 20px 40px -30px color-mix(in srgb, var(--lane) 70%, rgba(15,26,42,.35)), 0 0 0 4px color-mix(in srgb, var(--lane) 12%, transparent); }
.hp-faq summary { display: grid; grid-template-columns: 38px 1fr 30px; column-gap: 12px; align-items: center; cursor: pointer; font-weight: 800; font-size: 15.5px; padding: 12px 0; list-style: none; color: var(--ink); }
.hp-faq summary::-webkit-details-marker { display: none; }
.hp-faq-ic { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 10px; background: color-mix(in srgb, var(--lane) 14%, #fff); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lane) 30%, transparent); transition: background .3s, box-shadow .3s; }
.hp-faq-ic svg { width: 19px; height: 19px; fill: none; stroke: var(--lane-2); stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; transition: stroke .3s; }
.hp-faq[open] .hp-faq-ic { background: linear-gradient(135deg, var(--lane-l), var(--lane)); box-shadow: 0 8px 16px -8px color-mix(in srgb, var(--lane) 85%, transparent); }
.hp-faq[open] .hp-faq-ic svg { stroke: #fff; }
.hp-faq summary::after { content: ""; grid-column: 3; width: 30px; height: 30px; border-radius: 10px; background: rgba(15,26,42,.05) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f1a2a' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center / 14px no-repeat; transition: transform .35s cubic-bezier(.2,1.2,.3,1), background-color .3s; }
.hp-faq[open] summary::after { transform: rotate(135deg); background-color: color-mix(in srgb, var(--lane) 18%, transparent); }
.hp-faq-body { padding: 0 0 16px 50px; }
.hp-faq[open] .hp-faq-body { animation: hp-rise .35s ease-out; }
.hp-faq p { color: var(--mute); margin: 0; line-height: 1.6; }
.hp-faq-more { display: grid; grid-template-columns: 44px 1fr auto; column-gap: 14px; align-items: center; margin-top: 16px; padding: 14px 18px 14px 14px; border-radius: 10px; color: var(--ink); text-decoration: none; background: linear-gradient(135deg, rgba(91,217,230,.16), rgba(124,108,255,.14)); border: 1px solid rgba(91,217,230,.35); transition: translate .2s, box-shadow .3s; }
.hp-faq-more:hover { translate: 0 -3px; box-shadow: 0 20px 40px -28px rgba(24,175,255,.6); text-decoration: none; }
.hp-faq-more i { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; background: linear-gradient(135deg, #5bd9e6, #18afff); box-shadow: 0 8px 16px -8px rgba(24,175,255,.9); }
.hp-faq-more i svg { width: 22px; height: 22px; fill: none; stroke: #fff; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
.hp-faq-more b { display: block; font-size: 15px; }
.hp-faq-more span { font-size: 13px; color: var(--mute); }
.hp-faq-more em { font-style: normal; font-weight: 900; font-size: 20px; color: var(--teal-2); transition: transform .2s; }
.hp-faq-more:hover em { transform: translateX(4px); }
.hp-sold { position: relative; overflow: hidden; background: linear-gradient(165deg, color-mix(in srgb, var(--lane) 12%, #fff), #fff 60%); border: 1px solid color-mix(in srgb, var(--lane) 24%, #e6ebf2); border-radius: 10px; padding: 26px; align-self: start; box-shadow: 0 1px 2px rgba(15,26,42,.04), 0 30px 60px -40px color-mix(in srgb, var(--lane) 60%, rgba(15,26,42,.4)); }
.hp-sold::before { content: ""; position: absolute; right: -70px; top: -70px; width: 220px; height: 220px; border-radius: 10px; background: radial-gradient(circle, color-mix(in srgb, var(--lane) 22%, transparent), transparent 65%); pointer-events: none; }
.hp-sold h2 { margin-bottom: 14px; }
.hp-sold-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.hp-sold-list li { display: grid; grid-template-columns: 26px 1fr auto; column-gap: 10px; align-items: center; padding: 10px 12px; border-radius: 10px; background: rgba(255,255,255,.8); border: 1px solid color-mix(in srgb, var(--lane) 16%, #e6ebf2); }
.hp-sold-list li i { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.hp-sold-list li i svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.hp-sold-list a { color: var(--ink); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hp-sold-list span { font-weight: 900; color: var(--lane-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.hp-sold-empty { display: grid; grid-template-columns: 48px 1fr; column-gap: 12px; align-items: center; padding: 14px; border-radius: 10px; background: rgba(255,255,255,.8); border: 1px dashed color-mix(in srgb, var(--lane) 45%, transparent); }
.hp-sold-empty i { grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 10px; background: linear-gradient(135deg, var(--lane-l), var(--lane)); }
.hp-sold-empty i svg { width: 24px; height: 24px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hp-sold-empty b { font-size: 14.5px; color: var(--ink); }
.hp-sold-empty span { font-size: 12.5px; color: var(--mute); }
.hp-sold-foot { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
.hp-sold-foot span { display: block; padding: 12px; border-radius: 10px; background: rgba(255,255,255,.8); border: 1px solid color-mix(in srgb, var(--lane) 16%, #e6ebf2); font-size: 12px; color: var(--mute); text-align: center; }
.hp-sold-foot b { display: block; font-size: 22px; font-weight: 900; color: var(--lane-2); letter-spacing: -.02em; }
@media (min-width: 900px) {
  .hp-hero { padding: 80px 0 0; }
  .hp-hero-grid { grid-template-columns: 1.2fr .8fr; gap: 56px; }
  .hp-start { padding: 28px; }
  .hp-trust { grid-template-columns: auto 1fr; align-items: center; margin-top: 48px; gap: 28px; }
  .hp-row { grid-template-columns: 1.3fr 1fr auto; }
  .hp-chips { grid-template-columns: repeat(3, 1fr); gap: 12px; }
  .hp-chips li { grid-template-columns: 1fr; row-gap: 2px; padding: 14px; }
  .hp-chips svg { grid-row: auto; margin-bottom: 8px; }
  .hp-uses-v { padding: 24px 26px 16px; }
  .hp-uses-v .hp-uses-track { height: 400px; }
  .hp-stats { gap: 12px; }
  .hp-stats li { min-width: 170px; }
  .hp-badges { grid-template-columns: repeat(3, auto); justify-content: end; }
  .hp-two { grid-template-columns: 1fr 1fr; gap: 28px; }
  .hp-panel { padding: 34px; }
  .hp-benefits { grid-template-columns: 1fr 1fr; gap: 12px; }
  .hp-panel-ill { width: 150px; height: 120px; margin-top: -16px; }
  .hp-two-uneven { grid-template-columns: 1.35fr 1fr; }
  .hp-section { padding: 96px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-orb, .hp-pulse { animation: none; }
  .hp-console, .hp-chips li, .hp-btn-shine::after, .hp-trust::after, .hp-badges b::before { animation: none !important; }
  .hp-map-flow, .hp-map-node, .hp-map-tag { animation: none !important; }
  .hp-map-mover { display: none; }
  .hp-map-node, .hp-map-tag, .hp-map-svg { transition: none !important; opacity: 1 !important; transform: translate(-50%, -50%) !important; }
  .hp-map-steps li { opacity: 1 !important; transform: none !important; transition: none !important; }
  .hp-map-svg { transform: none !important; }
  .hp-seg-pill, .hp-btn-shine span { transition: none; }
  .hp-uses-track { scroll-behavior: auto; }
  .js .hp-deck .hp-use, .js .hp-deck .hp-use *, .js .hp-deck .hp-use *::before, .js .hp-deck .hp-use *::after, .js .hp-deck .hp-uses-dots i::after { animation: none !important; transition: none !important; }
  .js .hp-deck .hp-use-copy > *, .js .hp-deck .hp-flow li i::after { opacity: 1; }
  .js .hp-deck .hp-use-icon * { stroke-dashoffset: 0; }
  .js .hp-deck .hp-flow li i { color: #06201f; }
  .js .hp-deck .hp-flow li span { color: #fff; }
  .js .hp-deck .hp-flow li + li::before { transform: none; }
}
/* Pagina tranzacției pe telefon: butoanele de acțiune cu text lung se rup pe două rânduri, nu lărgesc pagina */
@media (max-width: 599px) { .tx-grid > *, .tx-col, .tx-act { min-width: 0; } main .tx-act .hp-btn, main .tx-danger .hp-btn { white-space: normal !important; text-align: left; line-height: 1.3; height: auto; padding-top: 10px; padding-bottom: 10px; } main .tx-hero .hp-eyebrow-fancy { white-space: normal !important; } }
/* tranzacție: conturile EUR/USD ca alternativă la plată (2026-09-24) */
.tx-bank-alt { margin-top: 10px; border: 1px dashed rgba(24,175,255,.45); border-radius: 8px; background: #f6fbff; }
.tx-bank-alt > summary { padding: 9px 12px; cursor: pointer; font-size: 13px; font-weight: 800; color: #1b5aa3; list-style: none; display: flex; align-items: center; gap: 8px; }
.tx-bank-alt > summary::before { content: ""; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 6px solid currentColor; transition: rotate .15s; }
.tx-bank-alt[open] > summary::before { rotate: 90deg; }
.tx-bank-alt > summary::-webkit-details-marker { display: none; }
.tx-bank-alt dl { margin: 0; padding: 0 12px; } .tx-bank-alt dl > div { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-top: 1px dashed rgba(15,26,42,.12); font-size: 13px; }
.tx-bank-alt dt { color: #5b6878; } .tx-bank-alt dd { margin: 0; } .tx-bank-alt code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px; font-weight: 700; color: #0f1a2a !important; background: transparent !important; }
.tx-bank-alt .au-fine { margin: 6px 12px 10px; }

/* Preț + monedă în formularul de anunț: câmpul cu sufixul monedei alese (din CSS, fără JS) și trei plăcuțe radio RON / EUR / USD */
.lf-price-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: start; }
.lf-unit::after { content: "lei"; }
.lf-stage:has(input[name="currency"][value="EUR"]:checked) .lf-unit::after { content: "€"; }
.lf-stage:has(input[name="currency"][value="USD"]:checked) .lf-unit::after { content: "$"; }

.ld-close-form { margin-top: 12px; padding-top: 12px; border-top: 1px dashed rgba(15,26,42,.12); }
.lf-cur { display: flex; gap: 6px; }
.lf-cur-opt { position: relative; cursor: pointer; }
.lf-cur-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.lf-cur-opt span { display: grid; justify-items: center; min-width: 58px; padding: 7px 10px; border-radius: 10px; border: 2px solid rgba(15,26,42,.1); background: #fff; line-height: 1.1; transition: border-color .2s, background .2s, transform .2s, box-shadow .2s; }
.lf-cur-opt b { font-size: 13px; font-weight: 800; letter-spacing: .02em; } .lf-cur-opt small { font-size: 11px; color: var(--mute); }
.lf-cur-opt:hover span { border-color: rgba(91,217,230,.6); }
.lf-cur-opt input:checked + span { border-color: transparent; background: linear-gradient(135deg, var(--lane-l, #9beef5), var(--lane, #5bd9e6)); color: #06201f; box-shadow: 0 10px 20px -12px rgba(24,175,255,.9); transform: translateY(-1px); }
.lf-cur-opt input:checked + span small { color: rgba(6,32,31,.75); }
.lf-cur-opt input:focus-visible + span { outline: 3px solid rgba(24,175,255,.45); outline-offset: 2px; }
.lf-cur-EUR input:checked + span { background: linear-gradient(135deg, #9dd0ff, #18afff); } .lf-cur-USD input:checked + span { background: linear-gradient(135deg, #c4b8ff, #7c6cff); color: #fff; } .lf-cur-USD input:checked + span small { color: rgba(255,255,255,.85); }
.lf-cur-hint { margin: 6px 0 0; font-size: 12px; color: var(--mute); }
@media (max-width: 520px) { .lf-price-row { grid-template-columns: 1fr; } .lf-cur { justify-content: flex-start; } }

/* Bannerul automat al anunțurilor de domenii (fără poze încărcate): stă în galerie ca o singură imagine 1200×630 */
.ld-stage-banner { position: relative; display: block; padding: 0; overflow: hidden; border-radius: 10px; aspect-ratio: 1200 / 630; }
.ld-stage-banner img { display: block; width: 100%; height: auto; }
.ld-stage-banner .ld-badge { position: absolute; left: 14px; top: 14px; }

/* ===== Licitații ===== */
/* formular: „Preț fix / Licitație” ca plăci; câmpurile licitației apar doar la licitație (CSS, fără JS) */
.lf-tiles-mode { grid-template-columns: 1fr 1fr; }
.lf-lbl-auction { display: none; } .lf-stage:has(input[name="sale_mode"][value="auction"]:checked) .lf-lbl-fixed { display: none; } .lf-stage:has(input[name="sale_mode"][value="auction"]:checked) .lf-lbl-auction { display: inline; }
@media (max-width: 760px) { .lf-tiles-mode { grid-template-columns: 1fr; } }

/* ---- Auction block in the listing form: a card with a gavel header, four
   facts and three coloured tiles (closing time, reserve, buy now). ---- */
.lf-auction { --ac: #f59e0b; --ac-2: #b45309; display: none; position: relative; overflow: hidden; margin-top: 4px; padding: 18px 18px 16px; border-radius: 10px; border: 1px solid rgba(245,158,11,.35); background: linear-gradient(#fffdf8, #fffdf8) padding-box, linear-gradient(135deg, rgba(245,158,11,.55), rgba(91,217,230,.5), rgba(124,108,255,.5)) border-box; border: 1px solid transparent; box-shadow: 0 18px 40px -30px rgba(180,83,9,.45); }
.lf-auction::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(420px 220px at 100% 0%, rgba(245,158,11,.14), transparent 60%), radial-gradient(360px 200px at 0% 100%, rgba(91,217,230,.14), transparent 60%); }
.lf-auction > * { position: relative; }
.lf-stage:has(input[name="sale_mode"][value="auction"]:checked) .lf-auction { display: block; animation: lf-auc-in .35s ease both; }
@keyframes lf-auc-in { from { opacity: 0; transform: translateY(6px); } }
.lf-auc-head { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; }
.lf-auc-ico { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; background: linear-gradient(135deg, #fbbf24, #f59e0b 60%, #d97706); box-shadow: 0 10px 24px -12px rgba(180,83,9,.7); }
.lf-auc-ico svg { width: 24px; height: 24px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; animation: lf-gavel 3.2s ease-in-out infinite; transform-origin: 40% 60%; }
@keyframes lf-gavel { 0%, 70%, 100% { transform: rotate(0); } 78% { transform: rotate(-16deg); } 86% { transform: rotate(6deg); } 92% { transform: rotate(-3deg); } }
.lf-auc-ht b { display: block; font-size: 17px; font-weight: 900; letter-spacing: -.01em; color: var(--fg); }
.lf-auc-ht small { display: block; font-size: 12.5px; color: var(--mute); }
.lf-auc-facts { list-style: none; margin: 0 0 14px; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.lf-auc-facts li { display: grid; grid-template-columns: 30px 1fr; column-gap: 9px; align-items: center; padding: 8px 10px; border-radius: 8px; background: rgba(255,255,255,.85); border: 1px solid rgba(15,26,42,.08); font-size: 12.5px; font-weight: 600; line-height: 1.3; color: var(--fg); }
.lf-auc-facts li i { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, rgba(91,217,230,.35), rgba(24,175,255,.25)); color: #0c7a79; }
.lf-auc-facts li:nth-child(2) i { background: linear-gradient(135deg, rgba(251,191,36,.4), rgba(245,158,11,.25)); color: #b45309; }
.lf-auc-facts li:nth-child(3) i { background: linear-gradient(135deg, rgba(74,222,128,.35), rgba(16,185,129,.25)); color: #047857; }
.lf-auc-facts li:nth-child(4) i { background: linear-gradient(135deg, rgba(196,184,255,.55), rgba(124,108,255,.3)); color: #4b3fd6; }
.lf-auc-facts li i svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lf-auc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.lf-auc-tile { --tc: #18afff; --tc-2: #1b5aa3; --tc-l: #9dd0ff; --lane-2: var(--tc-2); position: relative; margin: 0; padding: 14px 14px 12px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.1); box-shadow: 0 1px 2px rgba(15,26,42,.04); transition: border-color .2s, box-shadow .2s, transform .2s; }
.lf-auc-tile::before { content: ""; position: absolute; left: 12px; right: 12px; top: -1px; height: 3px; border-radius: 0 0 3px 3px; background: linear-gradient(90deg, var(--tc), var(--tc-l)); opacity: .9; }
.lf-auc-tile:focus-within { border-color: var(--tc); box-shadow: 0 0 0 3px color-mix(in srgb, var(--tc) 22%, transparent), 0 14px 30px -18px color-mix(in srgb, var(--tc) 60%, transparent); transform: translateY(-1px); }
.lf-auc-t-lock { --tc: #7c6cff; --tc-2: #4b3fd6; --tc-l: #c4b8ff; }
.lf-auc-t-bolt { --tc: #f59e0b; --tc-2: #b45309; --tc-l: #fcd34d; }
.lf-auc-tt { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; }
.lf-auc-tt i { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 9px; background: linear-gradient(135deg, var(--tc), var(--tc-l)); box-shadow: 0 8px 18px -10px var(--tc); }
.lf-auc-tt i svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 1px 1px rgba(0,0,0,.15)); }
main.inner .lf-auc-tile .lf-auc-tt label { display: block; margin: 0; font-size: 14px; font-weight: 900; letter-spacing: 0; text-transform: none; color: var(--fg); }
.lf-auc-tt small { display: block; font-size: 11.5px; font-weight: 600; color: var(--mute); }
main.inner .lf-auction input[type="datetime-local"] { font: inherit; font-size: 14px; padding-left: 40px; padding-right: 8px; }
main.inner .lf-auc-tile .ky-ctl input::placeholder { font-weight: 500; color: #8a94a3; }
main.inner .lf-auc-tile .ky-ctl input:focus { border-color: var(--tc); box-shadow: 0 0 0 3px color-mix(in srgb, var(--tc) 25%, transparent); }
.lf-auc-hint { display: flex; align-items: flex-start; gap: 6px; margin: 8px 0 0; font-size: 12px; line-height: 1.4; color: var(--mute); }
.lf-auc-hint svg { flex: none; width: 14px; height: 14px; margin-top: 2px; fill: none; stroke: var(--tc-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* "no deadline" switch */
main.inner .lf-auc-tile label.lf-auc-switch { position: relative; display: grid; grid-template-columns: 40px 1fr; column-gap: 10px; align-items: start; margin: 10px 0 0; padding: 9px 10px; border-radius: 8px; border: 1px solid rgba(15,26,42,.1); background: #f7f9fc; cursor: pointer; text-transform: none; letter-spacing: 0; font-weight: 600; color: var(--fg); transition: background .2s, border-color .2s; }
.lf-auc-switch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.lf-auc-knob { position: relative; width: 40px; height: 22px; margin-top: 1px; border-radius: 8px; background: #cfd6e0; transition: background .2s; }
.lf-auc-knob::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 6px; background: #fff; box-shadow: 0 1px 3px rgba(15,26,42,.3); transition: transform .2s; }
.lf-auc-swt b { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 800; }
.lf-auc-swt b svg { width: 16px; height: 16px; fill: none; stroke: var(--tc-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.lf-auc-swt small { display: block; font-size: 11.5px; font-weight: 500; line-height: 1.35; color: var(--mute); }
.lf-auc-switch:has(input:focus-visible) { outline: 2px solid var(--tc); outline-offset: 2px; }
.lf-auc-tile:has(input[name="open_ended"]:checked) label.lf-auc-switch { background: linear-gradient(135deg, rgba(91,217,230,.18), rgba(24,175,255,.12)); border-color: rgba(24,175,255,.5); }
.lf-auc-tile:has(input[name="open_ended"]:checked) .lf-auc-knob { background: linear-gradient(90deg, #5bd9e6, #18afff); }
.lf-auc-tile:has(input[name="open_ended"]:checked) .lf-auc-knob::after { transform: translateX(18px); }
.lf-auc-tile:has(input[name="open_ended"]:checked) .ky-ctl { display: none; }
.lf-auc-tile:has(input[name="open_ended"]:checked) .lf-auc-tt small { visibility: hidden; }
.lf-hint-open { display: none; }
.lf-auc-tile:has(input[name="open_ended"]:checked) .lf-hint-open { display: flex; }
.lf-auc-tile:has(input[name="open_ended"]:checked) .lf-hint-dated { display: none; }
@media (max-width: 960px) { .lf-auc-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lf-auc-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .lf-auc-facts { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .lf-auc-ico svg { animation: none; } .lf-stage:has(input[name="sale_mode"][value="auction"]:checked) .lf-auction { animation: none; } }
.lf-st-unsold { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
/* carduri */
.card-tag-auction { display: inline-flex; align-items: center; gap: 4px; color: #92400e; background: linear-gradient(135deg, #ffe4bf, #ffd699); }
.card-tag-auction svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.card-clock { display: inline-flex !important; align-items: center; gap: 4px; color: #92400e !important; font-weight: 700; }
.card-clock svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }
.ml-filters a.ml-f-unsold, .ml-card.ac-st-unsold { --lane: #ffb547; --lane-2: #92400e; --lane-l: #ffd699; }
/* pagina anunțului: panoul de licitare */
.ld-auction-label { display: flex; align-items: center; gap: 6px; padding-top: 18px; color: #92400e !important; }
.ld-auction-label svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-auction-label b.is-ok { color: #15803d; } .ld-auction-label b.is-warn { color: #b45309; }
.ld-clock { display: grid; grid-template-columns: 22px 1fr; gap: 2px 10px; align-items: center; margin: 4px 0 14px; padding: 10px 12px; border-radius: 10px; background: linear-gradient(135deg, rgba(255,181,71,.16), rgba(255,181,71,.05)); border: 1px solid rgba(180,83,9,.25); color: #92400e; }
.ld-clock svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; grid-row: 1 / 3; }
.ld-clock span { font-size: 14px; } .ld-clock span b { font-size: 18px; font-weight: 900; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.ld-clock small { font-size: 11.5px; color: #a16207; }
.ld-clock.is-closed { background: rgba(15,26,42,.05); border-color: rgba(15,26,42,.1); color: var(--mute); }
.ld-mystate { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; padding: 8px 10px; border-radius: 8px; font-size: 13px; font-weight: 700; }
.ld-mystate svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ld-mystate.is-lead { background: #e6f7ec; color: #15803d; } .ld-mystate.is-outbid { background: #fdecec; color: #b91c1c; }
.ld-bid-form label { display: block; margin: 6px 0 6px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--mute); }
.ld-bid-form .ky-ctl { margin-bottom: 10px; } .ld-bid-form .ky-ctl input { padding-right: 52px; }
.ld-buynow { margin-top: 10px; padding-top: 10px; border-top: 1px dashed rgba(15,26,42,.12); }
.ld-bids { margin-top: 16px; }
.ld-bids ol { margin: 8px 0 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.ld-bids li { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 7px 10px; border-radius: 8px; background: #f7f9fc; font-size: 13px; }
.ld-bids li span { font-family: var(--mono, ui-monospace, monospace); color: var(--mute); } .ld-bids li span em { font-style: normal; color: #0c7a79; font-weight: 800; }
.ld-bids li b { font-variant-numeric: tabular-nums; } .ld-bids li small { grid-column: 1 / -1; font-size: 11px; color: var(--mute); }
.ld-bids li.is-mine { background: rgba(91,217,230,.14); }
/* Ofertele mele */
.ab-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.ab-row { display: grid; grid-template-columns: 160px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 14px; border-radius: 10px; background: #fff; border: 1px solid rgba(15,26,42,.08); border-left: 5px solid var(--lane, #5bd9e6); box-shadow: 0 1px 2px rgba(15,26,42,.04); }
.ab-lead { --lane: #15803d; } .ab-outbid { --lane: #ef4444; } .ab-won { --lane: #7c6cff; } .ab-lost, .ab-closed { --lane: #9fb0c4; } .ab-unsold { --lane: #ffb547; }
.ab-media { display: block; border-radius: 8px; overflow: hidden; aspect-ratio: 4 / 3; background: #f0f4f9; } .ab-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ab-media .card-ill { display: flex; align-items: center; justify-content: center; height: 100%; }
.ab-title { display: block; font-weight: 800; font-size: 16px; color: var(--fg); text-decoration: none; }
.ab-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 6px 0 0; font-size: 12.5px; color: var(--mute); }
.ab-meta b { color: var(--fg); font-variant-numeric: tabular-nums; }
.ab-state { font-style: normal; font-weight: 800; color: var(--lane); text-transform: uppercase; letter-spacing: .04em; font-size: 11.5px; }
@media (max-width: 700px) { .ab-row { grid-template-columns: 1fr; } .ab-media { max-width: 200px; } }