/* Approved memories concept v1. Live copy and original video, scoped to this section. */
.site-home #memories-connection {
    position: relative;
    padding: clamp(64px, 5.4vw, 104px) 0;
    background: radial-gradient(ellipse at 12% 42%, rgba(121, 71, 161, .055), transparent 54%), #080b10;
}
.site-home #memories-connection .memories-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(56px, 5.4vw, 104px);
    width: min(82%, 1600px);
    margin-inline: auto;
}
.site-home #memories-connection .memories-copy { min-width: 0; }
.site-home #memories-connection .memories-eyebrow {
    margin: 0 0 clamp(32px, 3vw, 56px);
    color: #bdb0de;
    font: 500 clamp(11px, .86vw, 15px)/1.6 'Inter', sans-serif;
    letter-spacing: .32em;
    text-transform: uppercase;
    text-wrap: wrap;
}
.site-home #memories-connection .memories-title {
    margin: 0 0 clamp(28px, 2.5vw, 48px);
    color: #f6f4f3;
    font-family: 'Inter', sans-serif;
    font-size: clamp(48px, 5.35vw, 104px);
    font-weight: 600;
    line-height: 1.04;
    letter-spacing: -.055em;
    text-wrap: wrap;
    overflow-wrap: normal;
}
.site-home #memories-connection .gradient-text {
    background: linear-gradient(100deg, #cda2a7, #a597ee);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.site-home #memories-connection .memories-subtitle {
    max-width: 23em;
    margin: 0 0 clamp(32px, 3vw, 54px);
    color: #aaa6af;
    font: 400 clamp(18px, 1.55vw, 28px)/1.55 'Inter', sans-serif;
    text-wrap: pretty;
}
.site-home #memories-connection .memories-actions { display: flex; flex-wrap: wrap; gap: 20px; }
.site-home #memories-connection .memories-actions a {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 56px;
    padding: 16px 28px;
    border: 1px solid rgba(221, 214, 230, .5);
    border-radius: 14px;
    background: transparent;
    color: #f6f4f3;
    font: 600 clamp(14px, 1.08vw, 18px)/1.4 'Inter', sans-serif;
    text-align: center;
    text-decoration: none;
    box-shadow: none;
    transition: transform 160ms var(--site-ease-out, ease-out), background-color 160ms ease, border-color 160ms ease;
}
.site-home #memories-connection .memories-actions .memories-primary { border-color: transparent; background: #cda2a7; color: #171319; }
.site-home #memories-connection :is(a, button):focus-visible { outline: 2px solid #dfc6f1; outline-offset: 5px; }
.site-home #memories-connection .memories-visual { min-width: 0; width: min(100%, 560px); justify-self: end; }
.site-home #memories-connection .memories-video-card { overflow: hidden; border-radius: 24px; background: transparent; }
.site-home #memories-connection video { display: block; width: 100%; height: auto; aspect-ratio: 928 / 1376; object-fit: contain; }
.site-home #memories-connection .memories-video-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 20px; }
.site-home #memories-connection .memories-status {
    display: inline-flex; align-items: center; gap: 16px; min-width: 0; margin: 0;
    color: #b3afb9; font: 400 clamp(9px, .68vw, 12px)/1.7 'Inter', sans-serif;
    letter-spacing: .18em; text-transform: uppercase; text-wrap: wrap;
}
.site-home #memories-connection .memories-status-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #69c6d7; }
.site-home #memories-connection .memories-toggle {
    box-sizing: border-box; display: inline-flex; flex: none; align-items: center; justify-content: center;
    width: 44px; height: 44px; padding: 10px; border: 1px solid rgba(221, 214, 230, .55);
    border-radius: 50%; background: transparent; color: #e1dce7; cursor: pointer;
    transition: background-color 160ms ease, border-color 160ms ease;
}
.site-home #memories-connection .memories-toggle[hidden] { display: none; }
.site-home #memories-connection .memories-toggle svg { width: 20px; height: 20px; }
.site-home #memories-connection [data-memories-playback-label] {
    position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.site-home #memories-connection .memories-toggle:not(.is-paused) .memories-play-icon,
.site-home #memories-connection .memories-toggle.is-paused .memories-pause-icon { display: none; }
/* Long translations grow naturally; the English reference keeps two lines. */
html:is(:lang(fr), :lang(de), :lang(es), :lang(pt), :lang(ru)) .site-home #memories-connection .memories-title { font-size: clamp(40px, 4.2vw, 82px); letter-spacing: -.045em; }
html:lang(ar) .site-home #memories-connection :is(.memories-eyebrow, .memories-status) { letter-spacing: 0; }
@media (hover: hover) and (pointer: fine) {
    .site-home #memories-connection .memories-actions a:hover { transform: translateY(-2px); border-color: #d5bdde; background-color: rgba(205, 162, 167, .08); }
    .site-home #memories-connection .memories-actions .memories-primary:hover { background-color: #dbb3b7; border-color: transparent; }
    .site-home #memories-connection .memories-toggle:hover { border-color: #dfc6f1; background-color: rgba(205, 162, 167, .1); }
    .site-home #memories-connection .memories-actions a:active { transform: translateY(0); }
}
@media (max-width: 1100px) {
    .site-home #memories-connection .memories-layout { width: 86%; gap: 40px; }
    .site-home #memories-connection .memories-actions { gap: 12px; }
    .site-home #memories-connection .memories-actions a { padding-inline: 18px; }
}
@media (max-width: 980px) {
    .site-home #memories-connection { padding: 64px 0; }
    .site-home #memories-connection .memories-layout { grid-template-columns: minmax(0, 1fr); width: min(86%, 680px); gap: 0; }
    .site-home #memories-connection .memories-copy { display: contents; }
    .site-home #memories-connection .memories-eyebrow { order: 1; margin-bottom: 28px; }
    .site-home #memories-connection .memories-title { order: 2; margin-bottom: 26px; font-size: clamp(36px, 6.5vw, 64px); }
    html:is(:lang(fr), :lang(de), :lang(es), :lang(pt), :lang(ru)) .site-home #memories-connection .memories-title { font-size: clamp(30px, 5.3vw, 52px); }
    .site-home #memories-connection .memories-subtitle { order: 3; margin-bottom: 32px; font-size: 20px; }
    .site-home #memories-connection .memories-visual { order: 4; width: min(100%, 460px); justify-self: center; }
    .site-home #memories-connection .memories-actions { order: 5; margin-top: 32px; }
}
@media (max-width: 480px) {
    .site-home #memories-connection .memories-layout { width: 88%; }
    .site-home #memories-connection .memories-title { font-size: clamp(30px, 8.2vw, 39px); }
    html:is(:lang(fr), :lang(de), :lang(es), :lang(pt), :lang(ru)) .site-home #memories-connection .memories-title { font-size: clamp(26px, 6.6vw, 32px); }
    .site-home #memories-connection .memories-subtitle { font-size: 17px; }
    .site-home #memories-connection .memories-actions a { width: 100%; min-height: 52px; }
    .site-home #memories-connection .memories-video-card { border-radius: 20px; }
    .site-home #memories-connection .memories-video-footer { gap: 12px; margin-top: 16px; }
    .site-home #memories-connection .memories-status { gap: 9px; font-size: 9px; letter-spacing: .1em; }
}
@media (prefers-reduced-motion: reduce) {
    .site-home #memories-connection :is(.memories-actions a, .memories-toggle) { transition: none; }
    .site-home #memories-connection .memories-actions a:hover { transform: none; }
}