:root{--pur:#8B2BF0;--ylw:#FFE066;--lime3:#558C08}
*{box-sizing:border-box;margin:0}
body{font-family:Nunito,system-ui,-apple-system,sans-serif;font-weight:800;color:#fff;
 background:linear-gradient(180deg,#C83BF5 0%,#8B2BF0 55%,#6B18C8 100%);background-attachment:fixed;min-height:100vh}
a{color:inherit}
.wrap{max-width:1060px;margin:0 auto;padding:0 20px}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px;max-width:1060px;margin:0 auto;flex-wrap:wrap}
.logo{font-family:"Archivo Black",system-ui;font-size:19px;color:#fff;text-shadow:3px 3px 0 #000;letter-spacing:-.02em;text-decoration:none}
.logo b{display:inline-block;transform:rotate(-5deg);color:var(--ylw)}
nav{display:flex;gap:8px;flex-wrap:wrap}
nav a{color:#fff;text-decoration:none;font-size:14px;background:rgba(0,0,0,.18);padding:8px 14px;border-radius:999px}
.pill{display:inline-block;border:0;border-radius:999px;font:inherit;font-weight:900;font-size:19px;padding:17px 30px;cursor:pointer;text-decoration:none;
 background:linear-gradient(180deg,#B6FF3D,#93E81B 55%,#6FBA0B);color:#1B3300;
 box-shadow:inset 0 2px 0 rgba(255,255,255,.6),0 8px 0 var(--lime3),0 14px 18px rgba(0,0,0,.3)}
.pill:active{transform:translateY(5px);box-shadow:inset 0 2px 0 rgba(255,255,255,.6),0 3px 0 var(--lime3),0 6px 10px rgba(0,0,0,.25)}
.pill.alt{background:linear-gradient(180deg,#F1E3FF,#E2C8FF);color:#3A0F66;
 box-shadow:inset 0 2px 0 rgba(255,255,255,.8),0 8px 0 #A978E0,0 14px 18px rgba(0,0,0,.25)}
.pill.alt:active{box-shadow:inset 0 2px 0 rgba(255,255,255,.8),0 3px 0 #A978E0,0 6px 10px rgba(0,0,0,.22)}
h1{font-family:"Archivo Black",system-ui;font-size:clamp(32px,5.4vw,56px);line-height:1;text-align:center;color:#fff;
 text-shadow:5px 5px 0 #000;letter-spacing:-.03em;margin:26px 0 12px}
h1 span{color:var(--ylw)}
.lede{text-align:center;font-size:17px;font-weight:700;color:rgba(255,255,255,.92);max-width:660px;margin:0 auto 26px;line-height:1.5}
.card{max-width:620px;margin:0 auto;background:linear-gradient(180deg,#FFF3AE,#FFE066 55%,#FFD23F);border-radius:34px;
 padding:34px 28px 30px;text-align:center;color:#2B1B00;min-height:190px;display:flex;flex-direction:column;justify-content:center;
 box-shadow:inset 0 3px 0 rgba(255,255,255,.7),0 12px 0 #D9A21A,0 22px 34px rgba(0,0,0,.3)}
.card small{font-weight:900;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#8A6200}
.card .q{font-family:"Archivo Black",system-ui;font-size:clamp(24px,3.8vw,38px);line-height:1.08;margin:14px 0 6px;letter-spacing:-.02em}
.gen{display:flex;gap:10px;justify-content:center;margin-top:22px;flex-wrap:wrap}
.chips{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:20px auto 0;max-width:820px}
.chip{background:rgba(0,0,0,.2);color:#fff;border:2px solid rgba(255,255,255,.28);border-radius:999px;padding:9px 16px;
 font-size:14px;font-weight:800;cursor:pointer;text-decoration:none;display:inline-block}
.chip.on{background:var(--ylw);color:#3A0F66;border-color:#fff}
section{margin:58px 0}
h2{font-family:"Archivo Black",system-ui;font-size:clamp(23px,3.2vw,32px);text-shadow:3px 3px 0 #000;margin-bottom:6px;letter-spacing:-.02em}
.sub{color:rgba(255,255,255,.85);font-weight:700;margin-bottom:20px;line-height:1.5}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.cat{border-radius:28px;padding:26px 18px 22px;color:#1B0033;text-decoration:none;display:flex;flex-direction:column;
 align-items:center;justify-content:center;text-align:center;min-height:186px;
 box-shadow:inset 0 3px 0 rgba(255,255,255,.55),0 8px 0 rgba(0,0,0,.25)}
.cat:active{transform:translateY(4px);box-shadow:inset 0 3px 0 rgba(255,255,255,.55),0 4px 0 rgba(0,0,0,.25)}
.cat h3{font-family:"Archivo Black",system-ui;font-size:23px;margin:14px 0 6px;letter-spacing:-.02em}
.cat p{font-weight:800;font-size:15px;opacity:.7}
.cat .em{font-size:50px;line-height:1;filter:drop-shadow(0 4px 0 rgba(0,0,0,.14))}
.c1{background:linear-gradient(180deg,#FFF3AE,#FFD23F)}.c2{background:linear-gradient(180deg,#B6FF3D,#8FE01A)}
.c3{background:linear-gradient(180deg,#FF9FD0,#FF4FB0)}.c4{background:linear-gradient(180deg,#9FE8FF,#4FC3FF)}
.c5{background:linear-gradient(180deg,#FFC59F,#FF8A4F)}.c6{background:linear-gradient(180deg,#D8C0FF,#B48CFF)}
.c7{background:linear-gradient(180deg,#9FFFE0,#40E0BC)}.c8{background:linear-gradient(180deg,#FFD9D9,#FF8C8C)}
.panel{background:#fff;color:#21103A;border-radius:28px;padding:30px 26px;box-shadow:0 12px 0 rgba(0,0,0,.22)}
.panel h2,.panel h3{color:#21103A;text-shadow:none}
.panel p{font-weight:700;font-size:17px;line-height:1.6;margin:12px 0;color:#3B2B55}
.panel ol,.panel ul{margin:12px 0 0 20px;font-weight:800;line-height:1.85;font-size:18px}
.qlist{list-style:none;padding:0;display:grid;gap:10px;margin-top:16px}
.qlist li{background:#F4EDFF;border-radius:18px;padding:16px 18px;font-weight:800;font-size:18px;color:#3A0F66;line-height:1.35}
.qlist li b{color:#8B2BF0;margin-right:10px}
.app{display:flex;gap:26px;align-items:center;flex-wrap:wrap;background:linear-gradient(180deg,#2BB6FF,#5B5BFF);
 border-radius:32px;padding:28px;box-shadow:0 12px 0 rgba(0,0,0,.25)}
.phone{width:172px;height:330px;border-radius:30px;background:linear-gradient(180deg,#C83BF5,#8B2BF0);border:6px solid #000;
 flex:0 0 auto;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:16px;box-shadow:0 14px 26px rgba(0,0,0,.4)}
.phone .mini{background:linear-gradient(180deg,#FFF3AE,#FFD23F);border-radius:16px;padding:12px;color:#2B1B00;
 font-family:"Archivo Black",system-ui;font-size:14px;text-align:center;line-height:1.15}
.phone .bar{height:34px;border-radius:999px;background:linear-gradient(180deg,#B6FF3D,#8FE01A);box-shadow:0 4px 0 #558C08}
.faq{background:rgba(0,0,0,.2);border-radius:22px;padding:18px 20px;margin-bottom:10px}
.faq h3{font-size:19px;margin-bottom:8px}
.faq p{font-weight:700;font-size:16px;color:rgba(255,255,255,.88);line-height:1.55}
.crumb{font-size:14px;font-weight:700;color:rgba(255,255,255,.7);padding-top:6px}
.crumb a{text-decoration:none}
footer{padding:34px 20px 50px;text-align:center;color:rgba(255,255,255,.72);font-weight:700;font-size:14px}
footer a{text-decoration:none;margin:0 8px;white-space:nowrap}
.note18{background:rgba(0,0,0,.25);border-radius:18px;padding:14px 18px;font-weight:800;font-size:15px;text-align:center;max-width:620px;margin:16px auto 0}
@media(max-width:560px){.card{padding:26px 20px}.panel{padding:24px 18px}.qlist li{font-size:17px}}