/* A tactile, three-scene story. Motion happens once on entry or step change. */
.home-flow .journey-story{padding:55px 6% 50px;background:#f9f8f5;overflow:hidden}
.story-heading{display:flex;align-items:center;justify-content:space-between;max-width:1100px;margin:0 auto}
.story-heading h2{font-size:clamp(34px,4vw,57px);line-height:1.09;letter-spacing:-1.8px}
.story-heading em{font-weight:400;font-family:Georgia,serif;letter-spacing:-2px}
.story-scribble{width:135px;margin-right:7%;transform:rotate(12deg)}
.story-scribble path,.note-circle path,.venue-loop path{stroke:#57534a;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.story-stage{max-width:1100px;margin:24px auto 0}
.story-panel[hidden]{display:none}
.story-art{position:relative;height:350px;max-width:800px;margin:auto;isolation:isolate}
.story-photo{position:absolute;background:#fff;padding:9px 9px 30px;box-shadow:0 16px 30px #30241820;border:1px solid #e7e3da}
.story-photo img{width:100%;height:100%;object-fit:cover;display:block}
.idea-place{width:235px;height:225px;left:9%;top:47px;transform:rotate(-13deg)}
.idea-table{width:235px;height:225px;right:7%;top:68px;transform:rotate(11deg)}
.idea-note{position:absolute;left:50%;top:24px;width:240px;height:287px;transform:translateX(-50%) rotate(-3deg);background:#f0e9db;padding:37px 26px 24px;box-shadow:0 15px 28px #33281422;z-index:2}
.note-pin{position:absolute;top:-8px;left:85px;width:70px;height:26px;background:#d5c9b599;transform:rotate(4deg)}
.note-kicker{display:block;font-size:9px;letter-spacing:1.6px;color:#746b5c}
.note-title{display:block;font:italic 43px/1.2 Georgia,serif;margin-top:16px;letter-spacing:-1.5px}
.note-rule{display:block;height:1px;background:#c6bbaa;margin:20px 0 16px}
.note-row{display:block;font-size:14px;margin:11px 0;color:#514a3f}
.note-row i{font-style:normal;margin-right:12px;color:#8a806b}
.note-circle{position:absolute;top:51px;left:10px;width:220px;height:85px;pointer-events:none}
.note-circle path{stroke:#958368;stroke-width:1.4}
.story-star{position:absolute;font-family:Georgia,serif;line-height:1;color:#9a896b}
.idea-star{font-size:73px;right:9%;top:12px;transform:rotate(12deg)}
.story-caption{text-align:center;color:#655f55;font-size:16px;line-height:1.6;margin:8px auto 0;max-width:620px;min-height:26px}
.story-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:1100px;margin:30px auto 0}
.story-tabs button{display:flex;align-items:center;gap:16px;position:relative;border:1px solid #dbd7ce;border-radius:13px;background:transparent;color:#514c44;padding:21px 22px;text-align:left;font-size:17px;line-height:1.2;transition:background .25s,color .25s,transform .25s,box-shadow .25s}
.story-tabs button[aria-selected=true]{background:#20201e;color:#fff;border-color:#20201e;box-shadow:0 8px 20px #25201418;transform:translateY(-4px)}
.story-tabs button:hover{border-color:#777065}
.story-step-number{font-size:11px;opacity:.65}
.story-tab-arrow{font-size:23px;margin-left:auto;transition:transform .3s}
.story-tabs button[aria-selected=true] .story-tab-arrow{transform:rotate(45deg)}
.venue-photo{width:235px;height:246px;top:53px;padding-bottom:40px}
.venue-photo>span{position:absolute;bottom:14px;left:8px;right:8px;text-align:center;font:italic 13px Georgia,serif;color:#5e5546}
.venue-one{left:6%;transform:rotate(-12deg)}
.venue-two{left:calc(50% - 117px);top:24px;z-index:2;transform:rotate(3deg)}
.venue-three{right:5%;transform:rotate(14deg)}
.venue-heart{position:absolute;right:13px;top:10px;font:38px/1 Georgia,serif;color:#fff;text-shadow:0 2px 8px #0009}
.venue-loop{position:absolute;left:4%;top:0;width:92%;height:330px;z-index:-1}
.venue-loop path{stroke:#b4a68e;stroke-width:1.4;stroke-dasharray:5 9}
.celebration-photo{position:absolute;inset:24px 12% 25px;overflow:hidden;border-radius:8px;transform:rotate(-2deg);box-shadow:0 18px 35px #33281822}
.celebration-photo img{width:100%;height:100%;object-fit:cover}
.celebration-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 15%,#0008)}
.celebration-script{position:absolute;left:0;right:0;bottom:35px;text-align:center;font:italic clamp(35px,5vw,58px)/1.1 Georgia,serif;color:white;z-index:1}
.celebration-stamp{position:absolute;right:6%;top:17px;background:#eee4d2;color:#514537;width:120px;height:120px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-size:10px;line-height:1.6;letter-spacing:1px;transform:rotate(12deg);box-shadow:0 8px 18px #25201415}
.celebration-stamp>span{font-size:25px;line-height:1.1}
.party-star-one{font-size:83px;left:5%;bottom:15px;transform:rotate(-10deg)}
.party-star-two{font-size:65px;left:7%;top:6px}
.party-confetti{position:absolute;inset:0;pointer-events:none}
.party-confetti i{position:absolute;width:6px;height:13px;background:#a58e66;transform:rotate(var(--r));border-radius:2px;left:var(--x);top:var(--y)}
.party-confetti i:nth-child(1){--x:18%;--y:8%;--r:30deg}.party-confetti i:nth-child(2){--x:34%;--y:1%;--r:-20deg}.party-confetti i:nth-child(3){--x:68%;--y:4%;--r:55deg}.party-confetti i:nth-child(4){--x:94%;--y:45%;--r:-45deg}.party-confetti i:nth-child(5){--x:88%;--y:83%;--r:24deg}.party-confetti i:nth-child(6){--x:60%;--y:94%;--r:-40deg}.party-confetti i:nth-child(7){--x:26%;--y:91%;--r:12deg}.party-confetti i:nth-child(8){--x:3%;--y:44%;--r:60deg}
@media(prefers-reduced-motion:no-preference){
 .story-entered .story-panel:not([hidden]) .story-photo,.story-entered .story-panel:not([hidden]) .idea-note,.story-entered .story-panel:not([hidden]) .celebration-photo{animation:story-place .85s cubic-bezier(.16,1,.3,1) both}
 .story-entered .idea-table,.story-entered .venue-three{animation-delay:.14s!important}
 .story-entered .idea-note,.story-entered .venue-two{animation-delay:.25s!important}
 .story-entered .story-panel:not([hidden]) .story-star,.story-entered .story-panel:not([hidden]) .celebration-stamp{animation:story-stamp .8s .3s cubic-bezier(.2,1.4,.4,1) both}
 .story-entered .story-panel:not([hidden]) .story-caption{animation:story-caption .5s ease both}
 .story-entered .note-circle path{stroke-dasharray:600;stroke-dashoffset:600;animation:story-draw .85s .7s ease forwards}
 .story-entered .story-panel:not([hidden]) .party-confetti i{animation:story-confetti 1s .1s cubic-bezier(.12,.7,.2,1) both}
 .story-entered .story-scribble path{stroke-dasharray:300;stroke-dashoffset:300;animation:story-draw 1s ease forwards}
 @keyframes story-place{from{opacity:0;translate:0 35px;scale:.85;rotate:-6deg}to{opacity:1;translate:0 0;scale:1;rotate:0deg}}
 @keyframes story-stamp{from{opacity:0;scale:.25;rotate:-35deg}to{opacity:1;scale:1;rotate:0deg}}
 @keyframes story-caption{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
 @keyframes story-draw{to{stroke-dashoffset:0}}
 @keyframes story-confetti{from{opacity:0;translate:0 60px;rotate:-130deg}to{opacity:1;translate:0 0;rotate:0deg}}
}
@media(max-width:700px){
 .home-flow .journey-story{padding:45px 5% 40px}
 .story-heading h2{font-size:35px;letter-spacing:-1.4px}
 .story-scribble{width:75px;margin:0}
 .story-stage{margin-top:26px}
 .story-art{height:285px}
 .idea-place{width:155px;height:174px;left:0;top:48px}
 .idea-table{width:155px;height:174px;right:0;top:72px}
 .idea-note{width:187px;height:240px;top:14px;padding:30px 20px 20px}
 .note-pin{left:61px;width:60px;height:24px}
 .note-title{font-size:35px;margin-top:16px}
 .note-kicker{font-size:8px;letter-spacing:1px}
 .note-rule{margin:15px 0 13px}
 .note-row{font-size:12px;margin:9px 0}
 .note-circle{top:49px;left:8px;width:171px;height:64px}
 .idea-star{font-size:48px;right:0;top:4px}
 .story-caption{font-size:14px;max-width:310px;min-height:45px;margin:4px auto 0}
 .story-tabs{gap:7px}
 .story-tabs button{padding:14px 10px;display:block;font-size:13px;line-height:1.35;border-radius:10px}
 .story-step-number{display:block;font-size:10px;margin-bottom:10px}
 .story-tab-arrow{display:none}
 .venue-photo{width:155px;height:190px;top:53px;padding:6px 6px 35px}
 .venue-one{left:0;transform:rotate(-13deg)}
 .venue-two{left:calc(50% - 77px);top:17px}
 .venue-three{right:0;transform:rotate(13deg)}
 .venue-photo>span{font-size:10px;line-height:1.2;bottom:10px}
 .venue-loop{height:270px;left:0;width:100%}
 .celebration-photo{inset:28px 5% 30px}
 .celebration-script{font-size:36px;bottom:28px}
 .celebration-stamp{width:86px;height:86px;font-size:8px;right:0;top:0}
 .celebration-stamp>span{font-size:19px}
 .party-star-one{font-size:58px;left:0;bottom:8px}
 .party-star-two{font-size:40px;left:0;top:8px}
}