.fp-hero{--ink:#242522;position:relative;isolation:isolate;min-height:760px;height:min(880px,100svh);overflow:hidden;background:#fafaf7;color:var(--ink);font-family:Arial,Helvetica,sans-serif}.fp-hero *{box-sizing:border-box}.fp-copy{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:64%;text-align:center;z-index:2;pointer-events:none}.fp-eyebrow{font-size:11px!important;text-transform:uppercase;letter-spacing:3px;margin:0 0 30px!important}.fp-copy h1{font-family:Arial,Helvetica,sans-serif!important;font-size:clamp(38px,5.2vw,78px)!important;font-weight:500!important;line-height:1.04!important;letter-spacing:-.065em!important;margin:0!important;color:inherit!important}.fp-copy h1>span:not(.cc-anim-word){display:block;font-family:Georgia,serif;font-style:italic;font-weight:400;font-size:.66em;letter-spacing:-.055em;margin-top:12px}.fp-hint{font-size:13px!important;line-height:1.7!important;color:#77786f;margin-top:28px!important}.fp-cards{position:absolute;inset:0;perspective:800px;perspective-origin:50% 48%;transform-style:preserve-3d}.fp-card{position:absolute;display:block;width:var(--w);height:var(--h);left:var(--x);top:var(--y);z-index:3;opacity:0;transform:translate3d(var(--from-x),var(--from-y),-500px) rotate(calc(var(--r) * 2)) scale(.2);animation:fp-enter 1.6s cubic-bezier(.16,1,.3,1) forwards;animation-delay:var(--delay);outline-offset:8px;border-radius:25px}.fp-card-visual{position:relative;width:100%;height:100%;overflow:hidden;border-radius:25px;background:#e8e4d8;box-shadow:0 8px 24px #24252208;transform:translate3d(var(--px,0px),var(--py,0px),0);transition:transform .65s cubic-bezier(.2,.7,.2,1),box-shadow .4s;animation:fp-float 7s ease-in-out infinite;animation-delay:calc(var(--delay) + 1.6s)}.fp-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}.fp-card-caption{position:absolute;bottom:0;left:0;right:0;padding:42px 16px 16px;color:#fff;background:linear-gradient(transparent,#0009);font-size:12px;display:flex;justify-content:space-between;opacity:0;transform:translateY(8px);transition:.3s}.fp-card-caption b{font-size:18px}.fp-card:hover,.fp-card:focus-visible{z-index:5}.fp-card:hover img,.fp-card:focus-visible img{transform:scale(1.08)}.fp-card:hover .fp-card-caption,.fp-card:focus-visible .fp-card-caption{opacity:1;transform:none}.fp-card:hover .fp-card-visual{box-shadow:0 18px 40px #24252225;animation-play-state:paused}.fp-card-0{--x:12%;--y:10%;--w:200.1px;--h:234.6px;--r:-4.5deg;--delay:.1s;--from-x:32vw;--from-y:30vh}.fp-card-1{--x:2%;--y:39%;--w:269.1px;--h:303.6px;--r:-4.0deg;--delay:.24s;--from-x:40vw;--from-y:0vh}.fp-card-2{--x:17%;--y:76%;--w:193.2px;--h:227.7px;--r:5.0deg;--delay:.38s;--from-x:25vw;--from-y:-30vh}.fp-card-3{--x:66%;--y:4%;--w:117.3px;--h:135.24px;--r:8.0deg;--delay:.16s;--from-x:-20vw;--from-y:40vh}.fp-card-4{--x:78%;--y:15%;--w:220.8px;--h:253.92px;--r:4.0deg;--delay:.3s;--from-x:-33vw;--from-y:28vh}.fp-card-5{--x:83%;--y:45%;--w:262.2px;--h:282.9px;--r:6.0deg;--delay:.44s;--from-x:-35vw;--from-y:0vh}.fp-card-6{--x:65%;--y:77%;--w:213.9px;--h:244.26px;--r:-9.0deg;--delay:.5s;--from-x:-20vw;--from-y:-30vh}.fp-card-7{--x:40%;--y:-15%;--w:207.0px;--h:234.6px;--r:-6.0deg;--delay:.2s;--from-x:0vw;--from-y:50vh}.fp-bottom{position:absolute;bottom:28px;left:36px;right:36px;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.03em;z-index:6}.fp-bottom>a{color:inherit;text-decoration:none;border-bottom:1px solid #aaa;padding-bottom:6px;font-size:12px}.fp-bottom>a span{margin-left:22px}.fp-placeholder{display:grid;place-items:center;height:100%;padding:20px;font-family:Georgia,serif;font-size:26px;background:#ddd6c3}.fp-card:nth-child(even) .fp-placeholder{background:#bbc5b5}@keyframes fp-enter{to{opacity:1;transform:translate3d(0,0,0) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) rotateZ(var(--r)) scale(1)}}@keyframes fp-float{0%,100%{transform:translate3d(var(--px,0px),var(--py,0px),0) rotate(0deg)}50%{transform:translate3d(var(--px,0px),calc(var(--py,0px) - 12px),0) rotate(2deg)}}
@media(min-width:1600px){.fp-card-1{--x:8%}.fp-card-5{--x:80%}}
@media(max-width:760px){.fp-hero{min-height:740px;height:94svh;max-height:950px}.fp-copy{width:94%;top:47%}.fp-copy h1{font-size:44px!important}.fp-eyebrow{margin-bottom:22px!important;font-size:9px!important}.fp-hint{font-size:11px!important;margin-top:20px!important}.fp-card{border-radius:18px}.fp-card-visual{border-radius:18px}.fp-card-0{--x:7%;--y:9%;--w:138.0px;--h:162.84px}.fp-card-1{--x:-9%;--y:29%;--w:151.8px;--h:173.88px}.fp-card-2{--x:4%;--y:69%;--w:146.28px;--h:176.64px}.fp-card-3{--x:57%;--y:1%;--w:85.56px;--h:102.12px}.fp-card-4{--x:74%;--y:11%;--w:149.04px;--h:172.5px}.fp-card-5{--x:88%;--y:40%;--w:151.8px;--h:186.3px}.fp-card-6{--x:69%;--y:71%;--w:155.94px;--h:186.3px}.fp-card-7{--x:37%;--y:86%;--w:117.3px;--h:144.9px}.fp-bottom{left:20px;right:20px;bottom:20px}.fp-bottom>span{max-width:130px;line-height:1.5}.fp-card-caption{opacity:1;transform:none;font-size:9px;padding:30px 10px 10px}}
@media(prefers-reduced-motion:reduce){.fp-card{animation:none;opacity:1;transform:rotate(var(--r))}.fp-card-visual{animation:none;transition:none}.fp-card img,.fp-card-caption{transition:none}}

/* All cards share the hero's central vanishing point. No per-card perspective. */
.fp-card{--tilt-x:0.0deg;--tilt-y:0.0deg;transform-style:preserve-3d;transform-origin:50% 50%}
.fp-card-0{--x:16%;--y:15%;--w:262.2px;--h:195.96px;--tilt-x:-9.5deg;--tilt-y:12.0deg;--r:-3.5deg}
.fp-card-1{--x:8%;--y:40%;--w:317.4px;--h:226.32px;--tilt-x:-1.5deg;--tilt-y:13.5deg;--r:-4.0deg}
.fp-card-2{--x:21%;--y:70%;--w:255.3px;--h:182.16px;--tilt-x:11.0deg;--tilt-y:10.0deg;--r:3.5deg}
.fp-card-3{--x:63%;--y:8%;--w:144.9px;--h:110.4px;--tilt-x:-13.0deg;--tilt-y:-7.5deg;--r:7.5deg}
.fp-card-4{--x:72%;--y:19%;--w:276.0px;--h:204.24px;--tilt-x:-10.0deg;--tilt-y:-12.5deg;--r:3.0deg}
.fp-card-5{--x:76%;--y:44%;--w:324.3px;--h:231.84px;--tilt-x:0.0deg;--tilt-y:-14.5deg;--r:4.5deg}
.fp-card-6{--x:62%;--y:70%;--w:282.9px;--h:202.86px;--tilt-x:12.0deg;--tilt-y:-10.5deg;--r:-7.5deg}
.fp-card-7{--x:40%;--y:-8%;--w:248.4px;--h:179.4px;--tilt-x:-14.5deg;--tilt-y:1.5deg;--r:-4.5deg}
@media(min-width:1600px){.fp-card-1{--x:15%}.fp-card-5{--x:74%}}
@media(max-width:760px){
.fp-cards{perspective:650px;perspective-origin:50% 47%}
.fp-card-0{--x:10%;--y:16%;--w:187.68px;--h:135.24px}
.fp-card-1{--x:-5%;--y:31%;--w:207.0px;--h:149.04px}
.fp-card-2{--x:10%;--y:65%;--w:193.2px;--h:138.0px}
.fp-card-3{--x:57%;--y:7%;--w:114.54px;--h:82.8px}
.fp-card-4{--x:70%;--y:18%;--w:193.2px;--h:139.38px}
.fp-card-5{--x:83%;--y:42%;--w:209.76px;--h:150.42px}
.fp-card-6{--x:65%;--y:66%;--w:201.48px;--h:144.9px}
.fp-card-7{--x:37%;--y:80%;--w:160.08px;--h:114.54px}
}
@media(prefers-reduced-motion:reduce){.fp-card{transform:rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) rotateZ(var(--r))}}

/* Contract the orbit while retaining each card's size and inward tilt. */
.fp-card-0{--x:21%;--y:20%}
.fp-card-1{--x:13%;--y:40%}
.fp-card-2{--x:25%;--y:65%}
.fp-card-3{--x:61%;--y:14%}
.fp-card-4{--x:67%;--y:24%}
.fp-card-5{--x:71%;--y:44%}
.fp-card-6{--x:59%;--y:65%}
.fp-card-7{--x:41%;--y:0%}
@media(min-width:1600px){.fp-card-1{--x:19%}.fp-card-5{--x:70%}}
@media(max-width:760px){
.fp-card-0{--x:15%;--y:21%}.fp-card-1{--x:1%;--y:33%}
.fp-card-2{--x:16%;--y:61%}.fp-card-3{--x:56%;--y:13%}
.fp-card-4{--x:65%;--y:23%}.fp-card-5{--x:77%;--y:42%}
.fp-card-6{--x:60%;--y:61%}.fp-card-7{--x:38%;--y:73%}
}
/* Give the upper accent card similar visual weight to the rest. */
.fp-card-3{--w:227.7px;--h:164.22px}
@media(max-width:760px){.fp-card-3{--w:171.12px;--h:122.82px}}
/* Project each card with shared perspective, then composite it as a whole.
   Separate planes must overlap by paint order rather than intersect in 3D. */
.fp-cards{transform-style:flat}
.fp-card{transform-style:flat}
.fp-card-3{z-index:4}
.fp-card:hover,.fp-card:focus-visible{z-index:5}
/* A sticky stage scrubs the same linked cards into an aligned project grid. */
.fp-scroll-stage{height:230svh;position:relative}
.fp-scroll-stage .fp-hero{position:sticky;top:0;height:100svh;min-height:620px;max-height:none;--grid-progress:0}
.fp-scroll-stage .fp-copy{opacity:calc(1 - var(--grid-progress) * 2.5)}
.fp-scroll-cue{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.04em;opacity:calc(1 - var(--grid-progress) * 3);pointer-events:none}
.fp-morphing .fp-card{animation:none;opacity:1;will-change:transform,left,top,width,height}
.fp-morphing .fp-card-visual{animation:none;transform:none}
.fp-morphing .fp-card-caption{opacity:var(--grid-progress);transform:none}
@media(max-width:760px){.fp-scroll-stage .fp-hero{min-height:580px}.fp-scroll-cue{bottom:60px}}
.fp-gallery{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;border:0;margin:0;padding:0;color:#242522;font-family:Arial,Helvetica,sans-serif;overflow:hidden;overscroll-behavior:none}
.fp-gallery::backdrop{background:#24252280}
.fp-gallery *{box-sizing:border-box}
.fp-gallery-bar,.fp-gallery-footer{position:absolute;left:32px;right:32px;display:flex;justify-content:space-between;align-items:center;z-index:2;font-size:12px}
.fp-gallery-bar{top:24px}.fp-gallery-footer{bottom:20px;font-size:11px}
.fp-gallery button{font:inherit;color:inherit;background:transparent;border:1px solid #24252255;border-radius:100px;padding:12px 20px;cursor:pointer}
.fp-gallery button:focus-visible,.fp-gallery-track:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.fp-gallery nav{display:flex;gap:8px}.fp-gallery nav button{font-size:20px;padding:8px 20px}
.fp-gallery-track{position:absolute;inset:80px 0 80px;display:flex;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;touch-action:pan-x;overscroll-behavior-x:contain;cursor:grab;user-select:none}
.fp-gallery-track::-webkit-scrollbar{display:none}.fp-gallery-track.is-dragging{cursor:grabbing}
.fp-gallery-chapter{display:flex;flex:none;gap:4vw;padding-right:8vw;align-items:center;position:static}
.fp-gallery-intro{flex:0 0 60vw;width:60vw;padding:0 9vw;align-self:center}
.fp-gallery-kicker{font-size:10px;letter-spacing:2px;margin-bottom:28px}
.fp-gallery-intro h2{font:500 clamp(40px,6vw,90px)/1.02 Arial, sans-serif;letter-spacing:-.06em;margin:0 0 28px;color:inherit}
.fp-gallery-description{font-size:16px;line-height:1.7;max-width:430px;color:#242522bb}
.fp-gallery-direction{display:block;margin-top:44px;font-size:12px}
.fp-gallery-slide{flex:0 0 70vw;width:70vw;height:90%;margin:0;display:flex;flex-direction:column;justify-content:center;gap:16px}
.fp-gallery-slide img{width:100%;height:calc(100% - 40px);object-fit:contain;border-radius:18px;pointer-events:none}
.fp-gallery-slide figcaption{font-size:11px;letter-spacing:.02em}
@media(max-width:760px){.fp-gallery-bar,.fp-gallery-footer{left:20px;right:20px}.fp-gallery-current{max-width:65%;font-size:10px}.fp-gallery-footer>span{max-width:150px;line-height:1.6}.fp-gallery-intro{flex-basis:85vw;width:85vw;padding:0 8vw}.fp-gallery-slide{flex-basis:88vw;width:88vw;height:80%}.fp-gallery-description{font-size:14px}.fp-gallery-intro h2{font-size:54px}}
/* Let the gallery itself supply the fade; avoid an instant dark modal layer. */
.fp-gallery::backdrop{background:transparent}
html:has(.fp-scroll-stage){scrollbar-gutter:stable}
/* Fit the image element to the photo so its radius clips the visible pixels. */
.fp-gallery-slide{align-items:center}
.fp-gallery-slide img{width:auto;height:auto;max-width:100%;max-height:calc(100% - 40px);object-fit:contain;border-radius:24px;flex-shrink:1;min-height:0}
.fp-gallery-slide figcaption{align-self:stretch}
/* Keep spacing between actual image edges, including narrow full-page captures. */
.fp-gallery-chapter{gap:24px}
.fp-gallery-slide{flex:0 0 auto}
@media(max-width:760px){.fp-gallery-chapter{gap:16px}.fp-gallery-slide{height:90%}}
/* Two screenshots stack vertically; four share a two-column grid. */
.fp-gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:16px;width:100%;height:calc(100% - 40px);min-height:0}
.fp-gallery-group-2 .fp-gallery-grid{grid-template-columns:minmax(0,1fr)}
.fp-gallery-grid img{width:100%;height:100%;max-height:100%;max-width:100%;object-fit:contain;border-radius:16px;background:#ffffff55}
@media(max-width:760px){.fp-gallery-grid{gap:10px}.fp-gallery-grid img{border-radius:12px}}
.fp-gallery-live{display:inline-block;color:inherit;text-decoration:none;border-bottom:0;padding-bottom:0;cursor:pointer;user-select:auto}
.fp-gallery-live:hover{opacity:.65}
.fp-gallery-live:focus-visible{outline:2px solid currentColor;outline-offset:6px}
/* Enrichly cover experiment: independent screens float over the background. */
.fp-layered-card .fp-card-visual{overflow:visible;background:radial-gradient(ellipse at 85% 20%,#7870f5,transparent 65%),linear-gradient(135deg,#191a31,#3b29cc)}
.fp-layered-card .fp-card-visual>img{opacity:0}
.fp-cover-scene{position:absolute;inset:0;pointer-events:none}
.fp-cover-desktop{position:absolute;left:-7%;top:8%;width:100%;height:77%;border-radius:9px;background:#f5f4fc;padding-top:10px;box-shadow:5px 18px 25px #090a3155;transform:translate(calc(var(--px,0px) * .25),calc(var(--py,0px) * .25 - 10px)) rotate(-2deg);transition:transform .6s ease;overflow:hidden}
.fp-cover-desktop::before{content:'● ● ●';position:absolute;top:1px;left:7px;font-size:5px;letter-spacing:1px;color:#9793af;line-height:8px}
.fp-cover-scene .fp-cover-desktop img{height:100%;width:100%;object-fit:cover;object-position:top;border-radius:0 0 8px 8px}
.fp-cover-phone{position:absolute;right:-8%;bottom:-8%;width:32%;height:95%;border:4px solid #151526;border-radius:16px;background:#191a31;box-shadow:7px 19px 24px #090a3166;transform:translate(calc(var(--px,0px) * .55),calc(var(--py,0px) * .55 - 5px)) rotate(5deg);transition:transform .6s ease;overflow:hidden}
.fp-cover-phone::after{content:'';position:absolute;top:-1px;left:24%;width:52%;height:7px;border-radius:0 0 6px 6px;background:#151526}
.fp-cover-scene .fp-cover-phone img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:10px}
.fp-layered-card:hover .fp-cover-desktop{transform:translate(-4px,-16px) rotate(-3deg)}
.fp-layered-card:hover .fp-cover-phone{transform:translate(5px,-12px) rotate(7deg)}
.fp-layered-card .fp-card-caption{z-index:2;border-radius:0 0 25px 25px}
@media(prefers-reduced-motion:reduce){.fp-cover-desktop,.fp-cover-phone{transition:none}}
/* KMA keeps its architectural grid and neutral backdrop behind raised screens. */
.fp-layered-kma .fp-card-visual{background-color:#f2f1ee;background-image:linear-gradient(#d7d7d455 1px,transparent 1px),linear-gradient(90deg,#d7d7d455 1px,transparent 1px),linear-gradient(145deg,#fff,#e2e1dd);background-size:22px 22px,22px 22px,100% 100%}
.fp-layered-kma .fp-cover-desktop,.fp-layered-kma .fp-cover-phone{box-shadow:6px 18px 26px #181d2938}
/* Leave breathing room between the two layered project covers. */
.fp-card-0{--y:11%}
.fp-card-1{--y:43%}
@media(max-width:760px){.fp-card-0{--y:12%}.fp-card-1{--y:40%}}
/* Fold the raised screens back into their original cover during the grid morph. */
.fp-layered-card .fp-card-visual>img{opacity:clamp(0,calc(var(--grid-progress,0) * 2 - .35),1)}
.fp-layered-card .fp-cover-scene{opacity:clamp(0,calc(1 - var(--grid-progress,0) * 2),1);transform:scale(calc(1 - var(--grid-progress,0) * .12));transform-origin:center;will-change:transform,opacity}
.fp-layered-card .fp-cover-desktop,.fp-layered-card:hover .fp-cover-desktop{left:calc(-7% + var(--grid-progress,0) * 14%);top:calc(8% + var(--grid-progress,0) * 7%);transform:translate(calc(var(--px,0px) * .25 * (1 - var(--grid-progress,0))),calc(-10px * (1 - var(--grid-progress,0)))) rotate(calc(-2deg * (1 - var(--grid-progress,0))))}
.fp-layered-card .fp-cover-phone,.fp-layered-card:hover .fp-cover-phone{right:calc(-8% + var(--grid-progress,0) * 16%);bottom:calc(-8% + var(--grid-progress,0) * 16%);transform:translate(0,calc(-5px * (1 - var(--grid-progress,0)))) rotate(calc(5deg * (1 - var(--grid-progress,0))))}
.fp-is-scrolling .fp-cover-desktop,.fp-is-scrolling .fp-cover-phone{transition:none}
.fp-layered-card .fp-card-visual>img{border-radius:inherit}
/* Keep screenshot scale unchanged while retaining hover depth and labels. */
.fp-layered-card:hover img,.fp-layered-card:focus-visible img{transform:none}
/* Hover moves the screen frames, without scaling the screenshots. */
.fp-layered-card:hover .fp-cover-desktop,.fp-layered-card:focus-visible .fp-cover-desktop{transform:translate(calc(-4px * (1 - var(--grid-progress,0))),calc(-17px * (1 - var(--grid-progress,0)))) rotate(calc(-3deg * (1 - var(--grid-progress,0))))}
.fp-layered-card:hover .fp-cover-phone,.fp-layered-card:focus-visible .fp-cover-phone{transform:translate(calc(5px * (1 - var(--grid-progress,0))),calc(-13px * (1 - var(--grid-progress,0)))) rotate(calc(7deg * (1 - var(--grid-progress,0))))}
@media(prefers-reduced-motion:reduce){.fp-layered-card:hover .fp-cover-desktop,.fp-layered-card:focus-visible .fp-cover-desktop{transform:translate(0,-10px) rotate(-2deg)}.fp-layered-card:hover .fp-cover-phone,.fp-layered-card:focus-visible .fp-cover-phone{transform:translate(0,-5px) rotate(5deg)}}
/* Size the desktop frame from the screenshot's native proportions. */
.fp-cover-desktop{height:auto}
.fp-cover-scene .fp-cover-desktop img{display:block;width:100%;height:auto;object-fit:contain;max-width:100%}
/* Shade titles only on the flat grid, never over the raised screen layers. */
.fp-card-caption{background:linear-gradient(transparent,rgb(0 0 0 / calc(var(--grid-progress,0) * .6)))}
/* Match the grid's image zoom while preserving fixed-scale raised screens. */
.fp-layered-card:hover .fp-card-visual>img,.fp-layered-card:focus-visible .fp-card-visual>img{transform:scale(calc(1 + var(--grid-progress,0) * .08))}

.fp-grid-settled .fp-layered-card .fp-card-visual{overflow:hidden}

/* Restore floating interactions after returning from the scroll grid. */
.fp-morphing:not(.fp-is-scrolling) .fp-card-visual{animation:fp-float 7s ease-in-out infinite;transform:translate3d(var(--px,0px),var(--py,0px),0)}
.fp-morphing:not(.fp-is-scrolling) .fp-card:hover .fp-card-visual{animation-play-state:paused}
.fp-morphing:not(.fp-is-scrolling) .fp-card:hover .fp-card-caption,.fp-morphing:not(.fp-is-scrolling) .fp-card:focus-visible .fp-card-caption{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.fp-morphing:not(.fp-is-scrolling) .fp-card-visual{animation:none;transform:none}}
/* Center KMA more closely alongside the hero copy. */
.fp-card-1{--y:39%}
@media(max-width:760px){.fp-card-1{--y:36%}}
.fp-layered-warranty .fp-card-visual{background:radial-gradient(ellipse at 85% 20%,#9668ff,transparent 65%),linear-gradient(135deg,#290d5e,#5e12ee)}
.fp-layered-breaksight .fp-card-visual{background:radial-gradient(ellipse at 85% 20%,#3f8bef,transparent 65%),linear-gradient(135deg,#00193a,#004aad)}
.fp-layered-pathos .fp-card-visual{background:radial-gradient(ellipse at 85% 20%,#ad72d8,transparent 65%),linear-gradient(135deg,#101827,#3559a9)}
.fp-layered-echewa .fp-card-visual{background:radial-gradient(ellipse at 85% 20%,#f7a38d,transparent 65%),linear-gradient(135deg,#171d32,#ab655a)}
.fp-layered-kissux .fp-card-visual{background:radial-gradient(ellipse at 85% 20%,#e8a5cb,transparent 65%),linear-gradient(135deg,#2d183b,#8d5f9b)}
/* Give the right-hand project layers more breathing room. */
.fp-card-3{--x:62%;--y:7%}
.fp-card-4{--x:73%;--y:29%}
.fp-card-5{--x:78%;--y:55%}
.fp-card-6{--x:58%;--y:77%}
@media(max-width:760px){
.fp-card-3{--x:57%;--y:5%}
.fp-card-4{--x:71%;--y:27%}
.fp-card-5{--x:79%;--y:53%}
.fp-card-6{--x:57%;--y:77%}
}
@media(min-width:761px){.fp-card-5{--x:73%;--y:55%}.fp-card-6{--x:53%;--y:68%}}
/* A tighter right-hand cluster, between the previous two arrangements. */
.fp-card-3{--x:61.5%;--y:10.5%}
.fp-card-4{--x:70%;--y:26.5%}
.fp-card-5{--x:72%;--y:49.5%}
.fp-card-6{--x:56%;--y:66.5%}
@media(max-width:760px){
.fp-card-3{--x:56.5%;--y:9%}
.fp-card-4{--x:68%;--y:25%}
.fp-card-5{--x:78%;--y:47.5%}
.fp-card-6{--x:58.5%;--y:69%}
}

.fp-clutch{display:inline-flex;align-items:center;justify-content:center;gap:12px;pointer-events:auto;color:#293c39;text-decoration:none;font-size:14px;letter-spacing:0;text-transform:none;line-height:1.4}
.fp-clutch-stars{display:inline-flex;gap:3px}.fp-clutch-stars svg{width:20px;height:20px;fill:#ffdf35;stroke:#293c39;stroke-width:1.8;stroke-linejoin:round}
.fp-clutch:hover{opacity:.8}.fp-clutch:focus-visible{outline:2px solid currentColor;outline-offset:6px;border-radius:3px}
@media(max-width:760px){.fp-clutch{font-size:12px;gap:8px}.fp-clutch-stars{gap:1px}.fp-clutch-stars svg{width:16px;height:16px}}
/* Laptop: protect a clear center while keeping the full project orbit. */
@media(min-width:761px) and (max-width:1450px), (min-width:761px) and (max-height:780px){
.fp-card{width:calc(var(--w) * .75);height:calc(var(--h) * .75)}
.fp-copy{width:52%;top:48%}
.fp-copy h1{font-size:clamp(38px,4.4vw,64px)!important}
.fp-copy h1>span:not(.cc-anim-word){font-size:.62em}
.fp-card-0{--x:13%;--y:12%}.fp-card-1{--x:5%;--y:39%}.fp-card-2{--x:16%;--y:70%}
.fp-card-3{--x:67%;--y:9%}.fp-card-4{--x:79%;--y:33%}.fp-card-5{--x:78%;--y:62%}.fp-card-6{--x:56%;--y:77%}
.fp-clutch{font-size:12px;gap:8px}.fp-clutch-stars svg{width:16px;height:16px}
}
/* Tablet: fewer projecting layers, with compact screens framing the copy. */
@media(min-width:601px) and (max-width:1000px){
.fp-card{width:calc(var(--w) * .65);height:calc(var(--h) * .65)}
.fp-cover-phone{display:none}
.fp-cover-desktop{left:0!important;width:100%;box-shadow:3px 10px 20px #181d2925!important}
.fp-copy{width:66%;top:47%}.fp-copy h1{font-size:clamp(36px,5vw,48px)!important}
.fp-card-0{--x:12%;--y:12%}.fp-card-1{--x:0%;--y:35%}.fp-card-2{--x:12%;--y:73%}
.fp-card-3{--x:65%;--y:10%}.fp-card-4{--x:82%;--y:33%}.fp-card-5{--x:80%;--y:62%}.fp-card-6{--x:54%;--y:77%}
}
/* Phone: copy first, three featured cards beneath, all seven in the grid. */
@media(max-width:600px){
.fp-scroll-stage .fp-hero{min-height:620px}
.fp-copy{top:29%;width:92%}
.fp-copy h1{font-size:clamp(34px,9vw,48px)!important}
.fp-copy h1>span:not(.cc-anim-word){font-size:.62em;letter-spacing:-.04em;margin-top:10px}
.fp-eyebrow{margin-bottom:22px!important}.fp-hint{font-size:11px!important;margin-top:20px!important}
.fp-card{width:calc(var(--w) * .9);height:calc(var(--h) * .9)}
.fp-card-0{--x:10%;--y:50%}.fp-card-1{--x:51%;--y:60%}.fp-card-2{--x:11%;--y:74%}
.fp-card-3,.fp-card-4,.fp-card-5,.fp-card-6{visibility:hidden;pointer-events:none;--x:45%;--y:72%}
.fp-is-scrolling .fp-card-3,.fp-is-scrolling .fp-card-4,.fp-is-scrolling .fp-card-5,.fp-is-scrolling .fp-card-6{visibility:visible;pointer-events:auto;opacity:clamp(0,calc(var(--grid-progress) * 3),1)}
.fp-cover-phone{display:none}
.fp-cover-desktop{left:0!important;width:100%;box-shadow:3px 10px 20px #181d2925!important}
.fp-card-caption{font-size:10px}.fp-bottom{font-size:9px}.fp-bottom>span{max-width:110px}.fp-bottom>a{font-size:10px}
.fp-scroll-cue{bottom:66px;font-size:10px}
}
@media(min-width:601px) and (max-width:760px){.fp-card{width:calc(var(--w) * .9);height:calc(var(--h) * .9)}}
/* Compact laptops, including scaled 14-inch displays: reserve the center for copy. */
@media(min-width:1001px) and (max-width:1800px), (min-width:1001px) and (max-height:900px){
.fp-card{width:calc(var(--w) * .82);height:calc(var(--h) * .82)}
.fp-copy{width:48%;top:48%}
.fp-copy h1{font-size:clamp(34px,3.25vw,54px)!important;line-height:1.08!important;letter-spacing:-.055em!important}
.fp-copy h1>span:not(.cc-anim-word){font-size:.68em;line-height:1.15;max-width:100%;margin-top:14px}
.fp-card-0{--x:16%;--y:13%}.fp-card-1{--x:9%;--y:40%}.fp-card-2{--x:20%;--y:69%}
.fp-card-3{--x:65%;--y:12%}.fp-card-4{--x:75%;--y:32%}.fp-card-5{--x:73%;--y:56%}.fp-card-6{--x:55%;--y:72%}
.fp-clutch{font-size:12px}.fp-eyebrow{margin-bottom:24px!important}
.fp-hint{font-size:12px!important;margin-top:24px!important}
}
/* Smaller screens use tighter corners in proportion to the artwork. */
@media(max-width:1800px){
.fp-card,.fp-card-visual{border-radius:18px}
.fp-layered-card .fp-card-caption{border-radius:0 0 18px 18px}
.fp-cover-desktop{border-radius:7px}.fp-cover-scene .fp-cover-desktop img{border-radius:0 0 7px 7px}
.fp-cover-phone{border-radius:12px}.fp-cover-scene .fp-cover-phone img{border-radius:8px}
}
@media(max-width:760px){
.fp-card,.fp-card-visual{border-radius:12px}
.fp-layered-card .fp-card-caption{border-radius:0 0 12px 12px}
.fp-cover-desktop{border-radius:5px}.fp-cover-scene .fp-cover-desktop img{border-radius:0 0 5px 5px}
.fp-gallery-slide img{border-radius:14px}.fp-gallery-grid img{border-radius:10px}
}

.fp-hero,.fp-scroll-stage{background:#e8efe6}
