@font-face{font-family:Pretendard;src:url('assets/PretendardVariable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
:root{--ink:#17171b;--muted:#75747a;--orange:#ff693e;--coral:#ff7864;--cream:#fffaf7;--line:#f1e8e4}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;overflow-x:hidden;background:#fff;color:var(--ink);font-family:Pretendard,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:3px solid var(--orange);outline-offset:4px}
.wrap{width:min(1220px,calc(100% - 64px));margin-inline:auto}
h1,h2,h3,p{margin:0;word-break:keep-all}
.site-header{position:relative;z-index:20;background:rgba(255,255,255,.96);border-bottom:1px solid rgba(27,21,20,.04)}
.header-inner{min-height:76px;display:flex;align-items:center;gap:64px}
.brand{display:inline-flex;align-items:center;font-size:27px;font-weight:900;letter-spacing:-.065em;white-space:nowrap}
.main-nav{display:flex;gap:28px;align-items:center;color:#8b8990;font-size:13px;font-weight:700}
.main-nav a{transition:color .25s}.main-nav a:hover,.main-nav a[aria-current]{color:#252329}
.header-action{display:inline-flex;align-items:center;gap:15px;margin-left:auto;padding:11px 19px;border-radius:999px;background:#131318;color:white;font-size:12px;font-weight:760;white-space:nowrap;transition:background .25s,transform .25s}
.header-action:hover{background:#4021c5;transform:translateY(-2px)}
.hero{position:relative;overflow:hidden;background:radial-gradient(ellipse at 71% 43%,#fff2ec 0%,#fff9f6 53%,#fffdfa 100%)}
.hero-grid{display:grid;grid-template-columns:40% 60%;align-items:center;min-height:700px}
.hero-copy{position:relative;z-index:4;padding:72px 0 65px}
.hero h1{font-size:clamp(43px,4.1vw,63px);line-height:1.13;letter-spacing:-.075em;font-weight:900}
.hero h1 em{position:relative;display:inline-block;font-style:normal;color:var(--orange);white-space:nowrap}
.hero-copy>p{margin-top:24px;color:#747077;font-size:16px;line-height:1.72}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:17px;min-height:50px;padding:0 23px;border-radius:999px;font-size:14px;font-weight:780;white-space:nowrap;transition:background .27s,box-shadow .27s,transform .35s cubic-bezier(.2,.8,.2,1)}
.button span{font-size:18px;font-weight:500}
.button:hover{transform:translateY(-4px)}
.button-dark{background:#15151a;color:#fff;box-shadow:0 12px 21px rgba(27,21,24,.16)}
.button-dark:hover{background:#4021c5;box-shadow:0 0 0 4px rgba(129,104,240,.12),0 19px 27px rgba(59,35,142,.28)}
.button-home{min-height:54px;background:#111116;color:#fff;box-shadow:0 5px 0 #29252f,0 21px 31px rgba(26,20,37,.26)}
.button-home:hover,.button-home:focus-visible{background:#4021c5;box-shadow:0 5px 0 #271764,0 28px 37px rgba(59,35,142,.34),0 0 0 4px rgba(129,104,240,.12)}
.hero-art{position:relative;height:660px;isolation:isolate}
.hero-glow{position:absolute;z-index:-2;inset:8% -8% 5%;border-radius:50%;background:radial-gradient(circle,rgba(255,205,183,.64),rgba(255,230,217,.3) 43%,transparent 70%);filter:blur(20px)}
.hero-ribbon{position:absolute;z-index:0;top:29%;left:0;width:101%;height:51%;border:18px solid rgba(255,158,121,.23);border-left-color:rgba(255,190,153,.16);border-right-color:rgba(255,118,78,.28);border-radius:50%;transform:rotate(-17deg);filter:blur(1px);pointer-events:none}
.hero-phone-zone{position:absolute;z-index:2;left:21%;bottom:1%;width:51%}
.hero-phone{display:block;width:100%;height:auto;filter:none;transition:translate 1.25s cubic-bezier(.16,.78,.18,1)}
.hero-phone{clip-path:polygon(18% 4%,68% 4%,79% 5%,85% 10%,88% 20%,91% 56%,94% 89%,88% 96%,76% 98%,30% 98%,22% 96%,18% 90%,14% 56%,9% 20%,11% 10%)}
.hero-phone-zone:hover .hero-phone{translate:0 -20px}
.floating-tem{position:absolute;z-index:3;display:block;width:27%;height:auto;filter:none;transform:translate3d(var(--px,0px),var(--py,0px),0);transition:transform 1.05s cubic-bezier(.16,.78,.18,1)}
.floating-tem:hover{transform:translate3d(var(--px,0px),calc(var(--py,0px) - 22px),0)}
.tem-coffee{top:7%;left:1%;width:28%}.tem-gallery{top:4%;right:0;width:28%}.tem-dessert{top:40%;right:-1%;width:26%}
.tem-coffee{clip-path:inset(0 0 4%)}
.hero-qcard{position:absolute;z-index:5;right:0;bottom:0;width:48%;transform:translate3d(var(--px,0px),var(--py,0px),0);transition:transform .8s cubic-bezier(.18,.85,.23,1)}
.hero-qcard:hover{transform:translate3d(var(--px,0px),calc(var(--py,0px) - 12px),0)}
.hero-qcard>img{display:block;width:100%;height:auto;filter:none}
.hero-qcard>img{clip-path:inset(5% 5% 7% 4% round 26px)}
.hero-qcard .heart{position:absolute;z-index:2;top:9.5%;right:9.5%;display:grid;place-items:center;width:11%;aspect-ratio:1;border:0;border-radius:50%;background:#ffe4df;color:#fff;font:700 clamp(16px,2vw,27px)/1 sans-serif;cursor:pointer;transition:color .25s,transform .3s}
.hero-qcard .heart:hover,.hero-qcard .heart:focus-visible{color:#f14149;transform:scale(1.1)}
.hero-qcard .heart:focus-visible,.qcard-link:focus-visible{outline:3px solid #f14149;outline-offset:2px}
.qcard-link{position:absolute;z-index:2;left:9.4%;right:9.4%;bottom:10.9%;height:16.3%;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:99px;background:linear-gradient(100deg,#ffad74,#ff6966);color:#fff;font-size:clamp(8px,.95vw,12px);font-weight:800;white-space:nowrap;cursor:pointer;transition:filter .3s,box-shadow .3s}
.qcard-link span{font-size:1.3em;font-weight:500}
.qcard-link:hover,.qcard-link:focus-visible{filter:brightness(1.05);box-shadow:0 0 18px 5px rgba(255,128,85,.66),0 10px 22px rgba(255,103,75,.32)}
[data-photo] svg{display:block;width:100%;height:100%}
.section-space{padding:115px 0}
.section-heading{text-align:center}
.eyebrow{display:block;color:var(--orange);font-size:14px;font-weight:800}
.section-heading h2,.experiences-head h2{margin-top:12px;font-size:clamp(31px,3.2vw,45px);line-height:1.22;letter-spacing:-.065em;font-weight:880}
.section-heading p{margin-top:15px;color:#77737a;font-size:16px;line-height:1.65}
.journey{background:#fff}
.journey-story{display:grid;grid-template-columns:25fr 40fr 35fr;min-height:412px;margin-top:54px;border:1px solid #f4ece8;border-radius:30px;background:#fff;box-shadow:0 22px 55px rgba(67,45,39,.07);overflow:hidden;isolation:isolate}
.journey-stage{position:relative;min-width:0;padding:27px 22px 25px}
.journey-stage+.journey-stage{border-left:1px solid #f4ece8}
.journey-create{background:radial-gradient(ellipse at 50% 68%,#fff0e9 0%,#fffaf8 48%,#fff 82%)}
.journey-head{display:flex;gap:12px;align-items:flex-start}
.journey-head>span{display:grid;place-items:center;flex:none;width:45px;height:45px;border-radius:50%;background:#fff0e9;color:#f87951;font-size:15px;font-weight:850}
.journey-create .journey-head>span{background:linear-gradient(135deg,#ffad77,#ff6b64);color:#fff;box-shadow:0 7px 15px rgba(255,111,81,.2)}
.journey-head h3{margin:2px 0 6px;font-size:22px;font-weight:850;letter-spacing:-.05em}
.journey-head p{max-width:265px;color:#8a8589;font-size:12px;line-height:1.48}
.journey-find{display:flex;gap:9px;align-items:center;margin-top:40px}
.find-photo{width:48%;height:190px;border-radius:15px;overflow:hidden}
.find-photo img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 1.3s cubic-bezier(.16,.78,.18,1)}
.find-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;width:52%}
.find-chips span{display:grid;place-items:center;height:35px;border-radius:99px;background:#fff;box-shadow:0 4px 14px rgba(110,74,55,.1);font-size:11px;font-weight:750;cursor:default;transition:background .28s,color .28s,translate .45s cubic-bezier(.16,.78,.18,1),box-shadow .28s}
.find-chips span:hover{background:#17171b;color:#fff;translate:0 -4px;box-shadow:0 11px 19px rgba(30,25,24,.17)}
.journey-combine-scene{position:relative;height:255px;margin-top:19px;isolation:isolate}
.journey-threads{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.journey-threads path{fill:none;stroke:#ff997d;stroke-width:2;stroke-linecap:round;stroke-dasharray:210;stroke-dashoffset:0;opacity:.6}
.journey-token{position:absolute;z-index:2;width:76px;padding:5px 5px 4px;border:1px solid #f6e9e2;border-radius:13px;background:#fff;box-shadow:0 10px 20px rgba(105,55,40,.11);text-align:center}
.journey-token>div{height:57px;overflow:hidden;border-radius:8px}
.journey-token span{display:block;padding-top:3px;font-size:10px;font-weight:770}
.token-coffee{top:2%;left:9%}.token-gallery{bottom:9%;left:7%}.token-dessert{top:17%;right:6%}
.journey-qplus{position:absolute;z-index:3;top:54%;left:50%;display:block;width:120px;height:120px;transform:translate(-50%,-50%)}
.journey-qplus img,.journey-morph img{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
.journey-combine-caption{position:absolute;left:50%;bottom:1%;color:#54352e;font-size:12px;font-weight:800;transform:translateX(-50%)}
.journey-experience{position:relative;height:225px;margin-top:37px;border-radius:18px;overflow:hidden;box-shadow:0 13px 26px rgba(56,35,29,.14)}
.journey-experience>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;user-select:none;-webkit-user-drag:none}
.journey-experience::after{content:'';position:absolute;inset:48% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.56))}
.journey-experience strong{position:absolute;z-index:1;left:17px;right:17px;bottom:17px;color:#fff;font-size:clamp(13px,1.24vw,18px);line-height:1.25;text-wrap:balance}
.journey-line{position:relative;height:66px;margin-top:24px}
.journey-line-track{position:absolute;top:11px;left:12.5%;right:17.5%;height:2px;background:#f1ddd4}
.journey-line-fill{display:block;width:0;height:100%;background:linear-gradient(90deg,#ffad73,#ff6c5d);box-shadow:0 0 9px rgba(255,112,82,.3);transition:width 1.35s cubic-bezier(.42,0,.2,1)}
.journey-story.is-active+.journey-line .journey-line-fill{width:46%}
.journey-story.is-finished+.journey-line .journey-line-fill{width:100%;transition-duration:.72s}
.journey-line-stop{position:absolute;top:0;display:grid;justify-items:center;gap:7px;transform:translateX(-50%)}
.journey-line-stop i{display:block;width:22px;height:22px;border:5px solid #fff;border-radius:50%;background:#f0ddd4;box-shadow:0 0 0 2px #f0ddd4;transition:background .25s,box-shadow .25s}
.journey-line-stop b{color:#998982;font-size:11px;font-weight:750;transition:color .25s}
.stop-discover{left:12.5%}.stop-create{left:45%}.stop-live{left:82.5%}
.journey-story.is-active+.journey-line .stop-discover i,.journey-story.is-active+.journey-line .stop-create i,.journey-story.is-finished+.journey-line .stop-live i{background:#ff7958;box-shadow:0 0 0 2px #ff7958}
.journey-story.is-active+.journey-line .stop-discover b,.journey-story.is-active+.journey-line .stop-create b,.journey-story.is-finished+.journey-line .stop-live b{color:#d36148}
.journey-story.is-active+.journey-line .stop-create i,.journey-story.is-active+.journey-line .stop-create b{transition-delay:1.26s}
.journey-story.is-finished+.journey-line .stop-create i,.journey-story.is-finished+.journey-line .stop-create b{transition-delay:0s}
.journey-story.is-finished+.journey-line .stop-live i,.journey-story.is-finished+.journey-line .stop-live b{transition-delay:.66s}
.journey-morph{position:fixed;z-index:90;display:block;width:120px;height:120px;pointer-events:none}
.combine{background:radial-gradient(ellipse at 50% 55%,#fff6f0 0%,#fffaf7 59%,#fff 100%)}
.combine-flow{display:grid;grid-template-columns:minmax(0,1.6fr) 48px minmax(0,.85fr);align-items:center;gap:25px;margin-top:45px;transition:opacity .6s,transform .85s cubic-bezier(.16,.78,.18,1)}
.tem-selection{display:flex;align-items:center;justify-content:space-between;gap:12px}
.selection-item{position:relative;flex:1;min-width:0;padding:7px 7px 13px;border-radius:18px;background:#fff;text-align:center}
.selection-item>div{height:155px;border-radius:13px;overflow:hidden}
.selection-item strong,.selection-item small{display:block}
.selection-item strong{margin-top:9px;font-size:14px}.selection-item small{margin-top:2px;color:#aaa4a6;font-size:10px}
.selection-check{position:absolute;z-index:1;top:0;right:0;display:grid;place-items:center;width:31px;height:31px;border:3px solid white;border-radius:50%;background:var(--orange);color:#fff;font-size:17px}
.flow-plus,.flow-arrow{flex:none;color:#a38173;font-size:29px;font-weight:350}.flow-arrow{position:relative;display:grid;place-items:center;text-align:center;color:#bd674b;font-size:42px}
.flow-arrow::before{content:'';position:absolute;z-index:-1;left:0;right:0;top:50%;height:2px;background:linear-gradient(90deg,transparent,#ff8972,transparent);opacity:0;transform:scaleX(0);transform-origin:left}
.result-card{overflow:hidden;border-radius:22px;background:#fff}
.result-image{position:relative;height:142px;overflow:hidden}
.result-image>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 54%}
.result-image>span{position:absolute;top:11px;right:12px;color:#fff;font-size:28px;text-shadow:0 2px 6px rgba(0,0,0,.3);transition:color .25s,transform .25s,text-shadow .25s}
.result-image>span:hover{color:transparent;transform:scale(1.15);text-shadow:none}
.combine-flow.combine-complete .result-image>span{color:transparent;text-shadow:none}
.combine-flow.combine-complete .result-image>span::after{opacity:1;transform:translate(-50%,-50%) scale(1)}
.result-body{padding:14px 17px 16px}
.result-body h3{font-size:24px;letter-spacing:-.06em}.result-body>strong{display:block;margin-top:1px;font-size:13px}
.result-mini{display:flex;gap:5px;margin-top:11px}.result-mini>div{width:32px;height:32px;border-radius:6px;overflow:hidden}
.result-body p{display:flex;justify-content:space-between;margin-top:11px;color:#9a9393;font-size:10px}
.hero-art,.combine-flow,.start-visual{user-select:none;-webkit-user-select:none;cursor:default}
.hero-art img,.combine-flow img,.start-visual img{user-select:none;-webkit-user-drag:none}
.combine-flow .selection-item,.combine-flow .result-card{cursor:default}
.js .combine-flow .selection-check{opacity:0;transform:scale(.7)}
.js .combine-flow:not(.combine-active) .result-card{opacity:.72;scale:.96}
.js .combine-flow:not(.combine-active) .result-mini>div{opacity:.16;filter:grayscale(1)}
.js .combine-flow:not(.combine-active) .result-body h3{opacity:.5;transform:translateY(6px)}
.js .combine-flow.is-past{opacity:0;transform:translateY(-32px);pointer-events:none}
.js .combine-flow.combine-active .selection-check{animation:check-pop .3s cubic-bezier(.18,1.5,.3,1) both}
.js .combine-flow.combine-active .selection-item{animation:item-tap .3s ease-out both}
.js .combine-flow.combine-active .selection-item:nth-child(3),.js .combine-flow.combine-active .selection-item:nth-child(3) .selection-check{animation-delay:.15s}
.js .combine-flow.combine-active .selection-item:nth-child(5),.js .combine-flow.combine-active .selection-item:nth-child(5) .selection-check{animation-delay:.3s}
.js .combine-flow.combine-active .flow-plus{animation:plus-pulse .36s cubic-bezier(.2,1.3,.3,1) both}
.js .combine-flow.combine-active .flow-plus:nth-child(2){animation-delay:.22s}
.js .combine-flow.combine-active .flow-plus:nth-child(4){animation-delay:.37s}
.js .combine-flow.combine-active .flow-arrow{animation:arrow-enter .35s ease-out .9s both}
.js .combine-flow.combine-active .flow-arrow::before{animation:arrow-sweep .5s ease-out .9s both}
.js .combine-flow.combine-active .result-card{animation:result-join .4s cubic-bezier(.2,1,.25,1) 1.15s both}
.js .combine-flow.combine-active .result-body h3{animation:title-arrive .36s ease-out 1.16s both}
.js .combine-flow .result-mini>div:not(.arrived){opacity:.16;filter:grayscale(1)}
.js .combine-flow .result-mini>div.arrived{animation:mini-arrive .25s cubic-bezier(.18,1.45,.3,1) both}
@keyframes check-pop{0%{opacity:0;transform:scale(.7)}65%{opacity:1;transform:scale(1.17)}100%{opacity:1;transform:scale(1)}}
@keyframes item-tap{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}
@keyframes plus-pulse{0%{opacity:.5;transform:scale(.7)}60%{opacity:1;transform:scale(1.15)}100%{opacity:1;transform:scale(1)}}
@keyframes arrow-enter{0%{opacity:.3;transform:translateX(-12px) scale(.88)}100%{opacity:1;transform:translateX(0) scale(1)}}
@keyframes arrow-sweep{0%{opacity:0;transform:scaleX(0)}45%{opacity:.8}100%{opacity:0;transform:scaleX(1)}}
@keyframes result-join{0%{opacity:.72;scale:.96;box-shadow:0 0 0 rgba(255,122,95,0)}60%{opacity:1;scale:1.025;box-shadow:0 0 28px rgba(255,122,95,.17)}100%{opacity:1;scale:1;box-shadow:0 0 0 rgba(255,122,95,0)}}
@keyframes title-arrive{0%{opacity:.5;transform:translateY(6px)}100%{opacity:1;transform:translateY(0)}}
@keyframes mini-arrive{0%{opacity:.35;filter:grayscale(.5);transform:scale(.8)}55%{opacity:1;filter:none;transform:scale(1.08)}100%{opacity:1;filter:none;transform:scale(1)}}
.flight-layer{position:fixed;z-index:100;inset:0;pointer-events:none;overflow:hidden}
.flight-layer>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.flight-thumb{position:absolute;top:0;left:0;width:88px;height:88px;overflow:hidden;border:2px solid rgba(255,255,255,.95);border-radius:14px;background:#fff;will-change:transform,opacity,filter}
.flight-thumb [data-photo],.flight-thumb [data-photo] svg{display:block;width:100%;height:100%}
.experiences{background:#fff}
.experiences-head{display:flex;align-items:end;justify-content:space-between;gap:20px}
.experiences-head>a{padding:11px 16px;border:1px solid #f0d8d0;border-radius:99px;color:#5b3c36;font-size:12px;font-weight:740;white-space:nowrap;transition:background .25s}
.experiences-head>a:hover{background:#fff1eb}
.experience-viewport{overflow-x:auto;overflow-y:hidden;margin-top:26px;padding:16px 1px 24px;scrollbar-width:none;scroll-behavior:smooth;scroll-snap-type:x mandatory;overscroll-behavior-inline:contain}
.experience-viewport::-webkit-scrollbar{display:none}
.experience-grid{display:flex;gap:17px;width:max-content;max-width:none}
.experience-card{display:block;flex:0 0 calc((min(1220px, 100vw - 64px) - 51px)/4);min-width:0;overflow:hidden;border:1px solid #f4eeeb;border-radius:19px;background:#fff;cursor:pointer;user-select:none;scroll-snap-align:center;transition:transform 1s cubic-bezier(.16,.78,.18,1),opacity .65s}
.experience-card:hover,.experience-card:focus-visible{transform:translateY(-15px) scale(1.012)}
.experience-image{position:relative;height:171px;overflow:hidden}
.experience-image>span{position:absolute;right:12px;top:8px;color:#fff;font-size:29px;text-shadow:0 3px 8px rgba(0,0,0,.35);transition:color .25s,transform .25s,text-shadow .25s}
.experience-image>span:hover,.experience-card:focus-visible .experience-image>span{color:transparent;transform:scale(1.15);text-shadow:none}
.experience-content{padding:13px}
.experience-content>div{display:flex;flex-wrap:wrap;gap:4px;margin-top:-23px;position:relative;z-index:1}
.experience-content>div span{padding:5px 8px;border-radius:99px;background:#fff;box-shadow:0 3px 7px rgba(20,20,25,.09);font-size:9px;font-weight:770}
.experience-content h3{margin-top:13px;font-size:16px;letter-spacing:-.04em}
.experience-content p{display:flex;justify-content:space-between;gap:5px;margin-top:12px;color:#e97551;font-size:10px}
.experience-content p b{color:#aea8a9;font-weight:520}
.start{padding:0 0 90px}
.start-panel{position:relative;display:grid;grid-template-columns:48% 52%;min-height:410px;overflow:hidden;border-radius:28px;background:radial-gradient(circle at 76% 70%,#ffd0c4 0%,#ffddd2 40%,#fff3ee 81%);}
.start-copy{position:relative;z-index:2;padding:62px 0 58px 62px}
.start-copy>span{color:#ef6b44;font-size:13px;font-weight:780}
.start-copy h2{margin-top:14px;font-size:clamp(27px,2.9vw,42px);line-height:1.2;letter-spacing:-.065em;font-weight:890}
.start-copy h2 em{color:#ff5533;font-style:normal}
.start-copy p{max-width:400px;margin-top:19px;color:#786e6d;font-size:15px;line-height:1.6}
.start-copy .button{margin-top:24px}
.start-visual{position:relative;min-height:410px}
.start-bubble{position:absolute;z-index:3;display:grid;place-items:center;width:56px;height:56px;border-radius:18px;background:rgba(255,255,255,.92);box-shadow:0 8px 24px rgba(82,54,50,.13);font-size:29px}
.bubble-one{top:43%;left:8%;background:#ff9b87;color:#fff;transform:rotate(-14deg)}.bubble-one:hover{background:#fff0ec;color:transparent}
.bubble-two{top:67%;left:16%;background:transparent;box-shadow:none}
.bubble-two img{position:absolute;top:50%;left:50%;display:block;width:112px;max-width:none;height:auto;transform:translate(-50%,-50%);filter:drop-shadow(0 6px 12px rgba(120,72,184,.16));transition:filter .3s,transform .45s}
.bubble-two:hover img{filter:hue-rotate(147deg) saturate(2) brightness(1.25) drop-shadow(0 0 12px rgba(255,203,47,.88));animation:star-twinkle .72s ease-out}
.bubble-two::before,.bubble-two::after{position:absolute;z-index:2;color:#ffd43b;opacity:0;pointer-events:none;text-shadow:0 0 9px rgba(255,210,55,.9)}
.bubble-two::before{content:'✦';top:-12px;right:-12px;font-size:19px}.bubble-two::after{content:'✦';bottom:-12px;left:-10px;font-size:12px}
.bubble-two:hover::before{animation:star-spark .7s ease-out}.bubble-two:hover::after{animation:star-spark .7s ease-out .12s}
@keyframes star-twinkle{0%,100%{transform:translate(-50%,-50%) scale(1)}42%{transform:translate(-50%,-50%) scale(1.16) rotate(-8deg)}70%{transform:translate(-50%,-50%) scale(.98) rotate(4deg)}}
@keyframes star-spark{0%{opacity:0;transform:scale(.25) rotate(-25deg)}42%{opacity:1;transform:scale(1.25) rotate(10deg)}100%{opacity:0;transform:scale(.45) rotate(32deg)}}
.app-phone{position:absolute;bottom:-80px;width:245px;height:450px;padding:9px;border:3px solid #28282b;border-radius:37px;background:#18181b;box-shadow:0 21px 35px rgba(60,31,30,.22);overflow:hidden}
.phone-front{z-index:2;left:24%;transform:rotate(-11deg)}
.phone-back{z-index:1;right:1%;bottom:-95px;transform:rotate(14deg) scale(.85)}
.phone-screen{height:100%;padding:13px 14px;border-radius:26px;background:#fff;overflow:hidden}
.phone-bar{width:58px;height:5px;margin:0 auto 17px;border-radius:99px;background:#222}
.phone-screen>strong{display:flex;justify-content:space-between;font-size:24px;letter-spacing:-.055em}
.phone-screen>strong span{position:relative;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#ff9b87;color:#fff;font-size:20px;line-height:1;transition:background .25s,color .25s}
.phone-screen>strong span:hover{background:#fff0ec;color:transparent}
.heart::after,.result-image>span::after,.experience-image>span::after,.bubble-one::after,.phone-screen>strong span::after{content:'♥';position:absolute;top:50%;left:50%;color:#ed3348;opacity:0;transform:translate(-50%,-50%) scale(.65);transition:opacity .2s,transform .2s;text-shadow:0 1px 5px rgba(255,255,255,.7);pointer-events:none}
.heart:hover::after,.result-image>span:hover::after,.experience-image>span:hover::after,.experience-card:focus-visible .experience-image>span::after,.bubble-one:hover::after,.phone-screen>strong span:hover::after{opacity:1;transform:translate(-50%,-50%) scale(1)}
.phone-screen>p{margin-top:17px;font-size:12px;font-weight:700}
.phone-search{margin-top:12px;padding:9px;border-radius:8px;background:#f6f5f4;color:#aaa3a1;font-size:10px}
.phone-categories{display:flex;justify-content:space-between;margin-top:17px;color:#fc744b;font-size:10px;font-weight:730}
.phone-categories span{display:grid;place-items:center;min-width:25%;min-height:34px;margin-block:-9px;padding:7px 2px;border-radius:8px;cursor:default;transition:color .25s .28s,background .25s .28s,box-shadow .25s .28s}
.phone-categories span:hover{color:#111116;background:#fff0e8;box-shadow:0 0 0 3px rgba(255,128,91,.13);transition-delay:0s}
.phone-screen h3{margin:19px 0 10px;font-size:13px}
.phone-photo{height:102px;border-radius:11px;overflow:hidden}
.phone-photo-row{display:flex;gap:6px;margin-top:7px}.phone-photo-row>div{width:50%;height:64px;border-radius:8px;overflow:hidden}
.phone-list{display:flex;align-items:center;gap:9px;margin-top:18px;padding-bottom:11px;border-bottom:1px solid #eee;font-size:13px;font-weight:800;line-height:1.4}
.phone-list>div{width:50px;height:50px;border-radius:9px;overflow:hidden}.phone-list small{color:#a19b9b;font-size:9px;font-weight:500}
.phone-create{display:block;margin-top:21px;padding:11px 7px;border-radius:99px;background:#ff885b;color:#fff;font-size:10px;font-weight:760;text-align:center}
.site-footer{padding:34px 0 32px;background:#050505;color:#999}
.footer-inner{max-width:1220px}
.footer-business strong{display:block;margin-bottom:12px;color:#f2f2f2;font-size:15px;font-weight:800}
.footer-business p,.footer-notice p,.footer-bottom p{font-size:12px;line-height:1.7}
.footer-business p+p{margin-top:4px}
.footer-business p span{margin:0 5px;color:#555}
.footer-business a{color:#c8c8c8;text-decoration:underline;text-underline-offset:2px}
.footer-business a:hover{color:#fff}
.footer-notice{margin-top:19px;padding:17px 0;border-top:1px solid #242424;border-bottom:1px solid #242424}
.footer-notice p+p{margin-top:10px}
.footer-bottom{padding-top:17px}
.footer-policies{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-bottom:8px;color:#b5b5b5;font-size:12px}
.footer-policies span:nth-child(even){color:#555}
.js .hero-copy>*{opacity:0;transform:translateY(28px);transition:opacity .6s,transform .8s cubic-bezier(.15,.9,.22,1)}
.js .hero-ready .hero-copy>*{opacity:1;transform:translateY(0)}
.js .hero-copy>*:nth-child(2){transition-delay:.11s}.js .hero-copy>*:nth-child(3){transition-delay:.2s}.js .hero-copy>*:nth-child(4){transition-delay:.3s}
.js .hero-phone{opacity:0;transform:translateY(60px) scale(.9);transition:opacity .7s .13s,transform 1s cubic-bezier(.14,.9,.2,1) .13s,translate 1.25s cubic-bezier(.16,.78,.18,1)}
.js .hero-ready .hero-phone{opacity:1;transform:translateY(0) scale(1)}
.js .floating-tem,.js .hero-qcard{opacity:0;filter:blur(7px);scale:.8;transition:opacity .5s,filter .6s,scale .75s cubic-bezier(.14,1.1,.25,1),transform .65s cubic-bezier(.18,.85,.23,1)}
.js .hero-ready .floating-tem,.js .hero-ready .hero-qcard{opacity:1;filter:blur(0);scale:1}
.js .hero-ready .tem-coffee{transition-delay:.45s}.js .hero-ready .tem-gallery{transition-delay:.57s}.js .hero-ready .tem-dessert{transition-delay:.69s}.js .hero-ready .hero-qcard{transition-delay:.85s}
.js .hero-ready.hero-settled .floating-tem,.js .hero-ready.hero-settled .hero-qcard{transition:transform 1.15s cubic-bezier(.16,.78,.18,1),scale 1.05s cubic-bezier(.16,.78,.18,1),filter .6s;transition-delay:0s}
.js .hero-ready .floating-tem:hover{transform:translate3d(var(--px,0px),calc(var(--py,0px) - 22px),0);scale:1.035;filter:none;transition-delay:0s}
.js .hero-ready .tem-gallery:hover{transform:translate3d(var(--px,0px),calc(var(--py,0px) - 15px),0);scale:1.025}
.js .hero-ready .hero-qcard:hover{transform:translate3d(var(--px,0px),calc(var(--py,0px) - 17px),0);scale:1.015;transition-delay:0s}
.js [data-reveal]{opacity:0;transform:translateY(40px);transition:opacity .7s,transform .85s cubic-bezier(.15,.9,.22,1)}
.js [data-reveal].is-visible{opacity:1;transform:translateY(0)}
.js .journey-story .journey-head{opacity:0;transform:translateY(20px);transition:opacity .65s,transform .8s cubic-bezier(.16,.78,.18,1)}
.js .journey-story.is-active .journey-head{opacity:1;transform:translateY(0)}
.js .journey-story.is-active .journey-create .journey-head{transition-delay:.55s}
.js .journey-story.is-active .journey-live .journey-head{transition-delay:1.55s}
.js .journey-story .journey-find{opacity:0;transform:translateY(25px);transition:opacity .75s,transform .9s cubic-bezier(.16,.78,.18,1)}
.js .journey-story.is-active .journey-find{opacity:1;transform:translateY(0);transition-delay:.17s}
.js .journey-story.is-active .find-photo img{animation:journey-zoom 1.25s ease-out .22s both}
.js .journey-story .find-chips span{opacity:0;transform:translate(-15px,15px) scale(.85)}
.js .journey-story.is-active .find-chips span{animation:journey-chip .4s cubic-bezier(.16,1.3,.24,1) both}
.js .journey-story.is-active .find-chips span:nth-child(1){animation-delay:.34s}.js .journey-story.is-active .find-chips span:nth-child(2){animation-delay:.46s}.js .journey-story.is-active .find-chips span:nth-child(3){animation-delay:.58s}.js .journey-story.is-active .find-chips span:nth-child(4){animation-delay:.7s}.js .journey-story.is-active .find-chips span:nth-child(5){animation-delay:.82s}.js .journey-story.is-active .find-chips span:nth-child(6){animation-delay:.94s}
.js .journey-story .journey-token{opacity:0}
.js .journey-story.is-active .journey-token{animation:journey-token-arrive .8s cubic-bezier(.16,.82,.18,1) both}
.js .journey-story.is-active .token-coffee{--from-x:-42px;--merge-x:78px;--merge-y:63px;animation-delay:.72s}
.js .journey-story.is-active .token-gallery{--from-x:-40px;--merge-x:90px;--merge-y:-23px;animation-delay:.86s}
.js .journey-story.is-active .token-dessert{--from-x:42px;--merge-x:-80px;--merge-y:28px;animation-delay:1s}
.js .journey-story .journey-threads path{stroke-dashoffset:210;opacity:0}
.js .journey-story.is-active .journey-threads path{animation:journey-thread .55s ease-out 1.12s both}
.js .journey-story.is-active .journey-threads path:nth-child(2){animation-delay:1.23s}.js .journey-story.is-active .journey-threads path:nth-child(3){animation-delay:1.34s}
.js .journey-story .journey-qplus{opacity:0;transform:translate(-50%,-50%) scale(.45)}
.js .journey-story.is-active .journey-qplus{animation:journey-qplus-pop .48s cubic-bezier(.17,1.4,.24,1) 1.42s both}
.js .journey-story .journey-combine-caption{opacity:0;transform:translate(-50%,8px);transition:opacity .4s,transform .5s}
.js .journey-story.is-active .journey-combine-caption{opacity:1;transform:translate(-50%,0);transition-delay:1.57s}
.js .journey-story .journey-experience{opacity:0;transform:translate(38px,25px) scale(.89);transition:opacity .58s,transform .9s cubic-bezier(.16,.78,.18,1)}
.js .journey-story.is-finished .journey-experience{opacity:1;transform:translate(0,0) scale(1)}
@keyframes journey-zoom{0%{transform:scale(1.08)}55%{transform:scale(1.16)}100%{transform:scale(1.11)}}
@keyframes journey-chip{0%{opacity:0;transform:translate(-15px,15px) scale(.85)}75%{opacity:1;transform:translate(0,-3px) scale(1.04)}100%{opacity:1;transform:none}}
@keyframes journey-token-arrive{0%{opacity:0;transform:translate(var(--from-x),-48px) rotate(-12deg) scale(.68)}65%{opacity:1;transform:translate(var(--merge-x),var(--merge-y)) rotate(5deg) scale(.55)}100%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}}
@keyframes journey-thread{0%{stroke-dashoffset:210;opacity:0}35%{opacity:.7}100%{stroke-dashoffset:0;opacity:.6}}
@keyframes journey-qplus-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.45)}65%{opacity:1;transform:translate(-50%,-50%) scale(1.16)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(max-width:1050px){
  .hero-grid{grid-template-columns:43% 57%}.hero h1{font-size:clamp(40px,4.2vw,52px)}.hero-art{height:600px}
  .hero-phone-zone{width:54%;left:18%}.hero-qcard{width:49%}
  .journey-stage{padding:22px 15px}.journey-head h3{font-size:19px}.journey-head p{font-size:11px}.journey-head>span{width:43px;height:43px;font-size:14px}
  .find-photo{height:150px}.find-chips span{height:31px;font-size:10px}.journey-token{width:66px}.journey-token>div{height:49px}.journey-qplus{width:105px;height:105px}
}
@media(max-width:760px){
  .wrap{width:min(100% - 36px,600px)}
  .header-inner{min-height:68px;gap:16px}.brand{font-size:24px}.main-nav{gap:12px;font-size:11px}.header-action{padding:9px 13px;font-size:10px}
  .hero-grid{grid-template-columns:1fr;min-height:0}.hero-copy{padding:58px 0 10px}.hero h1{font-size:clamp(43px,7vw,60px)}
  .hero-art{height:610px;width:min(100%,590px);margin-inline:auto}
  .hero-phone-zone{left:19%;width:54%}.tem-coffee{left:0}.tem-gallery{right:0}.tem-dessert{right:0}.hero-qcard{right:0;width:49%}
  .section-space{padding:88px 0}.journey-story{grid-template-columns:1fr;max-width:600px;margin:38px auto 0}
  .journey-stage{padding:24px;min-height:0}.journey-stage+.journey-stage{border-left:0;border-top:1px solid #f4ece8}.journey-head p{font-size:13px}.journey-find{max-width:460px;margin-top:22px}.find-photo{height:175px}.find-chips{max-width:230px}.journey-combine-scene{max-width:480px;margin:15px auto 0}.journey-experience{max-width:480px;height:235px;margin:22px auto 0}
  .journey-line{max-width:600px;margin-inline:auto}.journey-line-track{left:16.7%;right:16.7%}.stop-discover{left:16.7%}.stop-create{left:50%}.stop-live{left:83.3%}
  .combine-flow{grid-template-columns:1fr;gap:15px}.tem-selection{width:100%}.flow-arrow{rotate:90deg}.result-card{width:min(100%,350px);margin:auto}
  .experience-card{flex-basis:calc((min(100vw - 36px,600px) - 17px)/2)}
  .start-panel{grid-template-columns:1fr}.start-copy{padding:42px 36px 0}.start-visual{height:340px;min-height:0}.phone-front{left:29%;bottom:-140px}.phone-back{right:8%;bottom:-155px}
}
@media(max-width:520px){
  .wrap{width:calc(100% - 32px)}.header-inner{flex-wrap:wrap;gap:0;padding:12px 0}.brand{width:50%}.header-action{margin-left:auto}.main-nav{order:3;justify-content:space-between;width:100%;margin-top:10px;padding:8px 16px;border-radius:99px;background:#fff8f4;font-size:12px}
  .hero-copy{padding-top:49px}.hero h1{font-size:clamp(37px,9.2vw,49px)}.hero-copy>p{font-size:13px}.hero-copy>p br{display:none}.hero-actions{gap:9px;margin-top:23px}.button{min-height:43px;padding-inline:16px;font-size:12px;gap:8px}
  .hero-art{height:430px;margin-top:18px}.hero-phone-zone{left:17%;bottom:0;width:62%}.hero-ribbon{top:35%;left:0;width:105%;height:42%;border-width:12px}
  .floating-tem{width:31%}.tem-coffee{top:7%;left:-2%}.tem-gallery{top:3%;right:-2%}.tem-dessert{top:39%;right:-3%;width:29%}
  .hero-qcard{right:-2%;bottom:0;width:55%}.hero-qcard .heart{font-size:17px}
  .section-space{padding:75px 0}.eyebrow{font-size:12px}.section-heading h2,.experiences-head h2{font-size:clamp(27px,7.3vw,35px)}.section-heading p{font-size:13px}
  .journey-story{margin-top:30px;border-radius:20px}.journey-stage{padding:19px}.journey-head>span{width:42px;height:42px}.journey-head h3{font-size:19px}.journey-head p{font-size:11px}.journey-find{gap:10px}.find-photo{height:142px}.find-chips span{height:31px;font-size:10px}.journey-combine-scene{height:230px}.journey-experience{height:190px}.journey-experience strong{font-size:14px}.journey-line{margin-top:18px}
  .combine-flow{margin-top:30px}.tem-selection{gap:5px}.selection-item{padding:4px 4px 9px;border-radius:12px}.selection-item>div{height:100px;border-radius:9px}.selection-item strong{font-size:12px}.selection-check{width:25px;height:25px;font-size:12px}.flow-plus{font-size:18px}.flow-arrow{font-size:29px}
  .experiences-head{align-items:end}.experiences-head>a{font-size:10px;padding:8px 11px}.experience-grid{gap:9px}.experience-card{flex-basis:73vw}.experience-image{height:150px}.experience-content{padding:11px}.experience-content>div{gap:3px;margin-top:-19px}.experience-content>div span{padding:4px 6px;font-size:8px}.experience-content h3{font-size:15px;min-height:30px}.experience-content p{font-size:9px}
  .start{padding-bottom:55px}.start-panel{border-radius:20px}.start-copy{padding:35px 24px 0}.start-copy h2{font-size:31px}.start-copy p{font-size:12px}.start-visual{height:280px}.app-phone{width:190px;height:350px;border-radius:30px}.phone-screen{border-radius:21px}.phone-front{left:28%;bottom:-150px}.phone-back{right:-7%;bottom:-160px}.bubble-one{left:8%;top:35%}.bubble-two{left:12%;top:62%}
  .site-footer{padding:26px 0 28px}.footer-business strong{font-size:13px}.footer-business p,.footer-notice p,.footer-bottom p,.footer-policies{font-size:11px}
}
@media(max-width:360px){.hero h1{font-size:35px}.hero-art{height:390px}.hero-qcard{width:56%}.experience-image{height:110px}.experience-content p{font-size:7px}.start-copy h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;transition-delay:0ms!important}.js .hero-copy>*,.js .hero-phone,.js .floating-tem,.js .hero-qcard,.js [data-reveal]{opacity:1!important;filter:none!important;transform:none!important;scale:1!important}.js .journey-story .journey-head,.js .journey-story .journey-find,.js .journey-story .find-chips span,.js .journey-story .journey-token,.js .journey-story .journey-qplus,.js .journey-story .journey-combine-caption,.js .journey-story .journey-experience{opacity:1!important;filter:none!important;animation:none!important;transform:none!important}.js .journey-story .journey-qplus{transform:translate(-50%,-50%)!important}.js .journey-story .journey-combine-caption{transform:translateX(-50%)!important}.js .journey-story .journey-threads path{stroke-dashoffset:0!important;opacity:.6!important}.hero-phone-zone:hover .hero-phone{translate:0}.js .combine-flow .selection-check,.js .combine-flow .result-card,.js .combine-flow .result-mini>div,.js .combine-flow .result-body h3{opacity:1!important;filter:none!important;transform:none!important;scale:1!important}}