*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.65 Raleway,"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;color:#2b2b2b;background:#f6f2ec}
a{color:#a0244a}
header{background:#c1430d;color:#fff;position:sticky;top:0;z-index:5;box-shadow:0 1px 6px rgba(0,0,0,.15)}   /* = pikaaso.com #top-bar */
header a,footer a{color:#fff;text-decoration:none}
.bar{max-width:1180px;margin:0 auto;padding:12px 16px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.logo{font-weight:700;font-size:21px;letter-spacing:.2px}
header .bar a:last-child{background:#fff;color:#c1430d;padding:7px 16px;border-radius:999px;font-weight:700;font-size:14px}
footer{background:#3d0f1e;color:#e9dbe0;margin-top:32px}footer .bar{font-size:14px}
main{max-width:1180px;margin:18px auto;padding:0 16px}
.smm-card{background:#fff;border-radius:14px;box-shadow:0 2px 14px rgba(60,20,30,.08);padding:22px}
main img{max-width:100%;height:auto}
/* images inside the old page text (not the product grids): centre them and cap big ones.
   On the old site they sat inside Avada columns; small GIFs/icons keep their own size. */
.smm-card img:not(.pgrid img){display:block;margin:14px auto;height:auto;max-width:min(100%,460px);max-height:560px;object-fit:contain;border-radius:8px}
.smm-card img:not(.pgrid img):not([width]){width:auto}   /* images with an explicit old width= keep it */
main iframe{max-width:100%;border:0;border-radius:10px}
h1{font-size:clamp(22px,3vw,30px)!important;line-height:1.3!important;color:#3a1020}
h2{color:#3a1020}h3 a,h2 a,h1 a{color:inherit!important}
.cta{display:flex;justify-content:center;margin:14px 0 20px}
.cta a,.btn{display:inline-block;background:#f1641e;color:#fff!important;font-weight:700;font-size:17px;padding:12px 30px;border-radius:10px;text-decoration:none;box-shadow:0 3px 10px rgba(241,100,30,.3)}
.cta a:hover,.btn:hover{background:#c1430d}
.btn{font-size:15px;padding:9px 18px;vertical-align:middle}   /* old [button] shortcodes */
.smm-card a.btn{display:table;margin:12px auto}                  /* their alignment attr was lost: centre each on its own line */
/* old theme button classes (their styling lived in the old Avada CSS) */
.invitationbtn,.invitationtransbtn{display:inline-block;font-weight:700;font-size:15px;padding:9px 18px;border-radius:10px;text-decoration:none;margin:8px 4px}
.invitationbtn{background:#f1641e;color:#fff!important;box-shadow:0 3px 10px rgba(241,100,30,.3)}.invitationbtn:hover{background:#c1430d}
.invitationtransbtn{background:transparent;color:#c1430d!important;border:2px solid #f1641e}.invitationtransbtn:hover{background:#fff4ec}
main video{max-width:100%;height:auto;border-radius:10px}
/* product grids: tidy cards; long names clamped visually (full text stays in the HTML) */
.pgrid{list-style:none;padding:0;margin:16px 0 22px;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}
.pgrid li{background:#fff;border:1px solid #efe6e9;border-radius:12px;overflow:hidden;transition:box-shadow .15s}
.pgrid li:hover{box-shadow:0 4px 14px rgba(60,20,30,.12)}
.pgrid a{display:block;color:#2b2b2b;text-decoration:none;font-size:14px;line-height:1.35}
.pgrid img{display:block;width:100%;aspect-ratio:3/4;object-fit:contain;background:#faf7f2}   /* whole design visible, never cropped */
.pgrid span{display:block;padding:8px 10px 10px}   /* full title shown */
details{border:1px solid #efe6e9;border-radius:10px;padding:10px 14px;margin:10px 0;background:#fbf8f3}summary{font-weight:700;cursor:pointer;color:#7a1e3a}
ul.check{padding-left:20px}
@media(max-width:700px){main{padding:0;margin:0}.smm-card{border-radius:0;padding:16px 14px}
 .pgrid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}.pgrid a{font-size:13px}.cta a{display:block;text-align:center;width:100%}}