/* Banner-only styles. Feelframe's installed Neo fonts and public product images. */
#ff-main-banner {
  --ff-ink: #24221f;
  --ff-line: #e7e5e2;
  width: 100%;
  padding: 18px 0 0;
  overflow: hidden;
  color: var(--ff-ink);
  font-family: 'Neo_R', sans-serif;
}
#ff-main-banner *, #ff-main-banner *::before, #ff-main-banner *::after { box-sizing: border-box; }
#ff-main-banner .ff-banner__swiper { width: 100%; padding: 10px 0 8px; overflow: visible; }
#ff-main-banner .swiper-wrapper { align-items: stretch; height: auto; transition-timing-function: ease-in-out; }
#ff-main-banner .ff-banner__slide {
  flex-shrink: 0;
  width: 400px;
  height: 500px;
  border-radius: 16px;
  overflow: hidden;
  background: #f3f0eb;
  position: relative;
  isolation: isolate;
  transition: transform .28s ease;
}
#ff-main-banner .ff-banner__slide::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(25, 24, 22, .5);
  opacity: 0;
  pointer-events: none;
  transition: opacity .4s ease;
}
#ff-main-banner.is-ready .ff-banner__slide:not(.is-visible)::after { opacity: 1; }
#ff-main-banner .ff-banner__card { position: relative; display: block; width: 100%; height: 100%; color: inherit; text-decoration: none; }
#ff-main-banner .ff-banner__picture { position: absolute; inset: 164px 0 0; overflow: hidden; background: #fff; }
#ff-main-banner .ff-banner__picture img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; user-select: none; }
#ff-main-banner .ff-banner__picture::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, var(--ff-card-bg, #f3f0eb), transparent 24%, transparent 78%, rgba(16, 13, 9, .1)); pointer-events: none; }
#ff-main-banner .ff-banner__copy { position: relative; z-index: 1; padding: 31px 30px 0; }
#ff-main-banner .ff-banner__eyebrow { display: block; font-family: 'Neo_SemiBold', sans-serif; font-size: 11px; line-height: 1.5; letter-spacing: 1.6px; color: #6c6258; margin-bottom: 13px; }
#ff-main-banner h2 { font-family: 'Neo_Bold', sans-serif; font-weight: normal; font-size: 30px; line-height: 1.4; letter-spacing: -1.1px; margin: 0; color: var(--ff-ink); }
#ff-main-banner .ff-banner__copy p { font-family: 'Neo_R', sans-serif; font-size: 13px; line-height: 1.65; letter-spacing: -.35px; margin: 11px 0 0; color: #686159; }
#ff-main-banner .ff-banner__cta { position: absolute; z-index: 2; left: 28px; bottom: 25px; display: inline-flex; align-items: center; gap: 17px; min-height: 42px; padding: 11px 17px 11px 19px; border-radius: 30px; background: #fff; color: #2c2723; box-shadow: 0 3px 15px rgba(39, 32, 21, .07); font-family: 'Neo_SemiBold', sans-serif; font-size: 12px; line-height: 20px; }
#ff-main-banner svg { display: block; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
#ff-main-banner .ff-banner__cta svg { width: 17px; height: 17px; transition: transform .2s ease; }
#ff-main-banner .ff-banner__slide--wedding { --ff-card-bg: #efeeec; background: var(--ff-card-bg); }
#ff-main-banner .ff-banner__slide--wedding .ff-banner__picture { inset: 0; }
#ff-main-banner .ff-banner__slide--wedding .ff-banner__picture::after { background: linear-gradient(to bottom, rgba(240, 239, 237, .93), rgba(240, 239, 237, .82) 34%, transparent 53%); }
#ff-main-banner .ff-banner__slide--wood { --ff-card-bg: #eee9e2; background: var(--ff-card-bg); }
#ff-main-banner .ff-banner__slide--collage { --ff-card-bg: #eeedeb; background: var(--ff-card-bg); }
#ff-main-banner .ff-banner__slide--table { --ff-card-bg: #f5efed; background: var(--ff-card-bg); }
#ff-main-banner .ff-banner__slide--together { --ff-card-bg: #f2eee7; background: var(--ff-card-bg); }
#ff-main-banner .ff-banner__slide--acrylic { --ff-card-bg: #edf0f1; background: var(--ff-card-bg); }
/* An aquarium-inspired corporate collection; copy remains selectable HTML. */
#ff-main-banner .ff-banner__slide--enterprise { --ff-card-bg: #072d43; background: var(--ff-card-bg); color: #fff; }
#ff-main-banner .ff-banner__slide--enterprise .ff-banner__picture { inset: 0; }
#ff-main-banner .ff-banner__slide--enterprise .ff-banner__picture img { object-position: center; }
#ff-main-banner .ff-banner__slide--enterprise .ff-banner__picture::after {
  background: linear-gradient(180deg, rgba(3, 20, 37, .43) 0%, rgba(3, 20, 37, .18) 43%, transparent 65%, rgba(3, 20, 37, .3) 100%);
}
#ff-main-banner .ff-banner__slide--enterprise .ff-banner__eyebrow { color: #fff; opacity: .82; letter-spacing: 1.7px; }
#ff-main-banner .ff-banner__slide--enterprise h2 { color: #fff; font-size: 26px; line-height: 1.45; letter-spacing: -1px; }
#ff-main-banner .ff-banner__slide--enterprise .ff-banner__copy p { color: #fff; font-size: 13px; line-height: 1.8; letter-spacing: -.3px; margin-top: 14px; }
#ff-main-banner .ff-banner__slide--enterprise .ff-banner__copy strong { color: inherit; font-family: 'Neo_Bold', sans-serif; font-weight: normal; }
#ff-main-banner .ff-banner__slide--enterprise .ff-banner__cta {
  color: #fff; background: rgba(4, 30, 47, .68); border: 1px solid rgba(255, 255, 255, .6);
  box-shadow: none; backdrop-filter: blur(8px);
}
#ff-main-banner .ff-banner__slide--enterprise .ff-banner__cta svg,
#ff-main-banner .ff-banner__slide--enterprise .ff-banner__cta svg * { color: inherit; }
#ff-main-banner .ff-banner__slide--enterprise :focus-visible { outline-color: #fff; }
#ff-main-banner .ff-banner__controls { display: flex; align-items: center; gap: 26px; width: 100%; max-width: 1400px; margin: 20px auto 0; padding: 0 20px; }
#ff-main-banner .ff-banner__controls[hidden] { display: none; }
#ff-main-banner .ff-banner__progress { position: relative; height: 2px; flex: 1; border-radius: 2px; background: var(--ff-line); overflow: hidden; }
#ff-main-banner .ff-banner__progress span { display: block; height: 100%; width: 11.1111%; background: var(--ff-ink); transition: width .35s ease; }
#ff-main-banner .ff-banner__buttons { display: flex; align-items: center; gap: 4px; }
#ff-main-banner .ff-banner__buttons button { width: 40px; height: 40px; padding: 0; margin: 0; display: flex; align-items: center; justify-content: center; color: #393532; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }
#ff-main-banner .ff-banner__count { min-width: 43px; text-align: center; color: #8f8a85; font-family: 'Neo_R', sans-serif; font-size: 13px; font-variant-numeric: tabular-nums; letter-spacing: 1px; }
#ff-main-banner .ff-banner__count b { font-family: 'Neo_SemiBold', sans-serif; color: #24221f; font-weight: normal; }
#ff-main-banner .ff-banner__play-icon, #ff-main-banner.is-paused .ff-banner__pause-icon { display: none; }
#ff-main-banner.is-paused .ff-banner__play-icon { display: block; }
#ff-main-banner :focus-visible { outline: 2px solid #6b5a48; outline-offset: -4px; }
#ff-main-banner .ff-banner__sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
/* A usable, scrollable catalogue remains if the slider script cannot run. */
#ff-main-banner:not(.is-ready) .ff-banner__swiper { overflow-x: auto; }
#ff-main-banner:not(.is-ready) .swiper-wrapper { gap: 16px; padding: 0 20px; }
@media (hover: hover) and (pointer: fine) {
  #ff-main-banner .ff-banner__slide.is-visible:hover { transform: translateY(-7px); }
  #ff-main-banner .ff-banner__card:hover .ff-banner__cta svg { transform: translateX(3px); }
  #ff-main-banner .ff-banner__buttons button:hover { background: #f3f1ee; }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #ff-main-banner .ff-banner__slide { width: 32%; min-width: 285px; height: 450px; }
  #ff-main-banner .ff-banner__copy { padding: 28px 22px 0; }
  #ff-main-banner h2 { font-size: 26px; }
  #ff-main-banner .ff-banner__copy p { font-size: 12px; letter-spacing: -.5px; }
  #ff-main-banner .ff-banner__picture { top: 158px; }
  #ff-main-banner .ff-banner__cta { left: 22px; bottom: 23px; }
  #ff-main-banner .ff-banner__slide--enterprise h2 { font-size: 23px; letter-spacing: -1.1px; }
}
@media (max-width: 767px) {
  #ff-main-banner { padding-top: 8px; }
  #ff-main-banner .ff-banner__swiper { padding-top: 8px; }
  #ff-main-banner .ff-banner__slide { width: calc(100% - 40px); max-width: 400px; height: 470px; }
  #ff-main-banner .ff-banner__copy { padding: 29px 24px 0; }
  #ff-main-banner h2 { font-size: 28px; }
  #ff-main-banner .ff-banner__copy p { font-size: 12px; }
  #ff-main-banner .ff-banner__picture { top: 158px; }
  #ff-main-banner .ff-banner__cta { left: 23px; bottom: 23px; }
  #ff-main-banner .ff-banner__controls { margin-top: 10px; padding: 0 20px; gap: 18px; }
  #ff-main-banner .ff-banner__buttons { gap: 0; }
  #ff-main-banner .ff-banner__buttons button { width: 42px; height: 42px; }
  #ff-main-banner .ff-banner__slide--enterprise h2 { font-size: clamp(22px, 6.5vw, 26px); letter-spacing: -1.05px; }
}
@media (max-width: 359px) {
  #ff-main-banner .ff-banner__slide { height: 430px; }
  #ff-main-banner .ff-banner__copy { padding-left: 20px; padding-right: 20px; }
  #ff-main-banner h2 { font-size: 25px; }
  #ff-main-banner .ff-banner__copy p { font-size: 11px; }
  #ff-main-banner .ff-banner__picture { top: 150px; }
  #ff-main-banner .ff-banner__slide--enterprise h2 { font-size: 21px; letter-spacing: -1px; }
  #ff-main-banner .ff-banner__slide--enterprise .ff-banner__copy p { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  #ff-main-banner *, #ff-main-banner *::after { transition: none !important; animation: none !important; }
}

/* Approved aquarium SVG motion. Shared definitions stay outside cloned slides. */
#ff-main-banner .ff-banner__fish-library { position:absolute; width:0; height:0; overflow:hidden; pointer-events:none; stroke:none; }
#ff-main-banner .ff-banner__aquarium-life { position:absolute; z-index:0; top:42.8%; left:0; right:0; height:15.6%; pointer-events:none; overflow:hidden; mask-image:linear-gradient(180deg,transparent,#000 15%,#000 73%,transparent); opacity:.72; }
#ff-main-banner .ff-fish-school { position:absolute; left:0; top:8px; width:180px; height:60px; animation:ff-aquarium-east 38s linear -9s infinite; animation-play-state:paused; }
#ff-main-banner .ff-fish-school--far { top:28px; opacity:.45; filter:blur(.3px); animation:ff-aquarium-west 49s linear -27s infinite; animation-play-state:paused; }
#ff-main-banner .ff-swimmer { position:absolute; width:28px; height:12px; overflow:visible; stroke:none; animation:ff-aquarium-drift 3.4s ease-in-out infinite alternate; animation-play-state:paused; transform-origin:center; }
/* Owner refinement: each fish is 20% smaller than the approved motion preview. */
#ff-main-banner .ff-swimmer--one { left:0; top:18px; width:24.8px; height:10.4px; opacity:.8; animation-delay:-.7s; }
#ff-main-banner .ff-swimmer--two { left:43px; top:8px; width:29.6px; height:12.8px; animation-delay:-1.6s; }
#ff-main-banner .ff-swimmer--three { left:85px; top:27px; width:21.6px; height:9.6px; opacity:.75; animation-delay:-2.7s; }
#ff-main-banner .ff-swimmer--four { left:110px; top:4px; width:24.8px; height:10.4px; opacity:.8; animation-delay:-.3s; }
#ff-main-banner .ff-swimmer--five { left:150px; top:20px; width:20.8px; height:8.8px; opacity:.65; animation-delay:-2s; }
#ff-main-banner .ff-fish-school--far .ff-swimmer { scale:-.7 .7; }
#ff-main-banner.is-aquarium-playing .swiper-slide-active .ff-fish-school,
#ff-main-banner.is-aquarium-playing .swiper-slide-active .ff-swimmer { animation-play-state:running; }
@keyframes ff-aquarium-east { from { transform:translate3d(-180px,0,0) } to { transform:translate3d(560px,0,0) } }
@keyframes ff-aquarium-west { from { transform:translate3d(500px,0,0) } to { transform:translate3d(-230px,0,0) } }
@keyframes ff-aquarium-drift { from { transform:translateY(-1.7px) rotate(-1deg) scaleY(.94) } to { transform:translateY(1.7px) rotate(1deg) scaleY(1.04) } }
@media (max-width:359px) { #ff-main-banner .ff-banner__aquarium-life { top:210px; height:52px; } }
@media (prefers-reduced-motion:reduce) { #ff-main-banner .ff-banner__aquarium-life { display:none; } }

/* Approved warranty / group-buy cards. Full-bleed acrylic product artwork. */
#ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) { color:#fff; }
#ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) * { color:inherit; }
#ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) .ff-banner__picture { inset:0; }
#ff-main-banner .ff-banner__slide--warranty { background:#3a2d23; }
#ff-main-banner .ff-banner__slide--warranty .ff-banner__picture::after { background:linear-gradient(180deg,rgba(26,21,17,.18),transparent 56%,transparent 78%,rgba(18,14,11,.3)); }
#ff-main-banner .ff-banner__slide--groupbuy { background:#E59C4E; }
#ff-main-banner .ff-banner__slide--groupbuy .ff-banner__picture::after { background:linear-gradient(180deg,rgba(73,34,11,.4) 0%,rgba(73,34,11,.3) 30%,transparent 56%,transparent 77%,rgba(71,31,8,.53) 100%); }
#ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) .ff-banner__eyebrow { opacity:.9; }
#ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) h2 { font-size:26px; line-height:1.45; letter-spacing:-1px; }
#ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) .ff-banner__copy p { color:inherit; font-size:13px; line-height:1.8; letter-spacing:-.3px; margin:14px 0 0; }
#ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) strong { font-family:'Neo_Bold',sans-serif; font-weight:normal; }
#ff-main-banner .ff-banner__corner-icon { position:absolute; right:27px; top:29px; width:29px; height:33px; fill:none; stroke:#fff; stroke-width:1.3; opacity:.85; }
#ff-main-banner .ff-banner__corner-icon--tag { height:29px; top:31px; stroke-width:1.25; }
#ff-main-banner .ff-banner__corner-icon * { stroke:inherit; }
#ff-main-banner .ff-banner__certificate-label { position:absolute; left:30.5%; top:63.8%; width:27%; color:#665848; transform:skewX(-5.5deg) rotate(.5deg); transform-origin:left top; pointer-events:none; }
#ff-main-banner .ff-banner__certificate-label span { display:block; }
#ff-main-banner .ff-banner__certificate-brand { font-family:'Neo_Bold',sans-serif; font-size:7px; letter-spacing:-.2px; line-height:1.4; }
#ff-main-banner .ff-banner__certificate-title { font-family:'Neo_SemiBold',sans-serif; font-size:10px; letter-spacing:1.8px; margin-top:12px; line-height:1.6; }
#ff-main-banner .ff-banner__certificate-en { font-size:4px; line-height:2; letter-spacing:.7px; opacity:.7; }
#ff-main-banner .ff-banner__certificate-rule { width:80%; height:1px; background:#a39786; opacity:.4; margin-top:9px; }
#ff-main-banner .ff-banner__offer { display:flex; align-items:baseline; gap:7px; margin-top:8px; white-space:nowrap; }
#ff-main-banner .ff-banner__offer-label { font-family:'Neo_SemiBold',sans-serif; font-size:14px; letter-spacing:-.5px; margin-right:4px; }
#ff-main-banner .ff-banner__offer-max { font-size:12px; letter-spacing:-.4px; }
#ff-main-banner .ff-banner__offer-number { font-size:52px; line-height:1.2; letter-spacing:-2.7px; font-variant-numeric:lining-nums; }
#ff-main-banner .ff-banner__offer-number>span { font-size:32px; letter-spacing:-1px; margin-left:1px; }
#ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) .ff-banner__cta { padding:10px 17px 10px 19px; border:1px solid rgba(255,255,255,.65); background:rgba(31,22,15,.58); box-shadow:none; backdrop-filter:blur(8px); letter-spacing:-.1px; }
#ff-main-banner .ff-banner__slide--groupbuy .ff-banner__cta { background:rgba(82,39,15,.65); }
#ff-main-banner .ff-banner__offer-note { position:absolute; z-index:1; left:30px; bottom:8px; font-size:10px; line-height:12px; letter-spacing:-.2px; }
#ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) :focus-visible { outline-color:#fff; }
/* Native dialog: focus is constrained while open and returns to the clicked card. */
#ff-main-banner .ff-banner__dialog { position:fixed; inset:0; margin:auto; padding:36px; width:440px; max-width:calc(100vw - 32px); max-height:calc(100dvh - 32px); border:0; border-radius:18px; background:#fff; color:#302d28; overflow:auto; text-align:left; box-shadow:0 18px 70px #0003; }
#ff-main-banner .ff-banner__dialog:not([open]) { display:none; }
#ff-main-banner .ff-banner__dialog::backdrop { background:rgba(20,17,13,.5); }
#ff-main-banner .ff-banner__dialog * { color:inherit; }
#ff-main-banner .ff-banner__dialog-close { position:absolute; top:10px; right:10px; display:grid; place-items:center; width:36px; height:36px; padding:0; border:0; border-radius:50%; background:#f5f2ed; cursor:pointer; }
#ff-main-banner .ff-banner__dialog-label { display:block; color:#9d754c; font-size:10px; letter-spacing:1.6px; margin:7px 0 14px; }
#ff-main-banner .ff-banner__dialog h2 { font-size:24px; line-height:1.5; letter-spacing:-.7px; }
#ff-main-banner .ff-banner__dialog p { font-size:14px; line-height:1.85; word-break:keep-all; margin:15px 0 0; }
#ff-main-banner .ff-banner__guarantees { display:grid; gap:14px; grid-template-columns:1fr 1fr; border:1px solid #eee4d6; background:#fcf8f1; border-radius:12px; padding:20px 14px; margin:24px 0 0; }
#ff-main-banner .ff-banner__guarantees strong { display:block; font-family:'Neo_Bold',sans-serif; font-size:15px; font-weight:400; line-height:1.6; }
#ff-main-banner .ff-banner__guarantees span { display:block; font-size:11px; line-height:1.7; margin-top:5px; }
#ff-main-banner .ff-banner__dialog p.ff-banner__dialog-note { font-size:12px; color:#787065; }
#ff-main-banner .ff-banner__dialog-link { display:flex; align-items:center; justify-content:center; gap:16px; border-radius:9px; background:#41362b; color:#fff; font-family:'Neo_SemiBold',sans-serif; font-size:14px; padding:13px; margin-top:23px; text-decoration:none; }
@media (min-width:768px) and (max-width:1200px) {
 #ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) h2 { font-size:22px; letter-spacing:-1.1px; }
 #ff-main-banner .ff-banner__corner-icon { right:18px; top:27px; width:22px; height:25px; }
 #ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) .ff-banner__eyebrow { font-size:9px; letter-spacing:1px; }
}
@media (max-width:767px) {
 #ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) h2 { font-size:clamp(22px,6.5vw,26px); letter-spacing:-1.05px; }
 #ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) .ff-banner__eyebrow { font-size:10px; letter-spacing:1.4px; }
 #ff-main-banner .ff-banner__corner-icon { right:22px; top:28px; width:26px; height:29px; }
 #ff-main-banner .ff-banner__certificate-label { left:30%; }
 #ff-main-banner .ff-banner__certificate-title { font-size:9px; margin-top:9px; }
 #ff-main-banner .ff-banner__offer-note { left:25px; }
 #ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) .ff-banner__cta { bottom:25px; }
}
@media (max-width:359px) {
 #ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) h2 { font-size:21px; letter-spacing:-1px; }
 #ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) .ff-banner__copy p { font-size:12px; margin-top:12px; }
 #ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) .ff-banner__eyebrow { font-size:9px; letter-spacing:1px; }
 #ff-main-banner .ff-banner__corner-icon { right:18px; top:27px; width:22px; height:25px; }
 #ff-main-banner .ff-banner__offer { gap:5px; margin-top:7px; }
 #ff-main-banner .ff-banner__offer-label { font-size:12px; margin-right:1px; }
 #ff-main-banner .ff-banner__offer-number { font-size:47px; }
 #ff-main-banner .ff-banner__offer-number>span { font-size:29px; }
 #ff-main-banner .ff-banner__certificate-label { left:26.7%; top:64%; }
 #ff-main-banner .ff-banner__certificate-title { font-size:8px; }
 #ff-main-banner .ff-banner__certificate-brand { font-size:6px; }
 #ff-main-banner :is(.ff-banner__slide--warranty,.ff-banner__slide--groupbuy) .ff-banner__cta { left:19px; padding-left:16px; padding-right:15px; gap:13px; font-size:11px; }
 #ff-main-banner .ff-banner__offer-note { left:21px; }
 #ff-main-banner .ff-banner__dialog { padding:28px 22px; }
 #ff-main-banner .ff-banner__guarantees { grid-template-columns:1fr; }
}