/* Requested patches: original Designour layout preserved. */

/* Premium scroll story replacing only the generated video. */
.story-visual {
  position:absolute; inset:0; overflow:hidden;
  background:radial-gradient(circle at 70% 48%,rgba(183,255,60,.12),transparent 25%),radial-gradient(circle at 50% 100%,rgba(72,91,128,.16),transparent 45%),linear-gradient(145deg,#050608 0%,#0b0e14 55%,#050608 100%);
}
.story-depth {position:absolute;border:1px solid rgba(255,255,255,.055);border-radius:50%;animation:storyOrbit 22s linear infinite}
.story-depth--one {width:62vw;height:62vw;min-width:720px;min-height:720px;right:-24vw;top:-12vw}
.story-depth--two {width:38vw;height:38vw;min-width:440px;min-height:440px;right:4vw;top:20vh;animation-direction:reverse;animation-duration:15s}
@keyframes storyOrbit {to{transform:rotate(360deg)}}
.story-browser {
  position:absolute;right:clamp(7vw,10vw,150px);top:50%;width:min(46vw,720px);min-height:430px;padding:22px;
  border:1px solid rgba(255,255,255,.12);border-radius:30px;background:linear-gradient(145deg,rgba(24,27,34,.9),rgba(9,10,13,.86));
  box-shadow:0 40px 110px rgba(0,0,0,.55);backdrop-filter:blur(16px);transition:opacity .75s var(--ease),transform .9s var(--ease),filter .75s var(--ease)
}
.story-browser__top,.transform-browser-top {display:flex;gap:8px;margin-bottom:20px}
.story-browser__top i,.transform-browser-top i {width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.17)}
.story-old-nav,.story-new-nav,.transform-old-nav,.transform-new-nav {width:56%;height:11px;border-radius:999px;background:rgba(255,255,255,.12);margin-bottom:18px}
.story-old-hero,.transform-old-hero {height:150px;border-radius:18px;background:linear-gradient(120deg,rgba(255,255,255,.11),rgba(255,255,255,.025));margin-bottom:16px}
.story-old-cards,.transform-old-boxes {display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.story-old-cards span,.transform-old-boxes span {min-height:76px;border-radius:15px;background:rgba(255,255,255,.07)}
.story-old-lines,.transform-old-copy,.story-new-copy {display:grid;gap:9px;margin-top:18px}
.story-old-lines i,.transform-old-copy i,.story-new-copy i {height:8px;border-radius:999px;background:rgba(255,255,255,.08)}
.story-old-lines i:nth-child(1),.transform-old-copy i:nth-child(1),.story-new-copy i:nth-child(1){width:91%}
.story-old-lines i:nth-child(2),.transform-old-copy i:nth-child(2),.story-new-copy i:nth-child(2){width:76%}
.story-old-lines i:nth-child(3),.transform-old-copy i:nth-child(3),.story-new-copy i:nth-child(3){width:84%}
.story-old-lines i:nth-child(4),.transform-old-copy i:nth-child(4){width:62%}
.story-new-hero,.transform-new-hero {height:178px;border-radius:21px;background:linear-gradient(135deg,rgba(183,255,60,.28),rgba(255,255,255,.065));margin-bottom:16px;box-shadow:inset 0 0 0 1px rgba(183,255,60,.1)}
.story-new-grid,.transform-new-grid {display:grid;grid-template-columns:1.2fr .8fr;gap:12px}
.story-new-grid span,.transform-new-grid span {min-height:92px;border-radius:16px;background:rgba(255,255,255,.085)}
.story-new-button,.transform-new-button {width:142px;height:43px;border-radius:999px;margin-top:20px;background:var(--lime);box-shadow:0 12px 34px rgba(183,255,60,.15)}
.story-browser--old {transform:translateY(-50%) rotateY(-5deg) rotateZ(-1.2deg);opacity:1}
.story-browser--new {transform:translateY(-44%) translateX(34px) scale(.91);opacity:0;border-color:rgba(183,255,60,.18)}
.story-scan {position:absolute;top:0;bottom:0;right:48%;width:16vw;opacity:0;transform:skewX(-12deg) translateX(-35vw);background:linear-gradient(90deg,transparent,rgba(183,255,60,.08),rgba(183,255,60,.42),rgba(183,255,60,.08),transparent);filter:blur(8px);transition:opacity .35s ease,transform 1.2s var(--ease)}
.story-fragments span {position:absolute;right:30%;top:50%;width:18px;height:18px;opacity:0;background:linear-gradient(145deg,var(--lime),rgba(255,255,255,.6));clip-path:polygon(50% 0,100% 45%,70% 100%,0 65%);transition:opacity .45s ease,transform .8s var(--ease)}
.story-fragments span:nth-child(1){transform:translate(-60px,-150px) rotate(20deg)}
.story-fragments span:nth-child(2){transform:translate(100px,-130px) rotate(75deg)}
.story-fragments span:nth-child(3){transform:translate(-150px,20px) rotate(110deg)}
.story-fragments span:nth-child(4){transform:translate(130px,50px) rotate(160deg)}
.story-fragments span:nth-child(5){transform:translate(-40px,160px) rotate(210deg)}
.story-fragments span:nth-child(6){transform:translate(170px,150px) rotate(260deg)}
.story-fragments span:nth-child(7){transform:translate(35px,-20px) rotate(320deg)}
.story-logo-reveal {position:absolute;right:clamp(7vw,10vw,150px);top:50%;width:min(46vw,720px);padding:52px;opacity:0;transform:translateY(-42%) scale(.92);transition:opacity .7s var(--ease),transform .8s var(--ease)}
.story-logo-reveal img {width:100%;filter:drop-shadow(0 22px 60px rgba(0,0,0,.46))}
.story-visual[data-stage="1"] .story-scan {opacity:1;transform:skewX(-12deg) translateX(38vw)}
.story-visual[data-stage="1"] .story-browser--old {transform:translateY(-50%) rotateY(0) scale(1.02);filter:contrast(1.08)}
.story-visual[data-stage="2"] .story-browser--old {opacity:.1;transform:translateY(-58%) translateX(-72px) scale(.78) rotateZ(-7deg);filter:blur(3px)}
.story-visual[data-stage="2"] .story-browser--new {opacity:1;transform:translateY(-50%) translateX(0) scale(1)}
.story-visual[data-stage="2"] .story-fragments span {opacity:.8}
.story-visual[data-stage="3"] .story-browser--old {opacity:0}
.story-visual[data-stage="3"] .story-browser--new {opacity:.12;transform:translateY(-65%) translateX(80px) scale(.72);filter:blur(2px)}
.story-visual[data-stage="3"] .story-logo-reveal {opacity:1;transform:translateY(-50%) scale(1)}

/* Native before/after artwork replacing only the second generated video. */
.transformation-media {min-width:0}
.transformation-visual {position:relative;display:grid;grid-template-columns:1fr 88px 1fr;align-items:center;gap:12px;min-height:620px;padding:34px;border:1px solid var(--line);border-radius:var(--radius);background:radial-gradient(circle at 50% 50%,rgba(183,255,60,.09),transparent 34%),linear-gradient(145deg,#10131a,#090a0d);overflow:hidden;box-shadow:0 40px 100px rgba(0,0,0,.32)}
.transformation-visual::before {content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 90%)}
.transformation-card {position:relative;z-index:1;min-height:430px;padding:20px;border:1px solid rgba(255,255,255,.11);border-radius:24px;background:rgba(15,17,23,.86);box-shadow:0 28px 60px rgba(0,0,0,.38);transition:transform .45s var(--ease),border-color .45s}
.transformation-card--before {transform:rotate(-4deg)}
.transformation-card--after {transform:rotate(4deg);border-color:rgba(183,255,60,.25);background:linear-gradient(145deg,rgba(183,255,60,.08),rgba(15,17,23,.88))}
.transformation-visual:hover .transformation-card--before {transform:rotate(-1.5deg) translateY(-4px)}
.transformation-visual:hover .transformation-card--after {transform:rotate(1.5deg) translateY(-4px)}
.transform-tag {display:inline-flex;border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:.45rem .65rem;margin-bottom:16px;color:var(--muted);font-size:.62rem;text-transform:uppercase;letter-spacing:.14em}
.transformation-card--after .transform-tag {color:var(--lime);border-color:rgba(183,255,60,.26)}
.transformation-core {position:relative;z-index:2;display:grid;place-items:center}
.transformation-core__ring {width:68px;height:68px;border:1px solid rgba(183,255,60,.34);border-radius:50%;animation:corePulse 2.4s ease-in-out infinite}
.transformation-core__arrow {position:absolute;width:16px;height:16px;border-right:2px solid var(--lime);border-top:2px solid var(--lime);transform:rotate(45deg)}
@keyframes corePulse {50%{transform:scale(1.12);box-shadow:0 0 40px rgba(183,255,60,.13)}}

/* Invitation preview upgrade while retaining the existing section and phone. */
.invitation-preview[data-theme="rose"] {--invite-bg:#f6ede8;--invite-ink:#66524b;--invite-accent:#b88478}
.theme-dot[data-theme="rose"] {background:#e8c9c1}
.invite-floral {position:absolute;z-index:2;width:210px;height:210px;pointer-events:none;filter:drop-shadow(0 18px 24px rgba(34,51,40,.12))}
.invite-floral--top {right:1%;top:4%;animation:floralFloat 7s ease-in-out infinite}
.invite-floral--bottom {left:2%;bottom:4%;transform:rotate(180deg);animation:floralFloatReverse 8s ease-in-out infinite}
.invite-floral span {position:absolute;width:72px;height:72px;border-radius:50%;background:radial-gradient(circle at 44% 44%,#fff 0 20%,#f6e5df 42%,rgba(255,255,255,0) 70%)}
.invite-floral span:nth-child(1){left:20px;top:38px}.invite-floral span:nth-child(2){left:76px;top:15px;transform:scale(.82)}.invite-floral span:nth-child(3){left:112px;top:67px;transform:scale(.65)}
.invite-floral i {position:absolute;display:block;width:105px;height:45px;border-radius:100% 0 100% 0;background:linear-gradient(135deg,rgba(55,111,77,.88),rgba(117,150,101,.42))}
.invite-floral i:nth-of-type(1){left:4px;top:105px;transform:rotate(-35deg)}.invite-floral i:nth-of-type(2){left:93px;top:118px;transform:rotate(22deg) scale(.8)}
.invite-petals i {position:absolute;z-index:2;top:-40px;width:15px;height:10px;border-radius:100% 0 100% 0;background:rgba(255,255,255,.82);animation:invitePetal 10s linear infinite;pointer-events:none}
.invite-petals i:nth-child(1){left:9%;animation-delay:-1s}.invite-petals i:nth-child(2){left:24%;animation-delay:-7s}.invite-petals i:nth-child(3){left:41%;animation-delay:-3s}.invite-petals i:nth-child(4){left:61%;animation-delay:-8s}.invite-petals i:nth-child(5){left:77%;animation-delay:-5s}.invite-petals i:nth-child(6){left:92%;animation-delay:-9s}
@keyframes invitePetal {0%{transform:translateY(-30px) translateX(0) rotate(0);opacity:0}10%{opacity:.85}85%{opacity:.75}100%{transform:translateY(760px) translateX(90px) rotate(280deg);opacity:0}}
@keyframes floralFloat {50%{transform:translateY(-10px) rotate(2deg)}}
@keyframes floralFloatReverse {0%,100%{transform:rotate(180deg) translateY(0)}50%{transform:rotate(177deg) translateY(10px)}}
.invite-couple {position:relative;width:180px;margin:12px auto 8px}
.invite-couple svg {width:100%;height:auto}
.invite-couple .invite-bride circle,.invite-couple .invite-bride path {fill:rgba(255,255,255,.88);stroke:var(--invite-accent);stroke-width:1.2}
.invite-couple .invite-groom circle,.invite-couple .invite-groom path {fill:rgba(255,255,255,.72);stroke:var(--invite-accent);stroke-width:1.2}
.invite-couple .invite-veil {fill:rgba(255,255,255,.42)!important}
.invite-screen {padding-bottom:24px}
.invite-screen small {margin-top:24px}

/* Clear bullet text on the white first and third pricing cards. */
.price-card:not(.price-card--featured) li {color:#2d333b}
.price-card:not(.price-card--featured) li::before {background:#5b7300}

@media (max-width:900px){
  .story-browser,.story-logo-reveal {right:4vw;width:min(55vw,590px)}
  .transformation-visual {grid-template-columns:1fr;min-height:auto;gap:24px}
  .transformation-core {height:68px;transform:rotate(90deg)}
  .transformation-card {min-height:360px}
  .invite-floral {width:150px;height:150px;opacity:.78}
}
@media (max-width:650px){
  .story-browser,.story-logo-reveal {right:5vw;width:90vw;top:62%}
  .story-browser {min-height:330px;padding:16px}
  .story-old-hero,.story-new-hero {height:110px}
  .story-copy {top:31%;width:86vw}
  .story-copy h1,.story-copy h2 {font-size:clamp(2.6rem,12vw,4rem)}
  .story-progress {right:18px;height:22vh;top:60%}
  .invite-floral--top {right:-20px;top:15px}
  .invite-floral--bottom {left:-24px;bottom:36px}
}

.loader__fallback{position:absolute;width:min(380px,68vw);height:auto;background:transparent;filter:none}
.loader__video{position:relative;z-index:1;background:transparent}
