/* Toss Impact-inspired pacing with RESO colours and original content.
   Pretendard is self-hosted under OFL; Toss Product Sans is not bundled. */
:root { --font-sans:'RESO Pretendard','Apple SD Gothic Neo',system-ui,sans-serif; --ease-out:cubic-bezier(.16,1,.3,1); }
html { scroll-padding-top:100px; }
body,button,input,textarea,select,summary { font-family:var(--font-sans); }
body { line-height:1.7; letter-spacing:-.015em; }
main h1,main h2,main h3,main h4,.button,.nav-cta,.journey h3,.journal-teaser h2,.journal-hero h1 { font-family:var(--font-sans); }
main h1,main h2,.journal-hero h1 { font-weight:720; letter-spacing:-.035em; line-height:1.27; }
main h2,.home-doorways h2,.closing h2 { font-size:clamp(34px,4.4vw,56px); }
main h3 { font-weight:680; letter-spacing:-.025em; line-height:1.4; }
main p { line-height:1.8; }
.eyebrow { font:600 12px/1.5 var(--font-sans); letter-spacing:.12em; margin-bottom:26px; }
.section { padding:140px max(6%,calc((100% - 1120px)/2)); }
body > header { position:sticky; top:0; height:80px; min-height:0; z-index:30; padding:0 max(5%,calc((100% - 1200px)/2)); gap:24px; background:#fcf9f6ed; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); transition:box-shadow .3s; }
body > header.is-scrolled { box-shadow:0 1px 0 #35272b0d; }
.wordmark { font-size:33px; }
.wordmark span { margin-top:8px; }
body > header nav { border:0; padding:0; border-radius:0; background:none; gap:6px; }
body > header nav a { font:600 12px/1.4 var(--font-sans); letter-spacing:0; padding:12px; border-radius:10px; }
body > header nav a:hover,body > header nav a[aria-current=page] { background:var(--pink-soft); }
.nav-cta { font-size:13px; font-weight:600; padding:10px 16px; border:0; border-radius:12px; background:var(--pink-soft); }
.button,.campaign-cta { font-family:var(--font-sans); font-size:16px; font-weight:600; border-radius:16px; padding:18px 25px; }
.about-link { font-size:15px; font-weight:600; border:0; }
.impact-hero { display:grid; place-items:center; min-height:min(850px,calc(100svh - 80px)); padding:45px 24px 95px; border-radius:0; background:var(--pink-soft); text-align:center; }
.hero-atmosphere { position:absolute; inset:0; overflow:hidden; z-index:-1; pointer-events:none; }
.hero-atmosphere i { position:absolute; width:85vw; height:85vw; max-width:1100px; max-height:1100px; border-radius:50%; }
.hero-atmosphere i:nth-child(1) { top:-80%; left:-28%; background:radial-gradient(circle,#e4b8c3 0%,#efd5d980 40%,transparent 70%); }
.hero-atmosphere i:nth-child(2) { bottom:-100%; right:-15%; background:radial-gradient(circle,#dfb5c3 0%,#e6c3cd80 40%,transparent 70%); }
.hero-atmosphere i:nth-child(3) { top:-25%; left:25%; background:radial-gradient(circle,#fffaf0 0%,#fffaf080 35%,transparent 65%); }
.impact-hero .hero-copy { padding:20px 0; width:100%; }
.impact-hero .eyebrow { font:600 12px/1.5 var(--font-sans); letter-spacing:.18em; margin-bottom:30px; color:var(--pink-deep); }
.impact-hero h1 { font-size:clamp(44px,6.2vw,84px); font-weight:760; letter-spacing:-.04em; line-height:1.2; }
.impact-hero h1 em { color:var(--pink-deep); }
.impact-hero h1 em::after { display:none; }
.impact-hero .intro { font-size:clamp(17px,1.8vw,22px); font-weight:450; line-height:1.65; margin:30px auto 32px; max-width:none; color:#705c64; }
.hero-scroll { position:absolute; bottom:26px; display:flex; flex-direction:column; align-items:center; gap:2px; font-size:12px; color:#765d66; }
.hero-scroll > span:last-child { font-size:25px; }
.home-moment { padding-bottom:80px; }
.moment-heading { text-align:center; margin:20px auto 64px; }
.moment-heading > p:last-child { font-size:20px; color:var(--muted); margin:26px 0 0; }
.moment-scene { position:relative; margin:0; height:530px; overflow:hidden; border-radius:32px; isolation:isolate; }
.moment-scene::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 35%,#271b1db3); z-index:1; }
.moment-scene > img { width:100%; height:100%; object-fit:cover; object-position:50% 58%; transform:scale(var(--scene-scale,1.06)); }
.moment-scene figcaption { position:absolute; inset:auto 48px 42px; z-index:2; color:white; display:grid; gap:16px; }
.moment-scene figcaption > span { font-size:12px; letter-spacing:.07em; }
.moment-scene strong { font-size:clamp(25px,3vw,38px); line-height:1.4; letter-spacing:-.025em; font-weight:650; }
.home-doorways { padding-top:80px; }
.home-doorways > .eyebrow,.home-doorways > h2 { text-align:center; }
.brand-cards { gap:26px; margin-top:64px; }
.brand-cards article { padding:32px; border:0; background:var(--pink-soft); border-radius:28px; overflow:hidden; }
.home-doorways .brand-cards article { background:transparent; padding:0 0 20px; border-radius:0; }
.doorway-photo { width:100%; height:230px; border-radius:24px; overflow:hidden; margin-bottom:26px; }
.doorway-photo img { width:100%; height:100%; object-fit:cover; }
.brand-cards article > span { font-size:11px; font-weight:600; letter-spacing:.07em; }
.brand-cards h3 { font-size:26px; margin:14px 0; font-weight:700; }
.brand-cards p { font-size:17px; line-height:1.75; }
.brand-cards .about-link { font-size:15px; }
.upcoming-invitations { border-radius:0; margin:0; padding:130px max(6%,calc((100% - 1120px)/2)); }
.invitation-heading { margin-bottom:52px; }
.resume-feature { border-radius:32px; }
.resume-feature h3 { font-weight:750; letter-spacing:-.04em; }
.campaign-description { font-size:17px; }
.campaign-kicker { font-family:var(--font-sans); }
.scent-preview { border:0; padding:32px; }
.scent-preview h3 { font-size:26px; font-weight:700; }
.scent-preview p:last-child { font-size:16px; }
.journal-teaser { padding-top:140px; padding-bottom:140px; gap:48px; }
.journal-teaser h2 { font-size:clamp(32px,4vw,52px); font-weight:720; letter-spacing:-.03em; }
.journal-teaser h2 span { font-family:var(--font-sans); font-size:17px; }
.journal-teaser p:not(.eyebrow) { font-size:18px; line-height:1.8; }
.closing { margin:0; border-radius:0; padding:125px 24px; }
.closing-brand { font-size:72px; margin-bottom:32px; }
.closing h2 { font-weight:730; line-height:1.3; }
.closing .button { margin-top:30px; }
.closing > p:last-child { font-size:16px; }
.closing::before,.closing::after { opacity:.45; }
footer { padding:64px max(6%,calc((100% - 1120px)/2)); }
/* Shared typography and spacing on existing secondary pages and editors. */
.about-hero,.journal-hero { border-radius:0; padding-top:110px; padding-bottom:110px; }
.about-hero { padding-left:max(6%,calc((100% - 1120px)/2)); padding-right:47%; }
.about-hero h1 { font-size:clamp(36px,4.4vw,62px); font-weight:720; line-height:1.27; }
.about-hero .about-deck,.journal-hero > p:not(.eyebrow) { font-size:19px; line-height:1.8; }
.about-brand-photo img { border-radius:28px; }
.section-heading { gap:32px; margin-bottom:56px; }
.section-heading > p,.story-content p,.journey article > p:last-of-type { font-size:18px; }
.session { border:0; background:var(--pink-soft); padding:14px 14px 26px; }
.session h3 { font-size:22px; font-weight:700; }
.session p { font-size:16px; line-height:1.7; }
.session-meta { font-size:11px; }
.filters button { font-size:14px; }
.journey h3 { font-weight:700; }
.faq-list summary { font-size:18px; font-weight:600; }
.faq-list p { font-size:16px; }
.question h2 { font-size:clamp(28px,3.5vw,44px); }
.journal-hero h1 { font-size:clamp(40px,6vw,80px); }
@media (max-width:1100px) {
  body > header { gap:14px; }
  body > header nav a { padding:10px 9px; font-size:11px; }
  .nav-cta { font-size:12px; }
  .brand-cards h3 { font-size:23px; }
}
@media (max-width:900px) {
  html { scroll-padding-top:136px; }
  body > header { height:auto; padding:17px 5% 10px; gap:15px; }
  body > header nav { order:3; width:100%; justify-content:space-between; gap:0; }
  body > header nav a { padding:9px 12px; }
  .impact-hero { min-height:660px; }
  .section,.upcoming-invitations { padding:100px 6%; }
  .home-moment { padding-bottom:40px; }
  .home-doorways { padding-top:65px; }
  .brand-cards { gap:20px; }
  .doorway-photo { height:190px; }
  .about-hero { padding-right:6%; }
  .about-brand-photo { max-width:none; }
}
@media (max-width:650px) {
  html { scroll-padding-top:120px; }
  body > header { padding:14px 5% 8px; gap:10px; }
  .wordmark { font-size:29px; }
  .wordmark span { font-size:7px; }
  body > header nav a { font-size:10px; padding:9px 4px; }
  .nav-cta { font-size:12px; padding:9px 13px; }
  .section,.upcoming-invitations { padding:84px 6%; }
  main h2,.home-doorways h2,.closing h2 { font-size:clamp(29px,8vw,38px); line-height:1.35; }
  .eyebrow { font-size:10px; margin-bottom:20px; }
  .impact-hero { min-height:max(590px,calc(100svh - 118px)); padding:55px 6% 100px; }
  .impact-hero .hero-copy { padding:0; }
  .impact-hero h1 { font-size:clamp(35px,9.8vw,58px); line-height:1.26; letter-spacing:-.045em; }
  .impact-hero .eyebrow { font-size:10px; margin-bottom:28px; }
  .impact-hero .intro { font-size:17px; margin:25px auto 28px; }
  .impact-hero .intro br { display:initial; }
  .impact-hero .button { font-size:15px; padding:16px 22px; gap:28px; }
  .hero-atmosphere i { width:160vw; height:160vw; }
  .hero-atmosphere i:nth-child(1) { top:-25%; left:-100%; }
  .hero-atmosphere i:nth-child(2) { bottom:-35%; right:-90%; }
  .hero-atmosphere i:nth-child(3) { top:-15%; left:0; }
  .home-moment { padding-bottom:35px; }
  .moment-heading { margin:0 0 38px; }
  .moment-heading > p:last-child { font-size:16px; }
  .moment-scene { height:420px; border-radius:24px; }
  .moment-scene figcaption { inset:auto 24px 28px; gap:12px; }
  .moment-scene figcaption > span { font-size:10px; }
  .moment-scene strong { font-size:24px; }
  .home-doorways { padding-top:65px; }
  .brand-cards { margin-top:42px; gap:38px; }
  .doorway-photo { height:245px; margin-bottom:23px; }
  .brand-cards h3 { font-size:25px; }
  .brand-cards p { font-size:16px; }
  .invitation-heading { gap:24px; margin-bottom:34px; }
  .resume-feature-copy { padding:32px 24px; }
  .resume-feature h3 { font-size:48px; }
  .campaign-description { font-size:15px; }
  .campaign-cta { font-size:13px; padding:16px; }
  .scent-preview { padding:25px 20px; gap:15px; }
  .scent-preview h3 { font-size:21px; }
  .scent-preview p:last-child { font-size:14px; }
  .scent-number { display:none; }
  .journal-teaser { gap:26px; }
  .journal-teaser p:not(.eyebrow) { font-size:16px; }
  .closing { padding:90px 6%; }
  .closing > p:last-child { font-size:14px; }
  .about-hero h1 { font-size:clamp(32px,8.5vw,42px); }
  .about-hero .about-deck { font-size:17px; }
  .section-heading { margin-bottom:35px; }
  .section-heading > p { font-size:16px; }
  .session-grid { grid-template-columns:1fr; gap:24px; }
  .session { padding:12px 12px 24px; }
  .session h3 { font-size:23px; }
  .session p { font-size:16px; }
  .session-meta { font-size:11px; }
  .faq-list summary { font-size:16px; }
  .faq-list p { font-size:15px; }
  footer { padding:45px 6%; }
}
@media (max-width:360px) {
  body > header nav a { padding-left:2px; padding-right:2px; font-size:9.5px; }
}
/* Live liquid surface; the original CSS atmosphere remains the fallback. */
.hero-fluid { position:absolute; inset:-16px; width:calc(100% + 32px); height:calc(100% + 32px); filter:blur(8px); display:block; opacity:0; transition:opacity 1.2s ease; }
.is-fluid-ready .hero-fluid { opacity:1; }
.is-fluid-ready .hero-atmosphere i { visibility:hidden; animation:none; }
.impact-hero.is-fluid-ready .hero-copy { text-shadow:0 2px 24px #fff6; }
.impact-hero.is-fluid-ready .intro { color:#60454f; }
.fluid-toggle { position:absolute; right:30px; bottom:30px; z-index:2; display:inline-flex; align-items:center; gap:8px; padding:10px 13px; border:1px solid #ffffff70; border-radius:30px; background:#fff9; color:#60454f; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); font:500 11px/1.4 var(--font-sans); }
.fluid-toggle[hidden] { display:none; }
.fluid-toggle svg { fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.fluid-toggle .play-icon,.fluid-toggle[aria-pressed=true] .pause-icon { display:none; }
.fluid-toggle[aria-pressed=true] .play-icon { display:block; }
.fluid-toggle:hover { background:#fff; }
@media (max-width:650px) {
  .fluid-toggle { right:16px; bottom:22px; padding:9px; }
  .fluid-toggle span { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .hero-fluid { transition:none; }
  .fluid-toggle { display:none; }
}
.impact-hero[data-fluid-state=fallback] .hero-atmosphere i { animation:none; }
@media (max-width:650px) {
  .fluid-toggle { min-width:44px; min-height:44px; justify-content:center; }
}
/* The liquid arrives first; the message follows as the opening settles. */
@media (prefers-reduced-motion:no-preference) {
  .impact-hero.is-fluid-ready .hero-copy > .eyebrow { animation-delay:.45s; }
  .impact-hero.is-fluid-ready .hero-copy > h1 { animation-delay:.75s; }
  .impact-hero.is-fluid-ready .hero-copy > .intro { animation-delay:1.05s; }
  .impact-hero.is-fluid-ready .hero-copy > .button { animation-delay:1.3s; }
}