/* Happy Mail campaign B: confident navy, vivid fuchsia and distinct raised CTAs. */
.top-happymail-pr {
  box-sizing:border-box;isolation:isolate;position:relative;overflow:hidden;
  margin:20px 0 23px;padding:17px 24px 12px;border:1px solid #21507c;border-radius:16px;color:#fff;
  background:linear-gradient(131deg,transparent 18%,rgba(57,126,183,.23) 18% 28%,transparent 28% 52%,rgba(28,89,146,.2) 52% 62%,transparent 62%),
    linear-gradient(115deg,#06213f 0%,#074373 43%,#07284d 68%,#041733 100%);
  box-shadow:0 4px 16px rgba(0,0,0,.28),inset 0 1px 0 rgba(144,219,255,.16);
}
.top-happymail-pr * {box-sizing:border-box}
.top-happymail-pr::after {content:"";position:absolute;right:0;top:0;width:86px;height:86px;pointer-events:none;opacity:.15;
 background:radial-gradient(circle,#9dd9fa 1px,transparent 1.7px) 0 0/12px 12px}
.top-happymail-pr .top-happymail-label {
 display:inline-flex;align-items:center;gap:8px;position:relative;z-index:1;
 margin:0 0 10px;padding:5px 16px 5px 7px;
 border-radius:4px 13px 4px 4px;background:linear-gradient(100deg,#f50067,#d60077);
 color:#fff;font-size:14px;font-weight:900;line-height:1.35
}
.top-happymail-pr .top-happymail-label b {
 display:inline-flex;align-items:center;justify-content:center;padding:1px 6px;border:1px solid #fff;
 border-radius:3px;color:#fff;background:#071a3b;font-size:11px;letter-spacing:.06em
}
.top-happymail-pr .top-happymail-layout {
 display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.9fr);
 gap:20px;align-items:center
}
.top-happymail-pr .top-happymail-layout>* {min-width:0}
.top-happymail-pr h2 {
 margin:0 0 5px;padding:0;border:0;background:transparent;
 font-size:clamp(25px,3.25vw,37px);font-weight:950;line-height:1.3;letter-spacing:-.045em;color:#fff;
 text-shadow:0 2px 3px rgba(0,0,0,.2)
}
.top-happymail-pr .top-happymail-headline-first {display:inline}
.top-happymail-pr .top-happymail-headline-pop {display:inline;color:#fff133}
.top-happymail-pr .top-happymail-description {margin:4px 0 6px;color:#fff;font-size:15px;font-weight:750;line-height:1.5}
.top-happymail-pr .top-happymail-start {margin:0 0 11px;padding:0;color:#fcecff;font-size:15px;font-weight:900;line-height:1.55}
.top-happymail-pr .top-happymail-start strong {color:#ffef37;font-weight:950}
.top-happymail-pr .top-happymail-perks {
 display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
 width:min(100%,495px);min-height:53px;padding:8px 10px;border-radius:38px;background:#fff;color:#071a3b;
 box-shadow:0 3px 8px rgba(0,0,0,.18)
}
.top-happymail-pr .top-happymail-perk {
 display:flex;align-items:center;justify-content:center;gap:7px;min-width:0;
 font-size:12px;font-weight:900;line-height:1.2
}
.top-happymail-pr .top-happymail-perk+.top-happymail-perk {border-left:1px solid #bac5d4;padding-left:8px;margin-left:5px}
.top-happymail-pr .top-happymail-perk-icon {flex:none;width:28px;height:28px;color:#eb0061}
.top-happymail-pr .top-happymail-perk-accent {color:#ed0066;font-weight:950;margin-left:3px}
.top-happymail-pr .top-happymail-perk small {display:block;color:#27364b;font-size:10px;font-weight:750;line-height:1.3}
.top-happymail-pr .top-happymail-action {
 display:grid;gap:8px;align-content:center;min-width:0;
 padding:5px 0;background:transparent;border:0;box-shadow:none
}
.top-happymail-pr .top-happymail-benefit {
 order:1;margin:0;color:#fff;font-size:12px;font-weight:850;line-height:1.35;text-align:center
}
.top-happymail-pr .top-happymail-benefit strong {color:#fff244;font-weight:950}
.top-happymail-pr .top-happymail-cta {
 display:flex;align-items:center;justify-content:center;gap:6px;width:100%;
 text-align:center;text-decoration:none!important;line-height:1.3;overflow-wrap:anywhere;
 border-radius:36px;font-size:14px;font-weight:950;
 transition:transform .16s ease,filter .16s ease,box-shadow .16s ease
}
.top-happymail-pr .top-happymail-cta-secondary {
 order:0;min-height:49px;padding:10px 12px;
 background:#fff;color:#071b3b!important;border:3px solid #f42b91;
 box-shadow:0 4px 0 #860944,0 8px 13px rgba(0,0,0,.3)
}
.top-happymail-pr .top-happymail-cta-primary {
 order:2;min-height:66px;padding:12px 16px;border:3px solid #ffafd6;
 border-radius:38px;background:linear-gradient(105deg,#ff1781,#f30075 53%,#db0070);color:#fff!important;
 box-shadow:inset 0 2px 0 rgba(255,255,255,.25),0 5px 0 #870044,0 8px 16px rgba(0,0,0,.38),0 0 16px rgba(247,26,136,.3);
 font-size:17px;text-shadow:0 1px 2px rgba(56,0,40,.2)
}
.top-happymail-pr .top-happymail-cta-primary [aria-hidden="true"] {font-size:25px;font-weight:900;line-height:1}
.top-happymail-pr .top-happymail-cta-break {display:none}
.top-happymail-pr .top-happymail-cta:focus-visible {outline:3px solid #fff650;outline-offset:5px}
@media(hover:hover) {
 .top-happymail-pr .top-happymail-cta:hover {transform:translateY(-2px);filter:brightness(1.05)}
 .top-happymail-pr .top-happymail-cta-primary:hover {box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 7px 0 #870044,0 11px 17px rgba(0,0,0,.4),0 0 20px rgba(247,26,136,.4)}
}
.top-happymail-pr .top-happymail-cta:active {transform:translateY(3px);box-shadow:none}
.top-happymail-pr .top-happymail-fine {
 margin:12px 0 0;padding:9px 0 0;border-top:1px solid rgba(166,201,239,.24);
 font-size:10px;line-height:1.5;color:#dbe7f4
}
@media(max-width:720px) {
 .top-happymail-pr {margin:12px 0 14px;padding:12px;border-radius:12px}
 .top-happymail-pr .top-happymail-label {padding:3px 12px 3px 5px;font-size:11px;margin-bottom:7px}
 .top-happymail-pr .top-happymail-label b {padding:1px 4px;font-size:10px}
 .top-happymail-pr .top-happymail-layout {grid-template-columns:minmax(0,1fr);gap:9px}
 .top-happymail-pr h2 {font-size:clamp(22px,6vw,28px);line-height:1.24;margin:0 0 4px}
 .top-happymail-pr .top-happymail-description {font-size:12px;margin:2px 0}
 .top-happymail-pr .top-happymail-start {font-size:12px;margin:2px 0 7px}
 .top-happymail-pr .top-happymail-perks {
   width:100%;min-height:43px;padding:5px 8px;border-radius:30px
 }
 .top-happymail-pr .top-happymail-perk {gap:5px;font-size:11px}
 .top-happymail-pr .top-happymail-perk-icon {width:23px;height:23px}
 .top-happymail-pr .top-happymail-perk small {font-size:9px}
 .top-happymail-pr .top-happymail-action {gap:7px;padding:0}
 .top-happymail-pr .top-happymail-benefit {font-size:11px}
 .top-happymail-pr .top-happymail-cta {font-size:12px;gap:4px}
 .top-happymail-pr .top-happymail-cta-secondary {min-height:39px;padding:7px 9px;border-width:2px;box-shadow:0 3px 0 #860944,0 5px 8px rgba(0,0,0,.25)}
 .top-happymail-pr .top-happymail-cta-primary {
   min-height:55px;padding:8px 9px;font-size:15px;border-width:2px;
   box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 4px 0 #870044,0 6px 12px rgba(0,0,0,.33),0 0 10px rgba(247,26,136,.25)
 }
 .top-happymail-pr .top-happymail-cta-break {display:block}
 .top-happymail-pr .top-happymail-fine {margin-top:9px;padding-top:7px;font-size:9px}
}
@media(max-width:360px) {
 .top-happymail-pr {padding:10px}
 .top-happymail-pr h2 {font-size:21px}
 .top-happymail-pr .top-happymail-perk-icon {width:19px;height:19px}
 .top-happymail-pr .top-happymail-perk {font-size:10px}
}
@media(prefers-reduced-motion:reduce) {
 .top-happymail-pr .top-happymail-cta {transition:none}
 .top-happymail-pr .top-happymail-cta:hover {transform:none}
}

/* Compact mobile B concept: one advertisement after the map; guide link is the primary action. */
@media(max-width:720px) {
  .top-happymail-pr{margin:12px 0 18px;padding:9px 11px 10px;border-radius:12px}
  .top-happymail-pr .top-happymail-label{margin:0 0 5px;padding:2px 9px 2px 5px;font-size:11px}
  .top-happymail-pr .top-happymail-label b{font-size:10px;padding:1px 4px}
  .top-happymail-pr .top-happymail-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:5px}
  .top-happymail-pr h2{font-size:clamp(19px,5vw,22px);line-height:1.25;margin:0 0 3px}
  .top-happymail-pr .top-happymail-description{font-size:11px;line-height:1.3;margin:0 0 3px}
  .top-happymail-pr .top-happymail-start{font-size:11px;line-height:1.35;margin:0 0 5px}
  .top-happymail-pr .top-happymail-perks{width:100%;min-height:0;padding:4px 7px;border-radius:24px}
  .top-happymail-pr .top-happymail-perk{font-size:10px;line-height:1.1;gap:0}
  .top-happymail-pr .top-happymail-perk-icon,.top-happymail-pr .top-happymail-perk small{display:none}
  .top-happymail-pr .top-happymail-perk+.top-happymail-perk{margin-left:3px;padding-left:5px}
  .top-happymail-pr .top-happymail-action{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:4px 7px;padding:2px 0 0;align-items:stretch}
  .top-happymail-pr .top-happymail-benefit{order:0;grid-column:1 / -1;font-size:10px;line-height:1.3;text-align:left}
  .top-happymail-pr .top-happymail-cta{border-width:2px;min-height:48px;padding:5px 7px;line-height:1.25}
  .top-happymail-pr .top-happymail-cta-primary{order:1;grid-column:1;font-size:12px;min-height:48px;box-shadow:0 3px 0 #870044,0 4px 9px rgba(0,0,0,.26)}
  .top-happymail-pr .top-happymail-cta-secondary{order:2;grid-column:2;font-size:10px;min-height:48px;box-shadow:0 3px 0 #860944,0 4px 9px rgba(0,0,0,.2)}
  .top-happymail-pr .top-happymail-cta-break{display:none}
  .top-happymail-pr .top-happymail-cta-primary [aria-hidden="true"]{font-size:18px}
  .top-happymail-pr .top-happymail-fine{margin:7px 0 0;padding:5px 0 0;font-size:9px;line-height:1.25}
}
@media(max-width:360px){
  .top-happymail-pr .top-happymail-cta-primary{font-size:11px}
  .top-happymail-pr .top-happymail-cta-secondary{font-size:9px}
}