/* Shared launch treatment for all four localized homepages. */
.release-hero {
    padding: 48px 8% 80px;
    overflow: hidden;
    background: var(--bg-soft);
}
.release-intro { max-width: 1060px; margin: 0 auto; text-align: center; }
.release-section-title {
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--text-dark);
}
.release-title { position: relative; z-index: 1; margin: 0 auto -30px; max-width: 900px; line-height: 0; }
.release-title svg { display: block; width: 100%; overflow: visible; }
.release-title text { fill: var(--text-dark); font-family: 'Inter', sans-serif; font-size: 64px; font-weight: 800; letter-spacing: -2.5px; }
html[lang="it"] .release-title text { font-size: 55px; }
.release-spotlight {
    position: relative;
    display: grid;
    place-items: center;
    isolation: isolate;
    width: min(100%, 640px);
    margin: 0 auto;
    padding: 10px 0 20px;
}
.release-spotlight::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(216, 149, 155, 0.28) 0%, rgba(216, 149, 155, 0.12) 48%, rgba(216, 149, 155, 0) 71%);
}
/* Center the two devices as one composition, with the watch in the foreground. */
.release-devices {
    --phone-width: clamp(180px, 25vw, 265px);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: max-content;
    max-width: 100%;
}
.release-phone {
    display: block;
    flex: none;
    width: var(--phone-width);
    height: auto;
    filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.15));
}
.release-watch {
    position: relative;
    z-index: 1;
    display: block;
    flex: none;
    width: calc(var(--phone-width) * 0.5);
    height: auto;
    margin: 0 0 20px calc(var(--phone-width) * -0.1);
    filter: drop-shadow(0 10px 16px rgba(0, 0, 0, 0.14));
}
.release-tagline { max-width: 580px; margin: 24px auto 20px; font-size: 1.2rem; opacity: 0.8; text-wrap: balance; }
.release-cta { background: #874d59; }
.release-cta span { margin-left: 16px; }
.release-cta:focus-visible { outline: 3px solid var(--text-dark); outline-offset: 5px; }
.release-highlights { max-width: 1050px; margin: 100px auto 0; }
.release-highlights > h2 { margin-bottom: 36px; }
.release-feature-list { list-style: none; display: grid; gap: 64px; margin: 48px 0; }
.release-feature { display: flex; gap: 22px; width: 72%; }
.release-feature:nth-child(even) { justify-self: end; text-align: right; flex-direction: row-reverse; }
.release-dot { flex: 0 0 8px; height: 8px; border-radius: 50%; background: var(--brand); margin-top: 16px; }
.release-feature h3 { font-size: clamp(1.6rem, 2.8vw, 2.3rem); font-weight: 600; line-height: 1.25; letter-spacing: -0.5px; text-wrap: balance; }
.release-feature p { font-size: clamp(1rem, 1.5vw, 1.15rem); color: var(--text-dark); opacity: 0.8; max-width: 540px; margin-top: 16px; }
.release-feature:nth-child(even) p { margin-left: auto; }
.release-closing { max-width: 650px; margin: 64px auto 0; text-align: center; color: var(--text-dark); opacity: 0.8; font-size: 1.05rem; text-wrap: pretty; }

.legacy-hero h2 { font-size: 4rem; line-height: 1.1; margin-bottom: 20px; letter-spacing: -2px; }
.release-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (max-width: 768px) {
    .release-hero { padding: 36px 5% 56px; }
    .release-title { margin: 0 -3% -6px; }
    .release-spotlight { max-width: 450px; }
    .release-highlights { margin-top: 64px; }
    .release-feature-list { gap: 44px; margin-top: 36px; }
    .release-feature { width: 94%; gap: 12px; }
    .release-dot { flex-basis: 7px; height: 7px; margin-top: 11px; }
    .release-closing { margin-top: 44px; }
    .legacy-hero h2 { font-size: 3rem; }
}
@media (max-width: 768px) {
    .legacy-hero .hero-mockup { width: 100%; }
    .legacy-hero .iphone-mockup { width: 50%; min-width: 0; }
}

/* Native-scroll product sequence. No modal or scroll interception. */
.release-scroll-runway { pointer-events: none; }
.release-scroll-page { position: relative; }
.release-stage {
    position: fixed;
    inset: 0;
    z-index: 1100;
    pointer-events: none;
    overflow: hidden;
}
.release-stage-light {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 50% 66%, rgba(216, 149, 155, .19), transparent 49%),
        radial-gradient(ellipse at 50% 24%, #fff 0%, #fffbfb 65%);
    transform-origin: 50% 60%;
}
.release-stage-title,
.release-stage-phone {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    max-width: none;
    transform-origin: 0 0;
    will-change: transform;
}
.release-stage-title { z-index: 1; }
.release-stage-phone {
    display: block;
    height: auto;
    filter: drop-shadow(0 24px 30px rgba(45, 35, 35, .12));
}
.release-scroll-hint {
    position: fixed;
    z-index: 1101;
    bottom: max(20px, env(safe-area-inset-bottom));
    left: 50%;
    transform: translateX(-50%);
    padding: 8px 16px;
    border: 0;
    background: transparent;
    color: var(--text-dark);
    font: 400 .75rem 'Inter', sans-serif;
    cursor: pointer;
}
.release-scroll-hint::after {
    content: '';
    display: block;
    width: 1px;
    height: 22px;
    margin: 10px auto 0;
    background: linear-gradient(var(--brand), transparent);
}
.release-scroll-hint:focus-visible { outline: 2px solid var(--brand); outline-offset: 4px; }
.release-reveal {
    opacity: 0;
    transform: translate3d(0, 32px, 0);
    transition: opacity 850ms ease, transform 1000ms cubic-bezier(.22, 1, .36, 1);
}
.release-reveal.is-revealed { opacity: 1; transform: translate3d(0, 0, 0); }
.release-feature.release-reveal h3,
.release-feature.release-reveal p { transition: transform 1000ms cubic-bezier(.22, 1, .36, 1); }
.release-feature.release-reveal:not(.is-revealed) p { transform: translateY(14px); }
.release-feature.release-reveal.is-revealed p { transform: translateY(0); transition-delay: 100ms; }
@media (prefers-reduced-motion: reduce) {
    .release-reveal { opacity: 1; transform: none; transition: none; }
}

/* Keep the scroll cue clear of the larger opening device. */
@media (min-width: 600px) {
    .release-scroll-hint { left: auto; right: 28px; transform: none; }
}