:root{
  color-scheme:light;
  font-family:system-ui,-apple-system,sans-serif;
  background:#FFF8FC;
  color:#141414;
}
*{box-sizing:border-box}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(ellipse at top right,#F3EEFF 0,transparent 55%),
    radial-gradient(ellipse at bottom left,#EEF4FF 0,transparent 50%),
    #FFF8FC;
}
.wrap{max-width:1100px;margin:auto;padding:32px 24px}
header{
  display:flex;align-items:center;justify-content:space-between;
  gap:20px;padding-bottom:48px;
}
.brand{
  display:flex;align-items:center;gap:14px;
  font-size:27px;font-weight:750;letter-spacing:-1px;
  color:#141414;text-decoration:none;
}
.brand-logo{
  width:88px;height:88px;object-fit:contain;
  flex-shrink:0;border-radius:18px;background:#FFFFFF;
}
.tag{
  font-size:12px;border:1px solid #E2C7D8;border-radius:30px;
  padding:8px 12px;color:#6B7280;background:#FFFDFE;
}
main{padding:35px 0 65px}
.eyebrow{
  color:#DB2777;letter-spacing:3px;text-transform:uppercase;
  font-size:12px;font-weight:700;
}
h1{
  font-size:clamp(40px,7vw,78px);line-height:1.08;
  letter-spacing:-2px;max-width:850px;margin:22px 0;
}
.lead{
  font-size:clamp(18px,3vw,23px);line-height:1.65;
  color:#6B7280;max-width:720px;
}
.grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:18px;margin-top:48px;
}
.card{
  border:1px solid #EAD9E5;border-radius:20px;
  padding:26px;background:#FFFFFF;
  box-shadow:0 8px 24px rgba(26,12,30,.08);
}
.card:nth-child(1){border-top:4px solid #EC4899}
.card:nth-child(2){border-top:4px solid #3B82F6}
.card:nth-child(3){border-top:4px solid #8B5CF6}
h2{font-size:21px;margin-top:0}
p{line-height:1.65}
.card p{color:#6B7280;margin-bottom:0}
.button{
  display:inline-block;background:#DB2777;color:#FFFFFF;
  padding:14px 22px;border-radius:12px;text-decoration:none;
  font-weight:700;margin-top:20px;
}
.button:hover{background:#B91C65}
a:focus-visible{outline:3px solid #2045A6;outline-offset:5px}
footer{
  border-top:1px solid #EAD9E5;padding:24px 0;
  color:#6B7280;font-size:14px;
}
@media(max-width:700px){
  .grid{grid-template-columns:1fr}
  header{align-items:flex-start}
  .brand{font-size:23px;gap:10px}
  .brand-logo{width:64px;height:64px}
  .tag{max-width:145px;text-align:center}
}
@media(max-width:380px){
  header{flex-direction:column}
  header .tag{max-width:none}
}