/* Supplemental scripts keep Pretendard wherever its glyph coverage permits. */
:root { --font-ui:'Pretendard Variable','Noto Sans',-apple-system,BlinkMacSystemFont,sans-serif; }
html:lang(ar) { --font-ui:'Noto Sans Arabic','Pretendard Variable',sans-serif; }
html:lang(he) { --font-ui:'Noto Sans Hebrew','Pretendard Variable',sans-serif; }
html:lang(hi) { --font-ui:'Noto Sans Devanagari','Pretendard Variable',sans-serif; }
html:lang(th) { --font-ui:'Noto Sans Thai','Pretendard Variable',sans-serif; }
html:lang(ja) { --font-ui:'Pretendard JP Variable','Hiragino Sans','Yu Gothic',sans-serif; }
html:lang(zh-CN) { --font-ui:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif; }
html:not(:lang(ko)):not(:lang(ja)):not(:lang(zh-CN)) :is(h1,h2,h3,p) { word-break:normal; overflow-wrap:break-word; }
html:is(:lang(ar),:lang(he),:lang(hi),:lang(th)) :is(h1,h2,h3,p) { letter-spacing:normal; }
html:is(:lang(ar),:lang(he)) :is(h1,h2,h3) { line-height:1.5; }
html:lang(th) :is(h1,h2,h3,p) { line-height:1.65; }
.header-actions .language { max-width:180px; min-width:56px; }
.mobile-menu select { width:100%; max-width:100%; min-height:48px; }
.hero-content h1 > span { max-width:100%; overflow-wrap:break-word; }
.hero-photo,.motion .hero-photo { object-position:var(--hero-focus,65% center); }
.moment-frame > img,.motion .moment-frame > img { object-position:var(--couple-focus,50% center); }
@media (min-width:800px) {
  .hero-content h1 > span:last-child { padding-inline:.390625em !important; }
  html:lang(vi) .hero-content h1 > span:first-child { max-width:46vw; text-wrap:balance; }
  html[data-hero-copy=right] .hero-content { text-align:right; }
  html[data-hero-copy=right] .hero-content h1 { align-items:flex-end; }
  html[data-hero-copy=left] .hero-content { text-align:left; }
  html[data-hero-copy=left] .hero-content h1 { align-items:flex-start; }
  html[dir=rtl][data-hero-copy=right] .hero-content h1 { align-items:flex-start; }
  html[dir=rtl][data-hero-copy=left] .hero-content h1 { align-items:flex-end; }
}
html:not(:lang(ko)):not(:lang(ja)):not(:lang(zh-CN)) .hero-content h1 { font-size:clamp(2.05rem,5.2vw,5.25rem); }
.language-fallback { flex-wrap:wrap; gap:12px 20px; }
.language-fallback a { min-height:44px; display:inline-flex; align-items:center; }
[dir=rtl] .hero-content { direction:rtl; text-align:right; }
[dir=rtl] .camera-viewport,[dir=rtl] .camera-track,[dir=rtl] .camera-controls { direction:ltr; }
[dir=rtl] .camera-info { direction:rtl; text-align:start; }
[dir=rtl] .capture-step { padding-left:0; padding-right:22px; }
[dir=rtl] .capture-step::before { left:auto; right:0; }
html[dir=rtl].motion .moment-left { right:auto; left:calc(50% + 190px); }
html[dir=rtl].motion .moment-right { left:auto; right:calc(50% + 190px); }
[dir=rtl] .screen-dialog-meta p { text-align:start; }
[dir=rtl] :is(.email,.wordmark,.footer-wordmark,.business-details dd,.apple-credit) { unicode-bidi:plaintext; }
[dir=rtl] .progress-nav { right:auto; left:28px; }
[dir=rtl] .progress-nav a { flex-direction:row-reverse; }
[dir=rtl] .download svg,[dir=rtl] .hero-download svg { transform:scaleX(-1); }
/* Photos, official hardware and actual app captures are never mirrored. */
@media (max-width:1199px) and (min-width:800px) { .header-actions .mini { display:none; } }
@media (min-width:800px) { [dir=rtl] .capture-visual { padding-right:0; padding-left:72px; } }
@media (max-width:799px) {
  .hero-content h1 { align-items:center; }
  [dir=rtl] .hero-content { text-align:center; }
  html:not(:lang(ko)):not(:lang(ja)):not(:lang(zh-CN)) .hero-content h1 { font-size:clamp(1.8rem,6.8vw,3.2rem); }
  .mobile-menu .download { white-space:normal; text-align:center; }
  .capture-step { min-width:0; }
  .capture-intro { padding-inline:38px; }
  .capture-intro h2 { font-size:clamp(1.75rem,8.2vw,2rem); }
  .hero-label { left:50%; right:auto; transform:translateX(-50%); width:max-content; max-width:calc(100% - 24px); padding:4px 9px; border-radius:2px; background:rgba(16,26,36,.78); line-height:1.4; text-shadow:none; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* Touch editorial motion: scroll remains native; desktop storytelling stays separate. */
.reveal-motion .motion-enter {
  opacity:0; transform:translate3d(0,30px,0);
  transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .85s cubic-bezier(.22,1,.36,1);
  transition-delay:var(--enter-delay,0ms);
}
.reveal-motion .motion-enter.is-visible { opacity:1; transform:none; }
.reveal-motion .motion-enter:focus-within, .reveal-motion .motion-enter:focus-visible { opacity:1; transform:none; transition:none; }
.touch-motion .hero-photo { transform:translate3d(0,var(--touch-hero-y,0px),0) scale(1.06); }
.touch-motion .capture-visual { translate:0 var(--device-y,0px); }
.touch-motion .moments { height:175svh; padding:0; background:#fff; }
.touch-motion .moments-sticky { position:sticky; top:0; height:100svh; min-height:0; overflow:hidden; display:flex; align-items:flex-start; justify-content:center; padding-top:10svh; box-sizing:border-box; }
.touch-motion .moment-frame { position:relative; inset:auto; width:min(100%,66svh); height:auto; border-radius:var(--touch-photo-radius,24px); clip-path:none; transform:scale(var(--touch-frame-scale,.88)); transform-origin:top center; overflow:hidden; background:transparent; }
.touch-motion .moment-frame > img { position:relative; inset:auto; width:100%; height:min(44svh,66.6667vw); object-fit:cover; transform:none; }
.touch-motion .moment-side,.touch-motion .progress-nav { display:none; }
.touch-motion .moment-copy { position:relative; inset:auto; width:100%; padding:32px 24px 48px; box-sizing:border-box; background:#131c25; opacity:var(--touch-copy,0); transform:translate3d(0,var(--touch-copy-y,28px),0); }
.touch-motion .moment-frame::after { opacity:var(--touch-copy,0); }
.touch-motion .moment-shade { display:none; }
.touch-motion.moment-static .moments { height:auto; padding-block:64px; }
.touch-motion.moment-static .moments-sticky { position:relative; height:auto; overflow:visible; padding-top:0; }
.touch-motion.moment-static .moment-frame { transform:none; width:100%; }
.touch-motion.moment-static .moment-frame > img { height:auto; object-fit:contain; }
.touch-motion.moment-static .moment-copy,.touch-motion.moment-static .moment-frame::after { opacity:1; transform:none; }
.reveal-motion:not(.motion) .camera-art {
 transform:translate3d(0,var(--card-y,0px),0) rotate(var(--card-r,0deg)) scale(var(--card-scale,1));
 transition:transform .45s cubic-bezier(.22,1,.36,1);
}
@media (hover:none), (pointer:coarse) {
 .camera-index button:active,.screen-open:active,.menu-button:active,.menu-close:active { scale:.94; }
 .camera-index button,.screen-open,.menu-button,.menu-close { transition:scale .18s cubic-bezier(.22,1,.36,1),color .2s; }
}
@media (prefers-reduced-motion:reduce) {
 .motion-enter { opacity:1!important; transform:none!important; transition:none!important; }
 .capture-visual { translate:none!important; }
 .camera-index button,.screen-open,.menu-button,.menu-close { scale:1!important; transition:none!important; }
}

/* Scroll-scrubbed camera story on phones and tablets, using the same selection timeline. */
.hero-pinned .intro { height:165svh; padding:0; }
.hero-pinned .intro-sticky { position:sticky; top:0; height:100svh; min-height:0; padding:0; display:grid; align-items:center; }
.hero-pinned .hero-frame { position:relative; inset:auto; width:100%; height:auto; transform:scale(var(--touch-hero-frame,.94)); border-radius:var(--touch-hero-radius,32px); }
.touch-rail .cameras { height:380svh; padding:0; --art-h:var(--touch-art-h,240px); }
.touch-rail .cameras-sticky { position:sticky; top:0; height:100svh; min-height:0; box-sizing:border-box; padding:76px 0 20px; display:flex; flex-direction:column; justify-content:center; gap:24px; }
.touch-rail .section-heading { margin:0 auto; text-align:start; flex-shrink:0; }
.touch-rail .section-heading h2 { font-size:clamp(1.6rem,4.5vw,2.5rem); line-height:1.3; }
.touch-rail .section-heading .lead { font-size:1rem; line-height:1.6; margin-top:14px; }
.touch-rail .camera-table { flex-shrink:0; min-height:0; }
.touch-rail .camera-viewport { overflow:hidden; scroll-snap-type:none; padding:30px 0 0; touch-action:pan-y; }
.touch-rail .camera-track { --touch-card-width:min(86vw,640px); --track-pad:calc((100vw - var(--touch-card-width))/2); padding-inline:var(--track-pad); gap:24px; transform:translate3d(var(--track-x,0px),var(--rail-entry-y,36px),0); }
.touch-rail .camera-card { width:var(--touch-card-width); }
.touch-rail .camera-art { height:var(--touch-art-h,240px); }
.touch-rail .camera-art img { transform:scale(var(--rail-entry-scale,.78)); }
.touch-rail .camera-info { padding:30px 2px 0; }
.touch-rail .camera-info h3 { font-size:clamp(1.125rem,2.5vw,1.4375rem); line-height:1.4; }
.touch-rail .camera-info > p:last-child { font-size:1rem; line-height:1.6; }
.touch-rail .camera-controls { flex-shrink:0; margin:0 auto; width:calc(100% - 48px); }
.touch-rail .camera-controls .camera-step-buttons { display:none; }
.touch-rail .camera-index { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:100%; gap:0; }
.touch-rail .camera-index button { min-width:0; padding-inline:4px; }

/* Tablet/narrow-desktop hero children are absolutely positioned. Keep an explicit
   height in their sticky grid: height:auto collapses the frame to zero. */
@media (min-width:800px) {
  .hero-pinned .hero-frame { height:100%; }
}

/* Reserve the visible fixed header before pinning any opening photograph. */
@media(max-width:1199px){
 .intro{padding-top:calc(var(--site-header-height,64px) + 12px)}
 .hero-pinned .intro{padding-top:var(--site-header-height,64px)}
 .hero-pinned .intro-sticky{top:var(--site-header-height,64px);height:calc(100svh - var(--site-header-height,64px));min-height:0}
}
@media(max-width:799px){.touch-motion .hero-photo{transform:none}}
/* One photographic print opens into a full-bleed scene on every fitted layout. */
.moment-immersive .moments{height:240svh;padding:0;background:#fff}
.moment-immersive .moments-sticky{position:sticky;top:var(--site-header-height,64px);height:calc(100svh - var(--site-header-height,64px));min-height:0;overflow:hidden;display:block;padding:0}
.moment-immersive .moment-frame{position:absolute;inset:0;width:100%;height:100%;border-radius:0;overflow:hidden;background:#131c25;transform:none;clip-path:inset(calc(var(--moment-vertical) + var(--photo-inset,0px)) calc(var(--moment-horizontal) + var(--photo-inset,0px)) round var(--moment-radius,3px))}
.moment-immersive .moment-frame>img{position:absolute;left:50%;top:50%;width:max(100vw,calc((100svh - var(--site-header-height,64px))*1.5));height:auto;max-width:none;aspect-ratio:3/2;object-fit:contain;transform:translate(-50%,-50%) scale(var(--moment-scale,1));will-change:transform}
.moment-immersive .moment-frame::after{display:none}
.moment-immersive .moment-shade{display:block;position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,18,29,.88),transparent 80%);opacity:var(--moment-shade,0)}
.moment-immersive .moment-copy{position:absolute;inset:auto 0 max(48px,10svh);width:min(76rem,calc(100% - 48px));max-width:none;margin-inline:auto;padding:0;background:transparent;color:#fff;opacity:var(--moment-text,0);transform:translate3d(0,var(--moment-text-y,28px),0)}
.moment-immersive .moments-sticky::after{content:'';position:absolute;z-index:2;left:var(--moment-horizontal);right:var(--moment-horizontal);top:var(--moment-vertical);bottom:var(--moment-vertical);border:12px solid transparent;border-image:url('/assets/paper-cotton-torn-v1.webp') 180/12px/0 stretch;opacity:var(--print-mat,1);pointer-events:none}
@media(min-width:800px){
 .moment-immersive .moment-side{display:block;position:absolute;z-index:3;top:50%;transform:translateY(-50%);max-width:calc((100vw - 300px)/2 - 56px);font-size:clamp(1.2rem,2.2vw,2.125rem);line-height:1.4;opacity:var(--moment-side,1);text-wrap:balance}
 .moment-immersive .moment-left{right:calc(50% + 174px)}
 .moment-immersive .moment-right{left:calc(50% + 174px)}
}
@media(max-width:799px){
 .moment-immersive .moments{height:270svh}
 .moment-immersive .moment-side{display:none}
 .moment-immersive .moment-copy h2{font-size:clamp(1.75rem,6.8vw,2.3rem);line-height:1.4}
 .moment-immersive .moment-copy p{font-size:1rem;line-height:1.65;margin-top:18px}
}

.moment-playing .header{transform:none;background:rgba(255,255,255,.98)}

/* Unfitted translations and accessibility settings retain the full photograph and copy. */
.moment-static .moments{height:auto;padding:64px 24px;background:#fff}
.moment-static .moments-sticky{position:relative;top:auto;height:auto;min-height:0;overflow:visible;display:block;padding:0}
.moment-static .moment-frame{position:relative;inset:auto;width:100%;height:auto;clip-path:none;transform:none;border-radius:24px;overflow:hidden;background:#131c25}
.moment-static .moment-frame>img{position:relative;inset:auto;width:100%;height:auto;max-width:100%;aspect-ratio:3/2;object-fit:contain;transform:none}
.moment-static .moment-copy{position:relative;inset:auto;width:100%;max-width:none;margin:0;padding:32px 24px;opacity:1;transform:none;background:#131c25;color:#fff}
.moment-static .moment-shade,.moment-static .moment-side,.moment-static .moment-frame::after,.moment-static .moments-sticky::after{display:none}

/* A portrait viewport keeps both people: the same print grows to full width,
   then the ink stage carries its caption without cropping either face. */
@media(max-width:799px){
 .moment-immersive .moment-frame>img{width:100vw;top:var(--moment-image-center,50%)}
 .moment-immersive .moment-copy{top:var(--moment-copy-top,60%);bottom:auto}
 .moment-immersive .moment-shade{display:none}
}

/* Reference structure: left phrase — small central window — right phrase.
   The window opens on the native scroll timeline while the two phrases move apart. */
.moment-immersive .moments-sticky::after{display:none}
.moment-immersive .moment-side{display:block;position:absolute;z-index:3;top:50%;width:calc((100vw - 2*var(--moment-window-half,80px))/2 - 64px);max-width:none;font-size:clamp(1.6rem,3.5vw,4.25rem);font-weight:700;line-height:1.35;letter-spacing:-.035em;word-break:normal;overflow-wrap:break-word;text-wrap:balance;opacity:var(--moment-side,1);filter:blur(var(--moment-side-blur,0px));will-change:transform,opacity}
.moment-immersive .moment-left{left:auto;right:calc(50% + var(--moment-window-half,80px) + 32px);text-align:right;transform:translate3d(calc(-1*var(--moment-side-push,0px)),-50%,0)}
.moment-immersive .moment-right{right:auto;left:calc(50% + var(--moment-window-half,80px) + 32px);text-align:left;transform:translate3d(var(--moment-side-push,0px),-50%,0)}
html[dir=rtl].moment-immersive .moment-left{left:auto;right:calc(50% + var(--moment-window-half,80px) + 32px)}
html[dir=rtl].moment-immersive .moment-right{right:auto;left:calc(50% + var(--moment-window-half,80px) + 32px)}
@media(max-width:799px){
 .moment-immersive .moment-side{display:block;width:calc((100vw - 2*var(--moment-window-half,40px))/2 - 28px);font-size:clamp(.95rem,4.2vw,1.3rem);line-height:1.5;letter-spacing:-.02em}
 .moment-immersive .moment-left,html[dir=rtl].moment-immersive .moment-left{right:calc(50% + var(--moment-window-half,40px) + 12px)}
 .moment-immersive .moment-right,html[dir=rtl].moment-immersive .moment-right{left:calc(50% + var(--moment-window-half,40px) + 12px)}
}

html:lang(ko).moment-immersive .moment-side{word-break:keep-all;overflow-wrap:normal}

@media(max-width:799px){
 .moment-immersive .moment-frame{background:transparent}
 .moment-immersive .moments-sticky::before{content:'';position:absolute;inset:0;background:#131c25;opacity:var(--moment-matte,0);pointer-events:none}
}

@media(max-width:799px){
 .moment-immersive .moment-frame{clip-path:inset(var(--moment-mobile-top,0px) var(--moment-horizontal) var(--moment-mobile-bottom,0px) var(--moment-horizontal) round var(--moment-radius,0px))}
}
