/* HS Birthday Spotlight
   Mirrors the proven GRA carousel structure while using the HS white / #191970 theme. */
.hs-birthdays{
    position:relative;
    overflow:hidden;
    padding:clamp(72px,8vw,118px) 0;
    background:linear-gradient(180deg,#fff 0%,rgba(25,25,112,.035) 100%);
    border-top:1px solid rgba(25,25,112,.08);
    border-bottom:1px solid rgba(25,25,112,.08);
}
.hs-birthdays::before{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    right:-180px;
    top:-210px;
    border:1px solid rgba(25,25,112,.07);
    border-radius:50%;
    pointer-events:none;
}
.hs-birthday-grid{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:minmax(260px,.78fr) minmax(0,1.22fr);
    gap:clamp(42px,7vw,105px);
    align-items:center;
}
.hs-birthday-intro .hs-heading{margin-bottom:20px}
.hs-birthday-intro .hs-copy{max-width:520px;font-size:16px}
.hs-birthday-date{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-top:24px;
    padding-top:16px;
    border-top:1px solid rgba(25,25,112,.12);
    color:var(--hs-blue,#191970);
    font-size:11px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.hs-birthday-date i{font-size:13px}

/* Important: the track is deliberately NOT a data-hs-reveal element.
   This keeps the first birthday card visible independently of page reveal JS. */
.hs-birthday-track{
    position:relative;
    min-height:350px;
    overflow:hidden;
    isolation:isolate;
    background:var(--hs-blue,#191970);
    box-shadow:0 28px 70px rgba(25,25,112,.16);
}
.hs-birthday-track::before,
.hs-birthday-track::after{
    content:"";
    position:absolute;
    z-index:0;
    border-radius:50%;
    pointer-events:none;
}
.hs-birthday-track::before{
    width:310px;
    height:310px;
    right:-120px;
    top:-145px;
    border:1px solid rgba(255,255,255,.14);
}
.hs-birthday-track::after{
    width:210px;
    height:210px;
    right:-70px;
    top:-95px;
    border:1px solid rgba(255,255,255,.10);
}
.hs-birthday-card{
    position:absolute;
    inset:0;
    z-index:1;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:28px;
    padding:clamp(34px,5vw,66px);
    background:linear-gradient(135deg,#191970 0%,#24247e 100%);
    color:#fff;
    opacity:0;
    visibility:hidden;
    transform:translateX(28px);
    pointer-events:none;
    transition:opacity .45s ease,transform .55s var(--hs-ease,cubic-bezier(.22,1,.36,1)),visibility .45s ease;
}
.hs-birthday-card.is-active{
    opacity:1;
    visibility:visible;
    transform:none;
    pointer-events:auto;
}
.hs-birthday-card-copy{min-width:0}
body.hs-page .hs-birthday-wish{
    display:block;
    margin-bottom:17px;
    color:rgba(255,255,255,.67);
    font-size:10px;
    font-weight:700;
    letter-spacing:.18em;
    text-transform:uppercase;
}
body.hs-page .hs-birthday-card h3{
    max-width:760px;
    margin:0 0 13px;
    color:#fff;
    font-size:clamp(40px,4.7vw,70px);
    font-weight:500;
    line-height:.96;
    letter-spacing:-.06em;
    overflow-wrap:anywhere;
}
body.hs-page .hs-birthday-meta{
    margin:0;
    color:rgba(255,255,255,.76);
    font-size:14px;
    font-weight:500;
    letter-spacing:.01em;
}
.hs-birthday-age{
    position:relative;
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    justify-content:center;
    min-width:105px;
    padding-left:28px;
    border-left:1px solid rgba(255,255,255,.20);
    color:#fff;
    text-align:right;
}
.hs-birthday-age strong{
    color:#fff;
    font-size:clamp(44px,5vw,72px);
    font-weight:500;
    line-height:.86;
    letter-spacing:-.055em;
}
.hs-birthday-age small{
    margin-top:10px;
    color:rgba(255,255,255,.62);
    font-size:9px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    white-space:nowrap;
}
.hs-birthday-controls{
    position:absolute;
    z-index:5;
    right:24px;
    bottom:21px;
    display:flex;
    align-items:center;
    gap:10px;
    color:#fff;
}
.hs-birthday-controls button{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    padding:0;
    border:1px solid rgba(255,255,255,.35);
    border-radius:50%;
    background:rgba(255,255,255,.03);
    color:#fff;
    cursor:pointer;
    transition:background .25s ease,color .25s ease,border-color .25s ease,transform .25s ease;
}
.hs-birthday-controls button:hover,
.hs-birthday-controls button:focus-visible{
    border-color:#fff;
    background:#fff;
    color:#191970;
    transform:translateY(-1px);
}
.hs-birthday-controls span{
    min-width:46px;
    color:rgba(255,255,255,.76);
    font-size:10px;
    font-weight:600;
    text-align:center;
    letter-spacing:.08em;
}
.hs-birthday-controls b{color:#fff;font-weight:700}

@media (max-width:900px){
    .hs-birthday-grid{grid-template-columns:1fr;gap:34px}
    .hs-birthday-intro .hs-copy{max-width:680px}
    .hs-birthday-track{min-height:320px}
}
@media (max-width:600px){
    .hs-birthdays{padding:58px 0}
    .hs-birthday-track{min-height:355px}
    .hs-birthday-card{
        grid-template-columns:1fr;
        align-content:center;
        gap:24px;
        padding:34px 28px 72px;
    }
    body.hs-page .hs-birthday-card h3{font-size:clamp(38px,12vw,54px)}
    .hs-birthday-age{
        align-items:flex-start;
        min-width:0;
        padding:18px 0 0;
        border-left:0;
        border-top:1px solid rgba(255,255,255,.18);
        text-align:left;
    }
    .hs-birthday-age strong{font-size:42px}
    .hs-birthday-controls{right:18px;bottom:17px}
}
@media (prefers-reduced-motion:reduce){
    .hs-birthday-card{transition:none;transform:none}
    .hs-birthday-controls button{transition:none}
}