/* The opening scene responds to height as well as width. Text, product and CTA
   remain together at desktop zoom levels; no fixed 340px media offset. */
body.ftk-premium-page.home .hero{height:calc(100svh - 96px);min-height:440px;max-height:1000px}
body.ftk-premium-page.home .hero-world{mask-image:linear-gradient(to bottom,black 92%,transparent);z-index:0}
body.ftk-premium-page.home .hero-stage{width:96%;left:6%;top:50%;transform:translateY(-50%);mask-image:linear-gradient(to bottom,transparent,black 5%,black 94%,transparent),linear-gradient(to right,transparent,black 10%,black);mask-composite:intersect}
body.ftk-premium-page.home .hero-content{width:48%;padding-top:clamp(62px,14svh,160px);margin-left:var(--gutter);z-index:2}
body.ftk-premium-page.home .hero h1{font-size:clamp(42px,5.1vw,82px);line-height:1.45;letter-spacing:-.035em}
body.ftk-premium-page.home .hero-content>p{font-size:15px;margin-top:26px;line-height:2}
body.ftk-premium-page.home .hero-actions{position:static;display:flex;justify-content:flex-start;gap:24px;margin-top:32px}
body.ftk-premium-page.home .hero-actions .button{background:#826738;min-width:205px;padding:18px 27px;font-size:14px;min-height:60px}
body.ftk-premium-page.home .hero-actions .button:hover{background:#695329}
body.ftk-premium-page.home .hero-actions .text-link{min-height:60px;border:1px solid #9a8560;padding:17px 23px;background:#fcfbf9d9;gap:24px;font-size:13px}
body.ftk-premium-page.home .scroll-hint{z-index:2;bottom:18px}
/* Keep the reflective scene expansive. Scale the shared product composition so
   overlapping source regions stay aligned throughout the entrance animation. */
body.ftk-premium-page.home .hero-objects-group{position:absolute;inset:0;transform-origin:70% 50%}
@media(min-width:768px){
 body.ftk-premium-page.home .hero-objects-group{scale:.75;translate:0 -1.5%}
}
@media(min-width:768px) and (max-width:1100px){
 body.ftk-premium-page.home .site-header{height:76px;flex-wrap:nowrap;gap:16px;padding-inline:4vw}
 body.ftk-premium-page.home .brand>span{font-size:17px;letter-spacing:.1em}body.ftk-premium-page.home .brand small{font-size:6px;letter-spacing:.34em}
 body.ftk-premium-page.home .desktop-nav{order:initial;width:auto;margin-left:auto;gap:16px;font-size:11px;justify-content:initial}
 body.ftk-premium-page.home .desktop-nav a,body.ftk-premium-page.home .business-nav summary{padding:12px 0}
 body.ftk-premium-page.home .header-contact{font-size:11px;padding:10px 12px;gap:12px;margin-left:0}
 body.ftk-premium-page.home .hero{height:calc(100svh - 76px);min-height:350px;max-height:800px}
 body.ftk-premium-page.home .hero-stage{width:98%;left:7%;top:50%;transform:translateY(-50%)}
 body.ftk-premium-page.home .hero-content{width:48%;padding-top:clamp(32px,9svh,85px);margin-left:4vw}
 body.ftk-premium-page.home .hero h1{font-size:clamp(34px,5vw,54px)}
 body.ftk-premium-page.home .hero-content>p{font-size:12px;margin-top:18px;max-width:320px}
 body.ftk-premium-page.home .hero-actions{gap:12px;margin-top:24px}
 body.ftk-premium-page.home .hero-actions .button{min-width:145px;padding:14px 16px;min-height:48px;font-size:12px;gap:18px}
 body.ftk-premium-page.home .hero-actions .text-link{min-height:48px;padding:12px 14px;font-size:11px;gap:12px}
 body.ftk-premium-page.home .scroll-hint{font-size:10px;bottom:10px}
}
@media(min-width:768px) and (max-height:600px){
 body.ftk-premium-page.home .hero-content{padding-top:30px}
 body.ftk-premium-page.home .hero h1{font-size:clamp(34px,4.7vw,58px)}
 body.ftk-premium-page.home .hero-content>p{margin-top:16px}
 body.ftk-premium-page.home .hero-actions{margin-top:22px}
 body.ftk-premium-page.home .scroll-hint{display:none}
}
@media(min-width:768px) and (max-width:850px){
 body.ftk-premium-page.home .site-header{gap:12px;padding-inline:24px}
 body.ftk-premium-page.home .desktop-nav{gap:13px;font-size:10px}
 body.ftk-premium-page.home .header-contact{display:none}
 body.ftk-premium-page.home .hero-actions{gap:10px}
 body.ftk-premium-page.home .hero-actions .button{min-width:130px}
 body.ftk-premium-page.home .hero-actions .text-link{padding-inline:10px;font-size:10px}
}
@media(max-width:767px){
 body.ftk-premium-page.home .hero{height:calc(100svh - 80px);min-height:660px;max-height:850px;display:flex;flex-direction:column}
 body.ftk-premium-page.home .hero-content{width:auto;margin-inline:var(--gutter);padding-top:22px;position:static}
 body.ftk-premium-page.home .hero h1{font-size:clamp(34px,10.5vw,49px);line-height:1.43}
 body.ftk-premium-page.home .hero-content>p{font-size:12px;margin-top:13px;line-height:1.8}
 body.ftk-premium-page.home .hero-world{mask-image:linear-gradient(to bottom,transparent,black 12%,black 92%,transparent)}
 body.ftk-premium-page.home .hero-stage{width:620px;left:calc(50% - 408px);top:194px;transform:none;mask-image:linear-gradient(to bottom,transparent,black 5%,black 92%,transparent)}
 body.ftk-premium-page.home .hero-actions{position:absolute;top:auto;bottom:42px;left:var(--gutter);right:var(--gutter);justify-content:space-between;margin:0;gap:12px}
 body.ftk-premium-page.home .hero-actions .button{min-width:0;flex:1;min-height:54px;padding:15px 16px;font-size:12px;gap:12px}
 body.ftk-premium-page.home .hero-actions .text-link{min-height:54px;padding:14px 12px;font-size:10px;gap:10px;flex:1;white-space:nowrap}
 body.ftk-premium-page.home .scroll-hint{bottom:0;font-size:10px;min-height:36px}
}
@media(max-width:359px){
 body.ftk-premium-page.home .hero{min-height:635px}
 body.ftk-premium-page.home .hero-stage{width:560px;left:calc(50% - 370px);top:196px}
 body.ftk-premium-page.home .hero-actions{gap:8px}
 body.ftk-premium-page.home .hero-actions .button{padding-inline:12px;font-size:11px}
 body.ftk-premium-page.home .hero-actions .text-link{padding-inline:8px;font-size:9px}
}
/* Small landscape windows and zoomed laptop views need an art-led side-by-side
   scene, not the tall phone composition. Scrolling remains available. */
@media(min-width:500px) and (max-width:767px) and (max-height:650px){
 body.ftk-premium-page.home .site-header{height:64px}
 body.ftk-premium-page.home .mobile-menu[open]>nav{top:64px}
 body.ftk-premium-page.home .hero{height:calc(100svh - 64px);min-height:335px;max-height:none;display:block}
 body.ftk-premium-page.home .hero-content{position:relative;width:54%;margin-left:24px;padding-top:30px}
 body.ftk-premium-page.home .hero h1{font-size:clamp(28px,5.2vw,40px)}
 body.ftk-premium-page.home .hero-content>p{font-size:11px;max-width:260px}
 body.ftk-premium-page.home .hero-stage{width:106%;left:0;top:50%;transform:translateY(-50%)}
 body.ftk-premium-page.home .hero-actions{position:static;margin-top:22px;gap:8px;display:flex;flex-wrap:wrap;justify-content:flex-start}
 body.ftk-premium-page.home .hero-actions .button,body.ftk-premium-page.home .hero-actions .text-link{flex:initial;min-height:44px;font-size:10px;padding:12px;gap:10px}
 body.ftk-premium-page.home .hero-actions .text-link{border:0;border-bottom:1px solid #9a8560;background:transparent}
 body.ftk-premium-page.home .scroll-hint{display:none}
}

/* Product photographs remain intact: no clipping, skewing, perspective or
   independent axis scaling. Only the initial entrance moves the photographs; no repeating product motion. */
body.ftk-premium-page.home .hero-objects-group{scale:1;translate:0 0}
body.ftk-premium-page.home .hero-layer{inset:auto;clip-path:none;transform-origin:center}
body.ftk-premium-page.home .hero-stage .hero-product-photo{position:static;inset:auto;width:100%;height:auto;object-fit:contain}
body.ftk-premium-page.home .photo-round{left:45%;top:34%;width:22%;rotate:-9deg}
body.ftk-premium-page.home .photo-flower{left:70%;top:16%;width:17%;rotate:12deg}
body.ftk-premium-page.home .photo-sable{left:51%;top:58%;width:36%;rotate:-12deg}
body.ftk-premium-page.home .photo-heart{left:86%;top:39%;width:12%;rotate:18deg}
@media(max-width:767px){
 body.ftk-premium-page.home .photo-round{width:21%;left:45%;top:32%}
 body.ftk-premium-page.home .photo-flower{width:17%;left:70%;top:15%}
 body.ftk-premium-page.home .photo-sable{width:43%;left:47%;top:58%}
 body.ftk-premium-page.home .photo-heart{width:11%;left:86%;top:38%}
}

/* The backdrop fills the viewport independently of product geometry. Resizing
   never exposes the right edge of a fixed-width image canvas. */
body.ftk-premium-page.home .hero-world{container-type:size;mask-image:none}
body.ftk-premium-page.home .hero-scene{position:absolute;inset:0;mask-image:linear-gradient(to bottom,transparent,black 10%,black 82%,transparent)}
body.ftk-premium-page.home .hero-scene .hero-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% 50%}
body.ftk-premium-page.home .hero-stage{width:min(96%,175cqh);left:auto;right:0;top:50%;transform:translateY(-50%);mask-image:none}
body.ftk-premium-page.home .photo-heart{left:84%;width:10%}
@media(max-width:767px){
 body.ftk-premium-page.home .hero-scene{top:190px;bottom:100px;mask-image:linear-gradient(to bottom,transparent,black 12%,black 78%,transparent)}
 body.ftk-premium-page.home .hero-scene .hero-background{object-position:72% 50%}
 body.ftk-premium-page.home .hero-stage{width:min(100%,620px);left:50%;right:auto;top:194px;transform:translateX(-50%)}
 body.ftk-premium-page.home .photo-round{left:9%;top:32%;width:29%}
 body.ftk-premium-page.home .photo-flower{left:57%;top:8%;width:24%}
 body.ftk-premium-page.home .photo-sable{left:25%;top:54%;width:62%}
 body.ftk-premium-page.home .photo-heart{left:79%;top:31%;width:16%}
}
@media(min-width:500px) and (max-width:767px) and (max-height:650px){
 body.ftk-premium-page.home .hero-scene{inset:0}
 body.ftk-premium-page.home .hero-stage{width:min(94%,175cqh);left:auto;right:0;top:50%;transform:translateY(-50%)}
 body.ftk-premium-page.home .photo-round{left:45%;top:34%;width:22%}
 body.ftk-premium-page.home .photo-flower{left:70%;top:16%;width:17%}
 body.ftk-premium-page.home .photo-sable{left:51%;top:58%;width:36%}
 body.ftk-premium-page.home .photo-heart{left:84%;top:39%;width:10%}
}

@media(min-width:768px){
 body.ftk-premium-page.home .hero-scene{mask-image:linear-gradient(to bottom,transparent,black 10%,black 82%,transparent),linear-gradient(to right,transparent 0%,transparent 24%,black 60%);mask-composite:intersect}
}
@media(min-width:500px) and (max-width:767px) and (max-height:650px){
 body.ftk-premium-page.home .hero-scene{mask-image:linear-gradient(to bottom,transparent,black 10%,black 82%,transparent),linear-gradient(to right,transparent 0%,transparent 24%,black 60%);mask-composite:intersect}
}

/* Both headline lines fit as complete phrases, including 320px screens. */
@media(max-width:767px){body.ftk-premium-page.home .hero h1{font-size:clamp(28px,9.2vw,48px)}body.ftk-premium-page.home .type-line>span{white-space:nowrap}}
@media(min-width:500px) and (max-width:767px) and (max-height:650px){body.ftk-premium-page.home .hero h1{font-size:clamp(25px,4.7vw,36px)}}

/* TOP motion: overscan keeps the photographic canvas inside a stationary mask.
   Only the backdrop and its light move after the single product entrance. */
body.ftk-premium-page.home .hero-scene{overflow:hidden}
body.ftk-premium-page.home .hero-scene .hero-background{inset:-10%;width:120%;height:120%;max-width:none;transform-origin:65% 50%;animation:backdrop-travel 12s cubic-bezier(.45,0,.55,1) infinite alternate;animation-play-state:paused;will-change:transform}
body.ftk-premium-page.home .hero-scene::after{content:"";position:absolute;inset:-25%;pointer-events:none;background:linear-gradient(112deg,transparent 30%,rgba(177,137,74,.09) 39%,rgba(255,252,241,.48) 47%,rgba(255,247,224,.26) 53%,transparent 63%);mix-blend-mode:soft-light;animation:backdrop-light 8s cubic-bezier(.4,0,.6,1) infinite alternate;animation-play-state:paused;will-change:transform}
body.ftk-premium-page.home .hero[data-motion-visible=true] .hero-background,body.ftk-premium-page.home .hero[data-motion-visible=true] .hero-scene::after{animation-play-state:running}
@keyframes backdrop-travel{from{transform:translate3d(-3.5%,2%,0) scale(1.025) rotate(-.6deg)}to{transform:translate3d(3.5%,-2.5%,0) scale(1.07) rotate(.6deg)}}
@keyframes backdrop-light{from{transform:translate3d(-28%,0,0)}to{transform:translate3d(28%,0,0)}}
body.ftk-premium-page.home .type-line>span{white-space:nowrap}
@media(min-width:768px){body.ftk-premium-page.home .hero h1{font-size:clamp(34px,4.7vw,82px)}}
@media(max-width:767px){body.ftk-premium-page.home .hero-scene .hero-background{object-position:72% 50%;animation-duration:10s}}

/* One entrance per page load, independent from the repeating backdrop. */
body.ftk-premium-page.home .photo-round{--entry-x:-110px;--entry-y:75px;--entry-turn:-12deg;--entry-delay:0ms}
body.ftk-premium-page.home .photo-flower{--entry-x:80px;--entry-y:-100px;--entry-turn:15deg;--entry-delay:90ms}
body.ftk-premium-page.home .photo-sable{--entry-x:130px;--entry-y:100px;--entry-turn:10deg;--entry-delay:180ms}
body.ftk-premium-page.home .photo-heart{--entry-x:90px;--entry-y:-30px;--entry-turn:-12deg;--entry-delay:270ms}
body.ftk-premium-page.home .hero[data-entry=playing] .hero-layer{animation:product-arrival 1.1s cubic-bezier(.16,1,.3,1) var(--entry-delay) 1 backwards}
@keyframes product-arrival{from{opacity:0;transform:translate3d(var(--entry-x),var(--entry-y),0) rotate(var(--entry-turn))}to{opacity:1;transform:none}}