/* Burstlikes v10: product page, final Stormlikes-style pass. Loaded last. */

/* hero */
.pp-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.pp-tags li { background: rgba(255, 255, 255, .92); color: var(--bx-ink); border-radius: 10px; padding: 8px 12px; font: 800 .74rem/1 var(--bx-body); letter-spacing: .05em; text-transform: uppercase; }
.pp-hero__btns { display: flex; flex-wrap: wrap; gap: 10px; }
.pp-marq { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; }
.pp-marq li { display: inline-flex; align-items: center; gap: 8px; font: 800 .86rem/1 var(--bx-body); color: var(--bx-ink); }
.pp-marq i { width: 26px; height: 26px; border-radius: 50%; background: rgba(255, 255, 255, .35); display: grid; place-items: center; font-size: .8rem; }
html body .pp-hero h1 { font-size: clamp(2.4rem, 4.6vw, 4.4rem) !important; max-width: 13ch; }
.pp-hero__txt { gap: 16px; }

/* order fields inside the dark card */
.pp-fields { display: grid; grid-template-columns: 220px 1fr; gap: 10px; margin-top: 18px; }
.pp-fields:has(.pp-field--grow:only-child) { grid-template-columns: 1fr; }
.pp-field { display: grid; gap: 7px; position: relative; }
.pp-field > span { font: 800 .68rem/1 var(--bx-body); letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .7); }
.pp-field input, .pp-field select { width: 100%; height: 54px; border: 2px solid transparent; border-radius: 16px; background: rgba(255, 255, 255, .09); color: #fff; padding: 0 16px; font: 600 1rem/1 var(--bx-body); outline: 0; appearance: none; -webkit-appearance: none; }
.pp-field select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; padding-right: 40px; }
.pp-field select option { color: var(--bx-ink); }
.pp-field input::placeholder { color: rgba(255, 255, 255, .45); }
.pp-field input:focus, .pp-field select:focus { border-color: var(--bx-orange); background: rgba(255, 255, 255, .14); }
.pp-field.is-err input { border-color: #ff4d4d; }
.pp-buy { border-top: 0; margin-top: 18px; padding-top: 6px; }
.pp-eur { font-size: .78rem !important; }
.pp-buy .bx-btn { height: 58px; padding: 0 34px; }

/* more services */
.pp-more__box { background: var(--bx-orange); border-radius: 56px; padding: 56px 48px; }
html body .pp-more h2 { font-size: clamp(2.4rem, 4.8vw, 4.4rem) !important; margin: 0 0 12px; max-width: 16ch; line-height: .95; }
.pp-more p { font: 600 1.1rem/1.5 var(--bx-body); color: var(--bx-ink); max-width: 52ch; margin: 0 0 26px; }
.pp-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.pp-chips a { display: inline-flex; align-items: center; gap: 10px; background: var(--bx-ink); color: #fff !important; text-decoration: none !important; border-radius: 999px; padding: 11px 18px 11px 14px; font: 800 .86rem/1 var(--bx-body); transition: background .15s, transform .15s; }
.pp-chips a i { font-size: 1rem; color: var(--bx-yellow); }
.pp-chips a em { font-style: normal; font-weight: 700; opacity: .65; font-size: .8rem; }
.pp-chips a:hover { background: #2b1a3f; transform: translateY(-2px); }
.pp-chips a.is-on { background: #fff; color: var(--bx-ink) !important; }
.pp-chips a.is-on i { color: var(--bx-orange); }

/* SEO text blocks of the product: same flat soft look */
html body .core-resources { margin-top: 0 !important; }
.pp-legacy { display: none !important; }

@media (max-width: 991.98px) {
  .pp-fields { grid-template-columns: 1fr; }
  .pp-more__box { padding: 34px 24px; border-radius: 36px; }
  html body .pp-hero h1 { max-width: none; }
}
html body div#core-resource-content .mlx-table th { border-bottom-color: var(--bx-ink); }
html body div#core-resource-content .mlx-card { background: var(--bx-lav); border-radius: 40px; }
html body div#core-resource-content .mlx-case { background: #fff; }
html body div#core-resource-content .mlx-faq summary::after { background: var(--bx-ink); color: #fff; border: 0; }
@media (max-width: 991.98px) {
  .pp-tags, .pp-hero__btns, .pp-marq { justify-content: center; }
}

/* ===== v14: closer match to the reference ===== */
.pp-tags li { background: var(--bx-ink); color: #fff; display: inline-flex; align-items: center; gap: 8px; border-radius: 12px; padding: 10px 14px; font: 800 .8rem/1 var(--bx-body); letter-spacing: .02em; text-transform: none; }
.pp-tags li i { font-size: .95rem; }
.pp-stats { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 14px 34px; }
.pp-stats strong { display: block; font: 400 2.1rem/1 var(--bx-display); color: var(--bx-ink); }
.pp-stats span { font: 700 .82rem/1.2 var(--bx-body); color: var(--bx-ink); }
.bx-btn--ghost { background: rgba(20, 8, 31, .12) !important; color: var(--bx-ink) !important; box-shadow: inset 0 0 0 2px rgba(20, 8, 31, .25) !important; border: 0 !important; }
.bx-btn--ghost:hover { background: var(--bx-ink) !important; color: #fff !important; }
.sx-hero .bx-btn--ghost { color: #fff !important; background: rgba(255, 255, 255, .22) !important; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .5) !important; }
.sx-hero .bx-btn--ghost:hover { background: #fff !important; color: var(--bx-ink) !important; }

/* includes: outline icons, no boxes */
.pp-incl li { background: rgba(255, 255, 255, .07); }
.pp-incl li i { width: auto; height: auto; background: transparent; color: var(--bx-orange); font-size: 1.35rem; border-radius: 0; }

/* tiles: smaller, three per row, "show all" */
.pp-tiles { grid-template-columns: repeat(3, 1fr); gap: 8px; }
.pp-tile { height: 80px; border-radius: 16px; padding: 12px 14px; }
.pp-tile b { font: 800 1.35rem/1 var(--bx-body); }
.pp-tile--more { display: none; }
.pp-tiles.is-all .pp-tile--more { display: flex; }
.pp-tiles.is-all .pp-tile--all { display: none; }
.pp-tile--all { grid-column: span 2; justify-content: center; align-items: center; }
.pp-tile--all span { font: 800 1.1rem/1 var(--bx-body); }
.pp-tile__tag { background: var(--bx-orange); color: var(--bx-ink); border-radius: 6px; top: -8px; left: 6px; }
.pp-tile__tag--a { left: 6px; right: auto; background: var(--bx-yellow); transform: rotate(-4deg); }
.pp-tile.is-on:has(.pp-tile__tag--a) .pp-tile__tag { }

/* accordions */
.pp-acc { margin-top: 10px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 16px; }
.pp-acc summary { list-style: none; cursor: pointer; padding: 18px 20px; font: 800 1.15rem/1.2 var(--bx-body); display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.pp-acc summary::-webkit-details-marker { display: none; }
.pp-acc summary::after { content: '\f282'; font-family: 'bootstrap-icons'; font-size: 1rem; transition: transform .2s; }
.pp-acc[open] summary::after { transform: rotate(180deg); }
.pp-acc p { margin: 0; padding: 0 20px 18px; font: 500 .96rem/1.55 var(--bx-body); color: rgba(255, 255, 255, .78); }
.pp-fields { margin-top: 16px; }
.pp-buy__price b { font: 800 3.4rem/1 var(--bx-body); letter-spacing: -.03em; }
@media (max-width: 560px) { .pp-tiles { grid-template-columns: 1fr 1fr; } .pp-tile--all { grid-column: span 2; } }

/* ===== v15: product body (single product-specific flow) ===== */
.pp-facts { padding: 16px 0 0; }
.pp-facts__list dd strong { font-size: 1.35rem; }
.pp-why { display: grid; grid-template-columns: .85fr 1.15fr; gap: 40px; align-items: center; }
.pp-why__art img { width: 100%; height: auto; display: block; background: var(--bx-orange); border-radius: 44px; }
html body .pp-why h2 { font-size: clamp(2.2rem, 4.2vw, 3.8rem) !important; margin: 0 0 18px; line-height: .98; max-width: 14ch; }
.pp-why p { font: 500 1.05rem/1.65 var(--bx-body); color: var(--bx-ink-2); margin: 0 0 14px; }
.pp-cases { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 36px; }
.pp-cases article { background: var(--bx-lav); border-radius: 32px; padding: 24px; }
.pp-cases__ic { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; font-size: 1.4rem; color: var(--bx-ink); margin-bottom: 14px; }
.pp-cases__ic--0 { background: var(--bx-lime); } .pp-cases__ic--1 { background: var(--bx-yellow); } .pp-cases__ic--2 { background: var(--bx-pink); } .pp-cases__ic--3 { background: var(--bx-blue); color: #fff; }
html body .pp-cases h3 { font-size: 1.4rem !important; margin: 0 0 8px; }
.pp-cases p { margin: 0; font: 500 .95rem/1.55 var(--bx-body); color: var(--bx-ink-2); }
.pp-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.pp-soft { background: var(--bx-lav); border-radius: 40px; padding: 36px 40px; }
.pp-soft--y { background: var(--bx-yellow); }
html body .pp-soft h2 { font-size: clamp(1.9rem, 3vw, 2.6rem) !important; margin: 0 0 14px; line-height: 1; }
html body .pp-soft h3 { font-size: 1.5rem !important; margin: 26px 0 8px; }
.pp-soft p, .pp-soft li { font: 500 1rem/1.6 var(--bx-body); color: var(--bx-ink); margin: 0 0 12px; }
.pp-soft ul { margin: 0; padding-left: 1.1rem; }
.pp-soft__small { font-size: .88rem !important; color: var(--bx-ink-2) !important; }
.pp-table { width: 100%; border-collapse: separate; border-spacing: 0; margin: 14px 0 6px; background: #fff; border-radius: 24px; overflow: hidden; }
.pp-table th { text-align: left; font: 800 .72rem/1 var(--bx-body); letter-spacing: .08em; text-transform: uppercase; padding: 16px 20px; background: var(--bx-ink); color: #fff; }
.pp-table td { padding: 14px 20px; border-bottom: 1px solid var(--bx-lav-d); font: 600 .98rem/1.3 var(--bx-body); }
.pp-table tr:last-child td { border-bottom: 0; }
.pp-table th:not(:first-child), .pp-table td:not(:first-child) { text-align: right; }
.pp-table td:nth-child(2) { font-weight: 800; }
.pp-rel { margin-top: 40px; text-align: center; }
html body .pp-rel h3 { font-size: 1.8rem !important; margin: 0 0 14px; }
.pp-chips--light { justify-content: center; }
.pp-chips--light a { background: var(--bx-lav); color: var(--bx-ink) !important; }
.pp-chips--light a:hover { background: var(--bx-ink); color: #fff !important; }
@media (max-width: 991.98px) {
  .pp-why, .pp-duo { grid-template-columns: 1fr; }
  .pp-cases { grid-template-columns: 1fr 1fr; }
  .pp-soft { padding: 26px 22px; border-radius: 30px; }
  .pp-why__art { max-width: 420px; margin: 0 auto; }
}
@media (max-width: 560px) { .pp-cases { grid-template-columns: 1fr; } .pp-table th, .pp-table td { padding: 12px 10px; font-size: .88rem; } }

html body .pp-why h2 { max-width: none; }
.pp-why { align-items: start; }
.pp-why__art { position: sticky; top: 100px; }
.pp-facts__list dd strong { font-size: 1.1rem; line-height: 1.15; }
