:root{
  --bg:#fff6f3;
  --paper:#fffdfb;
  --rose:#d85e78;
  --rose-soft:#f6d6de;
  --ink:#542a39;
  --muted:#856675;
  --sand:#f8ede8;
  --line:#efd6dc;
  --chip:#f2e3ea;
}
*{box-sizing:border-box}
body{margin:0;font-family:"Work Sans",sans-serif;color:var(--ink);background:radial-gradient(circle at top left,#fff9f7 0,#fff6f3 45%,#f8edf1 100%)}
img{display:block;max-width:100%}
a{color:inherit}
.pi-skip{position:absolute;left:-9999px}
.pi-skip:focus{left:1rem;top:1rem;background:#fff;padding:.7rem 1rem;z-index:90}
.pi-wrap{width:min(1120px,calc(100% - 2rem));margin:0 auto}
.pi-header{padding:1rem 0 .85rem}
.pi-top{display:flex;justify-content:space-between;gap:1rem;align-items:center}
.pi-top img{width:min(264px,54vw)}
.pi-header nav,.pi-footnav{display:flex;gap:.75rem 1rem;flex-wrap:wrap}
.pi-header nav a,.pi-footnav a{text-decoration:none;padding:.45rem .7rem;border-radius:999px;background:transparent}
.pi-header nav a:hover,.pi-footnav a:hover{background:var(--chip)}
.pi-hero{padding:.8rem 0 1.5rem}
.pi-hero-frame{display:grid;grid-template-columns:1.15fr .85fr;gap:1rem;align-items:stretch}
.pi-media{min-height:500px;border-radius:34px 34px 120px 34px;overflow:hidden;position:relative;background:
linear-gradient(180deg,rgba(84,42,57,.1),rgba(84,42,57,.42)),
url('hero-main.jpg') center/cover no-repeat}
.pi-media::after{content:"";position:absolute;inset:auto 18px 18px auto;width:160px;height:160px;border-radius:50%;background:rgba(255,241,234,.24);backdrop-filter:blur(10px)}
.pi-side{display:grid;gap:1rem}
.pi-card,.pi-rank,.pi-strip,.pi-note,.pi-badges article{background:var(--paper);border:1px solid var(--line);box-shadow:0 14px 30px rgba(216,94,120,.07)}
.pi-card{padding:1.15rem 1.15rem 1rem;border-radius:26px}
.pi-kicker{margin:0 0 .65rem;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;color:var(--rose)}
.pi-hero h1,.pi-page h1,.pi-section h2,.pi-help h2{font-family:"Archivo Black",sans-serif;line-height:.96;letter-spacing:-.03em;margin:0}
.pi-hero h1{font-size:clamp(2.2rem,5.2vw,4.8rem);max-width:8ch}
.pi-card p,.pi-rank p,.pi-note p,.pi-page p,.pi-page li,.pi-help p,.pi-footer p{line-height:1.75}
.pi-tags{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem}
.pi-tags span{padding:.45rem .75rem;border-radius:999px;background:var(--chip)}
.pi-mini{display:grid;gap:.8rem}
.pi-mini div{padding:1rem;border-radius:22px;background:linear-gradient(180deg,#fffdfb,#fbf0ee);border:1px solid var(--line)}
.pi-ranking,.pi-section,.pi-help,.pi-rg,.pi-footer{padding:1.3rem 0}
.pi-rank-head{display:flex;justify-content:space-between;gap:1rem;align-items:end;margin-bottom:1rem}
.pi-rank-head h2{font-size:clamp(1.9rem,4.1vw,3.4rem)}
.pi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.pi-rank{padding:1rem;border-radius:28px 28px 16px 28px;display:grid;gap:.8rem}
.pi-rank-top{display:grid;grid-template-columns:auto 1fr auto;gap:.8rem;align-items:center}
.pi-no{width:42px;height:42px;border-radius:14px;background:var(--rose);display:grid;place-items:center;color:#fff;font-weight:800}
.pi-rank-top img{height:34px;object-fit:contain;object-position:left center}
.pi-score{font-weight:800;color:var(--rose)}
.pi-rank h3{margin:0;font-size:1.35rem}
.pi-offer{padding:.7rem .8rem;border-radius:16px;background:#fff2f0;border:1px dashed rgba(216,94,120,.35)}
.pi-actions{display:flex;justify-content:space-between;gap:1rem;align-items:center}
.pi-actions a,.pi-note a{background:var(--rose);color:#fff;text-decoration:none;padding:.82rem 1.05rem;border-radius:999px;font-weight:700}
.pi-actions a:hover,.pi-note a:hover{background:#c54762}
.pi-band{padding:.95rem 1.1rem;border-radius:22px;background:linear-gradient(90deg,#fff1eb,#fff9f6);border:1px solid var(--line)}
.pi-cols{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.pi-note{padding:1rem;border-radius:26px}
.pi-badges{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.pi-badges article{padding:1rem;border-radius:22px;background:linear-gradient(180deg,#fffefc,#fff6f3)}
.pi-help{background:#5f3243;color:#fff4f5}
.pi-help-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:1rem}
.pi-help h2{font-size:clamp(2.1rem,4.6vw,4rem)}
.pi-help a{text-decoration:none;border-bottom:1px solid rgba(255,244,245,.3)}
.pi-rg{background:#fff0ef;border-top:1px solid #efc4c8;border-bottom:1px solid #efc4c8}
.pi-footer{background:#fff9f7}
.pi-foot-top{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:center}
.pi-foot-top img{width:min(250px,52vw)}
.pi-footnav{justify-content:flex-end}
.pi-page{width:min(900px,calc(100% - 2rem));margin:0 auto;padding:2.3rem 0 2.8rem}
.pi-date{margin:.8rem 0 1.2rem;color:var(--muted)}
@media (max-width:920px){
  .pi-hero-frame,.pi-grid,.pi-cols,.pi-help-grid,.pi-foot-top,.pi-badges{grid-template-columns:1fr}
  .pi-footnav{justify-content:flex-start}
}
@media (max-width:700px){
  .pi-top{align-items:flex-start;flex-direction:column}
  .pi-rank-top{grid-template-columns:auto 1fr}
  .pi-score{grid-column:1/-1}
}