/* plich-o-plich.org.ua — унікалізація шаблону Pariwin: соняшниковий акцент у тон бренду + глибокий сливовий (бренд — фіолетовий #3e1153),
   мотив «плече до плеча» (дві паралельні смуги) у шапці статті, H2, FAQ і футері. */
:root{
  --pp-sun:#ffcf24;
  --pp-sun-soft:#fff4c7;
  --pp-ink:#2a0b3d;
  --pp-blue:#6a2fb0;
  --pp-blue-soft:#f4edfc;
  --pp-text:#2b2a33;
  --pp-muted:#5d6070;
  --pp-line:#ece4f4;
  --control-primary:#ffcf24;
}

/* ---------- стаття ---------- */
.pp-article{padding:8px 16px 28px;color:var(--pp-text);font-family:-apple-system,"BlinkMacSystemFont","Roboto","Segoe UI",Arial,sans-serif}
.pp-article__in{max-width:960px;margin:0 auto}
.pp-head{position:relative;margin:8px 0 22px;padding:26px 24px 22px 30px;border-radius:18px;color:#fff;overflow:hidden;
  background:linear-gradient(120deg,var(--pp-ink) 0%,#4a1670 58%,var(--pp-blue) 100%)}
.pp-head:before,.pp-head:after{content:"";position:absolute;top:-20%;bottom:-20%;width:14px;border-radius:8px;transform:rotate(18deg)}
.pp-head:before{right:86px;background:var(--pp-sun)}
.pp-head:after{right:58px;background:#c9a6ff;opacity:.85}
.pp-article--short .pp-head{margin-bottom:6px}
.pp-h1{margin:0;font-size:30px;line-height:1.2;font-weight:800;letter-spacing:-.2px;text-transform:none;max-width:calc(100% - 110px);color:#fff}
.pp-byline{display:flex;align-items:center;gap:10px;margin:12px 0 0;font-size:13px;color:#e6d9f5}
.pp-shoulders{display:inline-block;width:22px;height:12px;flex:none;
  background:linear-gradient(90deg,var(--pp-sun) 0 9px,transparent 9px 13px,#c9a6ff 13px 22px);border-radius:3px}
.pp-crumbs ol{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px;padding:0;list-style:none;font-size:13px}
.pp-crumbs li{color:#dccbf2}
.pp-crumbs li+li:before{content:"›";margin-right:6px;color:var(--pp-sun)}
.pp-crumbs a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,207,36,.6)}

.pp-article h2{position:relative;margin:34px 0 12px;padding-left:22px;font-size:23px;line-height:1.25;font-weight:800;color:var(--pp-ink);text-transform:none}
.pp-article h2:before,.pp-article h2:after{content:"";position:absolute;top:4px;bottom:4px;width:5px;border-radius:3px}
.pp-article h2:before{left:0;background:var(--pp-sun)}
.pp-article h2:after{left:8px;background:var(--pp-blue)}
.pp-article h3{margin:22px 0 8px;font-size:18px;line-height:1.3;font-weight:700;color:var(--pp-blue);text-transform:none}
.pp-article p{margin:0 0 12px;font-size:16px;line-height:1.65}
.pp-article a{color:var(--pp-blue);text-decoration:underline;text-decoration-color:var(--pp-sun);text-underline-offset:3px}
.pp-article ul,.pp-article ol{margin:0 0 16px;padding:14px 18px;border-radius:14px;background:var(--pp-blue-soft);list-style:none}
.pp-article li{position:relative;margin:6px 0;padding-left:28px;font-size:16px;line-height:1.55}
.pp-article ul>li:before{content:"";position:absolute;left:4px;top:8px;width:12px;height:8px;border-radius:2px;
  background:linear-gradient(90deg,var(--pp-sun) 0 5px,transparent 5px 7px,var(--pp-blue) 7px 12px)}
.pp-article ol{counter-reset:pp}
.pp-article ol>li{counter-increment:pp}
.pp-article ol>li:before{content:counter(pp);position:absolute;left:0;top:1px;width:20px;height:20px;border-radius:50%;
  background:var(--pp-sun);color:var(--pp-ink);font-size:12px;font-weight:800;line-height:20px;text-align:center}
.pp-article img{display:block;max-width:100%;height:auto;margin:6px 0 18px;border-radius:14px;box-shadow:0 8px 24px rgba(42,11,61,.14)}

.pp-table-wrap{margin:0 0 18px;overflow-x:auto;border-radius:14px;border:1px solid var(--pp-line)}
.pp-table{width:100%;border-collapse:collapse;font-size:15px}
.pp-table th{background:var(--pp-ink);color:#fff;text-align:left;padding:10px 14px;font-weight:700}
.pp-table th:first-child{box-shadow:inset 4px 0 0 var(--pp-sun)}
.pp-table td{padding:10px 14px;border-top:1px solid var(--pp-line);vertical-align:top}
.pp-table tr:nth-child(even) td{background:#faf7fd}

/* ---------- FAQ ---------- */
.pp-faq-list{display:grid;gap:10px;margin:6px 0 20px}
.pp-faq{border:1px solid var(--pp-line);border-radius:14px;background:#fff;overflow:hidden;transition:box-shadow .2s}
.pp-faq[open]{box-shadow:0 6px 18px rgba(106,47,176,.14);border-color:#dcc6f5}
.pp-faq summary{display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer;list-style:none}
.pp-faq summary::-webkit-details-marker{display:none}
.pp-faq summary h3{margin:0;flex:1;font-size:16px;color:var(--pp-ink)}
.pp-faq summary:after{content:"";flex:none;width:26px;height:26px;border-radius:50%;
  background:var(--pp-sun-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%236a2fb0' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/12px no-repeat;
  transition:transform .25s}
.pp-faq[open] summary:after{transform:rotate(180deg);background-color:var(--pp-sun)}
.pp-faq__a{padding:0 16px 6px;animation:pp-fade .25s ease}
@keyframes pp-fade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* ---------- відповідальна гра у футері ---------- */
.pp-rg{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;align-items:center;margin:12px 0;padding:14px 16px;
  border-radius:14px;background:var(--pp-ink);color:#efe6f8}
.pp-rg__age{grid-row:span 2;display:flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:50%;
  border:3px solid var(--pp-sun);color:var(--pp-sun);font-weight:900;font-size:18px}
.pp-rg__txt{margin:0;font-size:14px}
.pp-rg__links{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;padding:0;list-style:none;font-size:13px}
.pp-rg__links a{color:#fff;text-decoration:underline;text-decoration-color:var(--pp-sun)}

/* ---------- точкові акценти шаблону: шапка сливовим градієнтом, жовта риска під слайдером ---------- */
[class*="modulor_header2__header__"]{background:linear-gradient(90deg,#2a0b3d 0%,#3e1153 55%,#5b1d86 100%)!important;
  box-shadow:inset 0 -3px 0 var(--pp-sun)}
.top-slider-wrapper{border-bottom:3px solid var(--pp-sun)}
.modulor_section-heading__container__1_29_0{position:relative}

@media (max-width:767px){
  .pp-article{padding:4px 12px 22px}
  .pp-head{padding:20px 18px 18px 20px;border-radius:14px}
  .pp-head:before{right:40px;width:10px}
  .pp-head:after{right:20px;width:10px}
  .pp-h1{font-size:23px;max-width:calc(100% - 56px)}
  .pp-article h2{font-size:20px}
  .pp-article p,.pp-article li{font-size:15px}
  .pp-table{font-size:14px}
}
