/* ============================================================
   KISIYE OZEL 3D FIGUR — ADORABLE LIGHT THEME
   Warm cream, soft pink, warm gold — feels like a gift shop
   Standalone (does NOT import main dark theme)
   ============================================================ */

:root{
  /* Palette — warm cream + accents */
  --fig-cream:#fdf6ec;
  --fig-cream-soft:#fbf0e1;
  --fig-cream-deep:#f5e6cf;
  --fig-white:#ffffff;

  --fig-text:#3d2c2c;
  --fig-text-soft:#7a5e5e;
  --fig-text-muted:#a89090;

  --fig-pink:#ff7eb3;
  --fig-pink-soft:#ffd6e7;
  --fig-pink-deep:#ec5a99;

  --fig-gold:#e8a838;
  --fig-gold-soft:#fce8c2;
  --fig-gold-deep:#c98a1a;

  --fig-mint:#7cc4a8;
  --fig-lavender:#b8a4d4;

  --fig-border:rgba(232,168,56,0.18);
  --fig-border-soft:rgba(232,168,56,0.10);
  --fig-shadow:0 8px 24px -8px rgba(180,130,90,0.18);
  --fig-shadow-lg:0 24px 60px -20px rgba(180,130,90,0.25);
  --fig-shadow-glow:0 0 40px rgba(232,168,56,0.18);

  --fig-radius-sm:10px;
  --fig-radius-md:18px;
  --fig-radius-lg:28px;

  --fig-font-display:'Quicksand','Comfortaa',sans-serif;
  --fig-font-body:'Nunito','Quicksand',sans-serif;

  --fig-transition:0.4s cubic-bezier(0.4,0,0.2,1);
  --fig-nav-h:72px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{
  background:var(--fig-cream);
  color:var(--fig-text);
  font-family:var(--fig-font-body);
  line-height:1.7;
  overflow-x:hidden;
  /* Soft decorative dots in the background */
  background-image:
    radial-gradient(circle at 12% 8%,rgba(255,126,179,0.04) 0%,transparent 35%),
    radial-gradient(circle at 88% 70%,rgba(232,168,56,0.05) 0%,transparent 35%),
    radial-gradient(circle at 50% 100%,rgba(184,164,212,0.04) 0%,transparent 40%);
  background-attachment:fixed;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}

::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--fig-cream-soft)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--fig-gold),var(--fig-pink));border-radius:5px;border:2px solid var(--fig-cream-soft)}

.container{width:min(1280px,100% - 3rem);margin-inline:auto}

/* ============================================================
   NAVBAR (override main shared navbar for this service)
   The shared-layout.js injects the dark navbar.
   We restyle it locally so it matches the adorable theme.
   ============================================================ */
#navbar{
  position:fixed;top:0;left:0;right:0;height:var(--fig-nav-h);z-index:1000;
  background:rgba(253,246,236,0.85);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid var(--fig-border-soft);
  transition:var(--fig-transition);
}
#navbar.scrolled{
  background:rgba(253,246,236,0.96);
  box-shadow:0 4px 24px -8px rgba(180,130,90,0.15);
}
.nav-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.nav-logo{display:flex;align-items:center;gap:.6rem}
.nav-logo img{height:38px;width:auto}
.nav-logo-text{
  font-family:var(--fig-font-display);
  font-size:1.05rem;font-weight:800;letter-spacing:.02em;
  background:linear-gradient(135deg,var(--fig-pink-deep),var(--fig-gold));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}

.nav-links{display:flex;align-items:center;gap:.2rem}
.nav-links a,.nav-dropdown>span{
  font-family:var(--fig-font-body);font-size:.88rem;font-weight:600;
  padding:.5rem .9rem;border-radius:100px;color:var(--fig-text);
  transition:var(--fig-transition);cursor:pointer;white-space:nowrap;
  display:flex;align-items:center;gap:.35rem;
}
.nav-links a:hover,.nav-dropdown>span:hover{
  color:var(--fig-pink-deep);background:var(--fig-pink-soft);
}
.nav-dropdown{position:relative}
.nav-dropdown>span::after{content:'▾';font-size:.6rem;transition:transform .25s}
.nav-dropdown.open>span::after{transform:rotate(180deg)}
.dropdown-menu{
  position:absolute;top:calc(100% + .5rem);left:50%;transform:translateX(-50%) translateY(-8px);
  min-width:220px;background:var(--fig-white);
  border:1px solid var(--fig-border);border-radius:var(--fig-radius-md);
  padding:.6rem;opacity:0;pointer-events:none;transition:var(--fig-transition);
  box-shadow:var(--fig-shadow-lg);z-index:200;
}
.nav-dropdown.open .dropdown-menu{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0)}
.dropdown-menu a{display:block;padding:.55rem .9rem;border-radius:var(--fig-radius-sm);font-size:.85rem;color:var(--fig-text);transition:var(--fig-transition)}
.dropdown-menu a:hover{background:var(--fig-pink-soft);color:var(--fig-pink-deep)}
.dropdown-section-label{font-size:.62rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--fig-text-muted);padding:.5rem .9rem .15rem}

.nav-right{display:flex;align-items:center;gap:1rem}
.lang-switcher{display:flex;gap:.25rem}
.lang-btn{
  font-family:var(--fig-font-body);font-size:.7rem;font-weight:700;letter-spacing:.05em;
  padding:.35rem .65rem;border-radius:100px;color:var(--fig-text-muted);
  border:1.5px solid transparent;transition:var(--fig-transition);
}
.lang-btn:hover,.lang-btn.active{color:var(--fig-pink-deep);border-color:var(--fig-pink);background:var(--fig-pink-soft)}

.nav-cta{
  font-family:var(--fig-font-display);font-size:.78rem;font-weight:700;letter-spacing:.04em;
  padding:.55rem 1.25rem;border-radius:100px;
  background:linear-gradient(135deg,var(--fig-pink),var(--fig-gold));
  color:var(--fig-white);
  box-shadow:0 6px 20px -4px rgba(255,126,179,0.4);
  transition:var(--fig-transition);
}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 10px 28px -4px rgba(255,126,179,0.55)}

.nav-hamburger{display:none;flex-direction:column;gap:5px;padding:.5rem}
.nav-hamburger span{display:block;width:24px;height:2px;background:var(--fig-pink-deep);border-radius:2px;transition:var(--fig-transition)}
.mobile-menu{display:none;position:fixed;top:var(--fig-nav-h);left:0;right:0;bottom:0;background:rgba(253,246,236,0.98);backdrop-filter:blur(20px);padding:2rem;overflow-y:auto;z-index:999;flex-direction:column;gap:.5rem}
.mobile-menu.open{display:flex}
.mobile-menu a{font-family:var(--fig-font-display);font-size:1.1rem;font-weight:700;padding:1rem;border-bottom:1px solid var(--fig-border);color:var(--fig-text);transition:var(--fig-transition)}
.mobile-menu a:hover{color:var(--fig-pink-deep)}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.85rem 1.75rem;font-family:var(--fig-font-display);
  font-size:.85rem;font-weight:700;letter-spacing:.04em;
  border-radius:100px;transition:var(--fig-transition);cursor:pointer;border:0;
}
.btn-primary{
  background:linear-gradient(135deg,var(--fig-pink),var(--fig-gold));
  color:var(--fig-white);
  box-shadow:0 8px 24px -6px rgba(255,126,179,0.4);
}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 14px 30px -6px rgba(255,126,179,0.55)}
.btn-outline{
  background:var(--fig-white);
  color:var(--fig-pink-deep);
  border:2px solid var(--fig-pink);
}
.btn-outline:hover{background:var(--fig-pink-soft);transform:translateY(-2px)}
.btn-gold{
  background:linear-gradient(135deg,var(--fig-gold),#f5b842);
  color:var(--fig-white);
  box-shadow:0 8px 24px -6px rgba(232,168,56,0.45);
}
.btn-gold:hover{transform:translateY(-3px);box-shadow:0 14px 30px -6px rgba(232,168,56,0.6)}

/* ============================================================
   FOOTER (override dark for this service)
   ============================================================ */
footer{
  background:var(--fig-cream-deep);
  border-top:1px solid var(--fig-border);
  padding:4rem 0 2rem;
  position:relative;
}
footer::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--fig-pink),var(--fig-gold),transparent);
}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:2.5rem;margin-bottom:3rem}
.footer-logo-text{font-family:var(--fig-font-display);font-size:1.15rem;font-weight:800;margin-bottom:.75rem;background:linear-gradient(135deg,var(--fig-pink-deep),var(--fig-gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.text-gradient{background:linear-gradient(135deg,var(--fig-pink-deep),var(--fig-gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.footer-brand p{font-size:.9rem;color:var(--fig-text-soft);margin:1rem 0;max-width:30ch;line-height:1.7}
.social-links{display:flex;gap:.6rem;flex-wrap:wrap}
.social-link{
  width:42px;height:42px;
  border:1.5px solid var(--fig-border);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:var(--fig-text-soft);background:var(--fig-white);
  transition:var(--fig-transition);
}
.social-link svg{width:18px;height:18px;fill:currentColor}
.social-link:hover{transform:translateY(-3px) rotate(-6deg);color:var(--fig-pink-deep);border-color:var(--fig-pink);box-shadow:0 8px 20px -4px rgba(255,126,179,0.3)}
.social-link.youtube:hover{color:#ff0033;border-color:#ff0033}
.social-link.instagram:hover{color:#E1306C;border-color:#E1306C}
.social-link.shop:hover{color:var(--fig-gold-deep);border-color:var(--fig-gold)}
.social-link.github:hover{color:var(--fig-text);border-color:var(--fig-text)}
.footer-col h4{font-family:var(--fig-font-display);font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--fig-text);margin-bottom:1.25rem}
.footer-col ul{display:flex;flex-direction:column;gap:.55rem}
.footer-col a{font-size:.88rem;color:var(--fig-text-soft);transition:var(--fig-transition)}
.footer-col a:hover{color:var(--fig-pink-deep);padding-left:4px}
.footer-bottom{border-top:1px solid var(--fig-border);padding-top:1.5rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.footer-bottom p{font-size:.82rem;color:var(--fig-text-muted)}
.footer-legal{display:flex;gap:1.25rem;flex-wrap:wrap}
.footer-legal a{font-size:.78rem;color:var(--fig-text-muted);transition:var(--fig-transition)}
.footer-legal a:hover{color:var(--fig-pink-deep)}

/* ============================================================
   HERO — soft, dreamy, full-screen
   ============================================================ */
.fig-hero{
  position:relative;height:100vh;min-height:640px;overflow:hidden;
  display:flex;align-items:center;justify-content:center;text-align:center;
  background:linear-gradient(135deg,#ffe4ec 0%,#fff5e1 50%,#fef0f5 100%);
}
.fig-hero-media,.fig-hero-slider{position:absolute;inset:0;z-index:0}
.fig-hero-media video,.fig-hero-media img,
.fig-hero-slider video,.fig-hero-slider img{width:100%;height:100%;object-fit:cover;display:block}
.fig-hero-slider .fig-h-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.6s ease}
.fig-hero-slider .fig-h-slide.active{opacity:1}
.fig-hero-slider .fig-h-slide.placeholder{
  display:flex;align-items:center;justify-content:center;
  font-size:11rem;
  background:linear-gradient(135deg,#ffd6e7 0%,#fce8c2 50%,#ffe8f0 100%);
}

/*.fig-hero-overlay{
  position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(circle at 20% 30%,rgba(255,255,255,0.4) 0%,transparent 50%),
    radial-gradient(circle at 80% 70%,rgba(255,255,255,0.3) 0%,transparent 50%),
    linear-gradient(180deg,transparent 0%,rgba(253,246,236,0.3) 100%);
}*/

.fig-hero-content h1,
.fig-hero-content p,
.fig-scroll-down span{
  color:#fff !important;
}

/* Floating decorative shapes */
.fig-hero::before,.fig-hero::after{
  content:'';position:absolute;border-radius:50%;z-index:1;pointer-events:none;
  filter:blur(40px);opacity:.5;
}
.fig-hero::before{
  width:300px;height:300px;top:-100px;right:-50px;
  background:radial-gradient(circle,var(--fig-pink) 0%,transparent 70%);
  animation:fig-float 8s ease-in-out infinite;
}
.fig-hero::after{
  width:260px;height:260px;bottom:-80px;left:-40px;
  background:radial-gradient(circle,var(--fig-gold) 0%,transparent 70%);
  animation:fig-float 10s ease-in-out infinite reverse;
}
@keyframes fig-float{0%,100%{transform:translateY(0) translateX(0)}50%{transform:translateY(-30px) translateX(20px)}}

.fig-hero-content{position:relative;z-index:3;max-width:880px;padding:0 1.5rem;margin-top:var(--fig-nav-h)}
.fig-hero-content .badge{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--fig-white);
  border:1.5px solid var(--fig-pink);
  border-radius:100px;padding:.5rem 1.25rem;
  font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--fig-pink-deep);
  margin-bottom:1.8rem;
  box-shadow:0 4px 16px -4px rgba(255,126,179,0.3);
}
.fig-hero-content .badge::before{content:'✨';font-size:.85rem}
.fig-hero-content h1{
  font-family:var(--fig-font-display);
  font-size:clamp(2.5rem,6.5vw,5.5rem);font-weight:800;
  color:var(--fig-text);line-height:1.05;letter-spacing:-.02em;
  margin-bottom:1.5rem;
}
.fig-hero-content h1 .gold{
  background:linear-gradient(135deg,var(--fig-pink-deep) 0%,var(--fig-gold) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  font-style:italic;
}
.fig-hero-content p{
  color:var(--fig-text-soft);font-size:clamp(1rem,1.6vw,1.2rem);
  max-width:58ch;margin:0 auto 2.5rem;font-weight:500;line-height:1.7;
}
.fig-hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

.fig-scroll-down{position:absolute;bottom:1.8rem;left:50%;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:.5rem;pointer-events:none}
.fig-scroll-down span{font-family:var(--fig-font-display);font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:var(--fig-text-muted);font-weight:700}
.fig-scroll-down .line{width:1.5px;height:42px;background:linear-gradient(to bottom,var(--fig-pink),transparent);animation:fig-scroll-anim 2s ease-in-out infinite;border-radius:1px}
@keyframes fig-scroll-anim{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media(max-width:760px){.fig-scroll-down{display:none}}

/* ============================================================
   SECTION SHELL
   ============================================================ */
.fig-section{padding:6rem 0;position:relative}
.fig-section .label{
  display:inline-block;
  font-family:var(--fig-font-display);font-size:.72rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--fig-pink-deep);
  background:var(--fig-pink-soft);
  padding:.4rem 1rem;border-radius:100px;
  margin-bottom:1rem;
}
.fig-section h2{
  font-family:var(--fig-font-display);
  font-size:clamp(1.8rem,4.5vw,3.2rem);font-weight:800;
  color:var(--fig-text);line-height:1.1;letter-spacing:-.01em;
  margin-bottom:1rem;
}
.fig-section h2 .accent{
  background:linear-gradient(135deg,var(--fig-pink-deep),var(--fig-gold));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  font-style:italic;
}
.fig-section .lead{color:var(--fig-text-soft);max-width:62ch;font-size:1.02rem;line-height:1.75;margin-bottom:0}
.fig-section-head{text-align:center;margin-bottom:4rem}
.fig-section-head .lead{margin-inline:auto}
.fig-divider{
  width:64px;height:3px;
  background:linear-gradient(90deg,var(--fig-pink),var(--fig-gold));
  margin:1.2rem auto;border-radius:2px;
}
.fig-divider::before,.fig-divider::after{content:'';display:inline-block}

/* Sweet section dividers */
.fig-section + .fig-section::before{
  content:'';display:block;width:60px;height:60px;margin:0 auto -30px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ff7eb3' opacity='0.25'%3E%3Cpath d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/%3E%3C/svg%3E") no-repeat center/contain;
  position:relative;z-index:2;
}

/* ============================================================
   3D VIEWER — soft card on cream background
   ============================================================ */
#fig-viewer-section{
  background:linear-gradient(180deg,var(--fig-cream) 0%,var(--fig-cream-soft) 100%);
}
.fig-viewer-wrap{
  position:relative;width:100%;aspect-ratio:16/10;max-height:620px;
  background:linear-gradient(135deg,#fff5e1 0%,#ffe4ec 100%);
  border:1px solid var(--fig-border);
  border-radius:var(--fig-radius-lg);overflow:hidden;
  box-shadow:var(--fig-shadow-lg);
}
.fig-viewer{position:absolute;inset:0}
.fig-viewer canvas{display:block;outline:none}
.fig-viewer-loading{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:rgba(253,246,236,0.92);backdrop-filter:blur(8px);z-index:5;
  transition:opacity .4s ease;
}
.fig-viewer-loading.hidden{opacity:0;pointer-events:none}
.fig-viewer-spinner{
  width:48px;height:48px;border:3px solid var(--fig-pink-soft);
  border-top-color:var(--fig-pink-deep);border-radius:50%;
  animation:fig-spin 1s linear infinite;margin-bottom:1rem;
}
@keyframes fig-spin{to{transform:rotate(360deg)}}
.fig-viewer-loading p{color:var(--fig-text-soft);font-size:.88rem;font-weight:600}

.fig-viewer-info{
  position:absolute;top:1rem;left:1rem;z-index:4;
  display:flex;flex-direction:column;gap:.4rem;pointer-events:none;
}
.fig-viewer-info .name{
  font-family:var(--fig-font-display);font-size:.95rem;font-weight:700;
  color:var(--fig-text);background:rgba(255,255,255,0.92);
  border:1px solid var(--fig-border);padding:.45rem .9rem;
  border-radius:100px;backdrop-filter:blur(8px);
  box-shadow:var(--fig-shadow);
}
.fig-viewer-info .format{
  font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;font-weight:800;
  color:var(--fig-pink-deep);background:var(--fig-pink-soft);
  border:1px solid var(--fig-pink);padding:.25rem .65rem;
  border-radius:100px;align-self:flex-start;backdrop-filter:blur(8px);
}

.fig-viewer-controls{position:absolute;bottom:1rem;right:1rem;z-index:4;display:flex;gap:.4rem}
.fig-viewer-btn{
  width:40px;height:40px;background:var(--fig-white);
  border:1px solid var(--fig-border);border-radius:50%;
  color:var(--fig-pink-deep);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:var(--fig-transition);font-size:1rem;font-weight:700;
  box-shadow:var(--fig-shadow);
}
.fig-viewer-btn:hover{background:linear-gradient(135deg,var(--fig-pink),var(--fig-gold));color:var(--fig-white);transform:translateY(-2px)}

.fig-viewer-error{
  position:absolute;inset:0;display:none;align-items:center;justify-content:center;flex-direction:column;
  text-align:center;padding:2rem;color:var(--fig-text-soft);
  background:rgba(253,246,236,0.95);z-index:6;
}
.fig-viewer-error.show{display:flex}
.fig-viewer-error .icon{font-size:2.5rem;margin-bottom:.5rem}

/* LIBRARY — adorable horizontal cards
   Desktop (>900px): library sits to the RIGHT of viewer, vertical scroll (Thingiverse style)
   Mobile (≤900px): library BELOW viewer, horizontal scroll (current behavior) */
.fig-library{margin-top:2.5rem;position:relative}
.fig-library-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:1.2rem;flex-wrap:wrap;gap:1rem}

/* ─── DESKTOP: side-by-side layout ─── */
@media(min-width:901px){
  .fig-viewer-side{
    display:grid;
    grid-template-columns:1fr 280px;
    gap:1.5rem;
    align-items:stretch;
  }
  .fig-viewer-side .fig-viewer-wrap{max-height:none;aspect-ratio:auto;min-height:540px}
  .fig-viewer-side .fig-library{
    margin-top:0;
    display:flex;
    flex-direction:column;
    min-height:540px;
  }
  .fig-viewer-side .fig-library-head{margin-bottom:.8rem}
  .fig-viewer-side .fig-library-head h3{font-size:1rem}
  .fig-viewer-side .fig-library-track-wrap{flex:1;position:relative;overflow:hidden}
  .fig-viewer-side .fig-library-track{
    display:flex;
    flex-direction:column;
    gap:.85rem;
    overflow-y:auto;
    overflow-x:hidden;
    scroll-snap-type:y mandatory;
    padding:.5rem .35rem .5rem .25rem;
    height:100%;
    max-height:540px;
  }
  .fig-viewer-side .fig-library-track::-webkit-scrollbar{width:6px;height:auto}
  .fig-viewer-side .fig-lib-item{
    flex:0 0 auto;
    width:100%;
    scroll-snap-align:start;
    display:flex;
    align-items:center;
    gap:.85rem;
  }
  .fig-viewer-side .fig-lib-item:hover{transform:translateY(-2px)}
  .fig-viewer-side .fig-lib-item.active{transform:translateY(-2px)}
  .fig-viewer-side .fig-lib-thumb{flex:0 0 110px;width:300px;aspect-ratio:1;border-top-right-radius:0;border-bottom-right-radius:0}
  .fig-viewer-side .fig-lib-body{flex:1;padding:.5rem .8rem .5rem 0;min-width:0}
  .fig-viewer-side .fig-lib-name{font-size:.82rem;margin-bottom:.15rem}
  .fig-viewer-side .fig-lib-desc{font-size:.68rem}
  .fig-viewer-side .fig-lib-format{top:.3rem;right:.3rem;font-size:.5rem;padding:.15rem .4rem}
  .fig-viewer-side .fig-lib-arrow{display:none}
}



.fig-library-head h3{font-family:var(--fig-font-display);font-size:1.15rem;font-weight:800;color:var(--fig-text)}
.fig-library-head .hint{font-size:.78rem;color:var(--fig-text-muted);font-weight:600}

.fig-library-track-wrap{position:relative}
.fig-library-track{
  display:flex;gap:1.25rem;overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding:.75rem .25rem 1.5rem;-webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}
.fig-library-track::-webkit-scrollbar{height:6px}
.fig-library-track::-webkit-scrollbar-track{background:var(--fig-cream-deep);border-radius:3px}
.fig-library-track::-webkit-scrollbar-thumb{background:var(--fig-pink);border-radius:3px}

.fig-lib-item{
  flex:0 0 200px;scroll-snap-align:start;
  background:var(--fig-white);
  border:1.5px solid var(--fig-border);
  border-radius:var(--fig-radius-md);overflow:hidden;cursor:pointer;
  transition:var(--fig-transition);position:relative;
  box-shadow:var(--fig-shadow);
}
.fig-lib-item:hover{
  border-color:var(--fig-pink);
  box-shadow:0 14px 32px -10px rgba(255,126,179,0.35);
  transform:translateY(-6px) rotate(-1deg);
}
.fig-lib-item.active{
  border-color:var(--fig-pink-deep);
  box-shadow:0 0 0 3px var(--fig-pink-soft),0 14px 32px -10px rgba(255,126,179,0.35);
  transform:translateY(-6px);
}
.fig-lib-thumb{
  position:relative;width:100%;aspect-ratio:1;
  background:linear-gradient(135deg,var(--fig-pink-soft),var(--fig-gold-soft));
  overflow:hidden;
}
.fig-lib-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.fig-lib-thumb.placeholder{display:flex;align-items:center;justify-content:center;font-size:3rem}
.fig-lib-format{
  position:absolute;top:.6rem;right:.6rem;
  background:var(--fig-white);color:var(--fig-pink-deep);
  font-size:.58rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  padding:.22rem .55rem;border-radius:100px;
  border:1px solid var(--fig-pink);
  box-shadow:var(--fig-shadow);
}
.fig-lib-body{padding:.85rem .95rem 1rem}
.fig-lib-name{font-family:var(--fig-font-display);font-size:.85rem;color:var(--fig-text);font-weight:800;margin-bottom:.2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fig-lib-desc{font-size:.72rem;color:var(--fig-text-muted);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.fig-lib-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:46px;height:46px;background:var(--fig-white);
  border:1.5px solid var(--fig-border);border-radius:50%;
  color:var(--fig-pink-deep);
  display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;
  transition:var(--fig-transition);font-size:1.2rem;font-weight:800;
  box-shadow:var(--fig-shadow-lg);
}
.fig-lib-arrow:hover{
  background:linear-gradient(135deg,var(--fig-pink),var(--fig-gold));
  color:var(--fig-white);border-color:transparent;
  transform:translateY(-50%) scale(1.1);
}
.fig-lib-arrow.prev{left:-16px}
.fig-lib-arrow.next{right:-16px}
.fig-lib-arrow:disabled{opacity:.3;cursor:not-allowed}
@media(max-width:760px){
  .fig-lib-arrow{display:none}
  .fig-lib-item{flex:0 0 160px}
}

.fig-library-empty{padding:2.5rem;text-align:center;color:var(--fig-text-muted);border:2px dashed var(--fig-border);border-radius:var(--fig-radius-md);background:var(--fig-cream-soft)}
.fig-library-empty strong{color:var(--fig-pink-deep);font-weight:700}

/* ============================================================
   USE CASES — playful pastel cards
   ============================================================ */
#fig-usecases{background:var(--fig-cream)}
.fig-usecases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
@media(max-width:900px){.fig-usecases-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.fig-usecases-grid{grid-template-columns:1fr}}

.fig-uc-card{
  position:relative;background:var(--fig-white);
  border:1.5px solid var(--fig-border);
  border-radius:var(--fig-radius-md);overflow:hidden;
  transition:var(--fig-transition);
  box-shadow:var(--fig-shadow);
}
.fig-uc-card:hover{
  transform:translateY(-8px);
  border-color:var(--fig-pink);
  box-shadow:0 20px 40px -12px rgba(255,126,179,0.3);
}
.fig-uc-media{
  position:relative;width:100%;aspect-ratio:1/1;overflow:hidden;
}
.fig-uc-media img,.fig-uc-media video{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.fig-uc-card:hover .fig-uc-media img,.fig-uc-card:hover .fig-uc-media video{transform:scale(1.08)}
.fig-uc-media.placeholder{
  display:flex;align-items:center;justify-content:center;font-size:5rem;
}
/* Different soft backgrounds per card position */
.fig-uc-card:nth-child(1) .fig-uc-media.placeholder{background:linear-gradient(135deg,#ffd6e7,#ffeaf2)}
.fig-uc-card:nth-child(2) .fig-uc-media.placeholder{background:linear-gradient(135deg,#fce8c2,#fff5e1)}
.fig-uc-card:nth-child(3) .fig-uc-media.placeholder{background:linear-gradient(135deg,#e3d5f5,#f3eafa)}
.fig-uc-card:nth-child(4) .fig-uc-media.placeholder{background:linear-gradient(135deg,#ffd6e7,#fce8c2)}
.fig-uc-card:nth-child(5) .fig-uc-media.placeholder{background:linear-gradient(135deg,#c8e6d8,#e6f4ed)}
.fig-uc-card:nth-child(6) .fig-uc-media.placeholder{background:linear-gradient(135deg,#fce8c2,#ffd6e7)}

.fig-uc-content{padding:1.5rem 1.5rem 1.75rem;text-align:center}
.fig-uc-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:56px;height:56px;border-radius:50%;
  background:linear-gradient(135deg,var(--fig-pink-soft),var(--fig-gold-soft));
  font-size:1.8rem;margin-bottom:.75rem;
  box-shadow:0 4px 12px -2px rgba(255,126,179,0.25);
}
.fig-uc-title{font-family:var(--fig-font-display);font-size:1.15rem;color:var(--fig-text);margin-bottom:.4rem;font-weight:800}
.fig-uc-desc{font-size:.88rem;color:var(--fig-text-soft);line-height:1.5;font-weight:500}

/* ============================================================
   OCCASIONS — pastel chips
   ============================================================ */
#fig-occasions{
  background:linear-gradient(180deg,var(--fig-cream-soft) 0%,#fff5e1 50%,var(--fig-cream-soft) 100%);
  position:relative;overflow:hidden;
}
.fig-occasions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem}
.fig-occ-card{
  position:relative;padding:2.25rem 1.5rem;
  background:var(--fig-white);
  border:1.5px solid var(--fig-border);
  border-radius:var(--fig-radius-md);text-align:center;
  transition:var(--fig-transition);overflow:hidden;
  box-shadow:var(--fig-shadow);
}
.fig-occ-card::before{
  content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;
  background:radial-gradient(circle,var(--fig-pink-soft) 0%,transparent 50%);
  opacity:0;transition:opacity .4s ease;
}
.fig-occ-card:hover{
  transform:translateY(-6px) rotate(-1deg);
  border-color:var(--fig-pink);
  box-shadow:0 16px 32px -10px rgba(255,126,179,0.3);
}
.fig-occ-card:hover::before{opacity:.5}
.fig-occ-card > *{position:relative;z-index:2}
.fig-occ-card .icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:200px;height:200px;border-radius:50%;
  background:linear-gradient(135deg,var(--fig-pink),var(--fig-gold));
  font-size:2rem;margin-bottom:1rem;
  box-shadow:0 8px 20px -4px rgba(255,126,179,0.4);
}
.fig-occ-card .title{font-family:var(--fig-font-display);font-size:1rem;color:var(--fig-text);margin-bottom:.4rem;font-weight:800}
.fig-occ-card .date{font-size:.74rem;color:var(--fig-pink-deep);letter-spacing:.1em;text-transform:uppercase;font-weight:700}

/* ============================================================
   WORKSHOP — bento gallery
   ============================================================ */
#fig-workshop{background:var(--fig-cream)}
.fig-workshop-grid{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:1rem;height:580px}
.fig-workshop-grid .fig-ws-item:first-child{grid-row:span 2}
@media(max-width:900px){
  .fig-workshop-grid{grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,200px);height:auto}
  .fig-workshop-grid .fig-ws-item:first-child{grid-column:span 2;grid-row:span 1}
  .fig-ws-item img,
  .fig-ws-item video{
    object-fit:contain;
    background:#fff;
  }
}
@media(max-width:560px){
  .fig-workshop-grid{grid-template-columns:1fr;grid-template-rows:repeat(5,220px)}
  .fig-workshop-grid .fig-ws-item:first-child{grid-column:span 1}
  .fig-ws-item img,
  .fig-ws-item video{
    object-fit:contain;
    background:#fff;
  }
}
.fig-ws-item{
  position:relative;border-radius:var(--fig-radius-md);overflow:hidden;
  border:1.5px solid var(--fig-border);background:var(--fig-white);
  cursor:pointer;transition:var(--fig-transition);
  box-shadow:var(--fig-shadow);
}
.fig-ws-item:hover{
  transform:scale(1.02);border-color:var(--fig-pink);
  box-shadow:0 16px 32px -10px rgba(255,126,179,0.3);
}
/*.fig-ws-item .media-slot{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;aspect-ratio:1/1}*/
.fig-ws-item .media-slot{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.fig-ws-item img,
.fig-ws-item video{
  width:100%;
  height:100%;
  object-fit:cover;
}

.fig-ws-item .media-slot.placeholder{
  font-size:3.5rem;
  background:linear-gradient(135deg,var(--fig-pink-soft),var(--fig-gold-soft));
}
.fig-ws-item:nth-child(1) .media-slot.placeholder{background:linear-gradient(135deg,#ffd6e7,#fce8c2);font-size:5.5rem}
.fig-ws-item:nth-child(2) .media-slot.placeholder{background:linear-gradient(135deg,#fce8c2,#ffeaf2)}
.fig-ws-item:nth-child(3) .media-slot.placeholder{background:linear-gradient(135deg,#e3d5f5,#ffd6e7)}
.fig-ws-item:nth-child(4) .media-slot.placeholder{background:linear-gradient(135deg,#c8e6d8,#fce8c2)}
.fig-ws-item:nth-child(5) .media-slot.placeholder{background:linear-gradient(135deg,#ffeaf2,#e3d5f5)}
.fig-ws-item img,.fig-ws-item video{width:100%;height:100%;object-fit:cover}

/* ============================================================
   CREATE-YOUR-OWN CTA
   ============================================================ */
#fig-create-cta{background:var(--fig-cream-soft);position:relative;overflow:hidden}
.fig-create-card{
  position:relative;
  background:linear-gradient(135deg,#fff5e1 0%,#ffe4ec 100%);
  border:2px solid var(--fig-border);
  border-radius:var(--fig-radius-lg);
  padding:4rem 2.5rem;text-align:center;overflow:hidden;
  box-shadow:var(--fig-shadow-lg);
}
.fig-create-card::before,.fig-create-card::after{
  content:'';position:absolute;border-radius:50%;
  filter:blur(50px);opacity:.4;pointer-events:none;
}
.fig-create-card::before{
  width:300px;height:300px;top:-100px;right:-50px;
  background:var(--fig-pink);
}
.fig-create-card::after{
  width:280px;height:280px;bottom:-100px;left:-50px;
  background:var(--fig-gold);
}
.fig-create-card > *{position:relative;z-index:2}
.fig-create-card .icon-badge{
  display:inline-flex;align-items:center;justify-content:center;
  width:80px;height:80px;border-radius:50%;
  background:linear-gradient(135deg,var(--fig-pink),var(--fig-gold));
  font-size:2.5rem;margin-bottom:1.5rem;
  box-shadow:0 12px 32px -6px rgba(255,126,179,0.5);
  animation:fig-bounce 3s ease-in-out infinite;
}
@keyframes fig-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.fig-create-card h2{font-family:var(--fig-font-display);font-size:clamp(1.6rem,3.4vw,2.6rem);color:var(--fig-text);margin-bottom:1rem;font-weight:800}
.fig-create-card p{max-width:60ch;margin:0 auto 2rem;color:var(--fig-text-soft);font-size:1.05rem;line-height:1.7;font-weight:500}

/* ============================================================
   ORDER FORM — friendly, soft
   ============================================================ */
#fig-order{background:var(--fig-cream)}
.fig-order-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
@media(max-width:900px){.fig-order-grid{grid-template-columns:1fr;gap:2.5rem}}

.fig-order-info h2{font-family:var(--fig-font-display);font-size:clamp(1.7rem,3.2vw,2.4rem);color:var(--fig-text);margin-bottom:1rem;font-weight:800}
.fig-order-info .lead{margin-bottom:2rem;font-size:1rem;color:var(--fig-text-soft);line-height:1.75}

.fig-process-steps{display:flex;flex-direction:column;gap:1.5rem}
.fig-step{display:flex;gap:1.25rem;align-items:flex-start}
.fig-step-num{
  flex-shrink:0;width:48px;height:48px;
  background:linear-gradient(135deg,var(--fig-pink),var(--fig-gold));
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:var(--fig-font-display);font-weight:800;color:var(--fig-white);font-size:1.1rem;
  box-shadow:0 8px 20px -4px rgba(255,126,179,0.4);
}
.fig-step-content h4{font-family:var(--fig-font-display);font-size:1rem;color:var(--fig-text);margin-bottom:.3rem;font-weight:800}
.fig-step-content p{color:var(--fig-text-soft);font-size:.9rem;line-height:1.6;font-weight:500}

.fig-form-card{
  background:var(--fig-white);
  border:1.5px solid var(--fig-border);
  border-radius:var(--fig-radius-lg);padding:2.5rem;
  box-shadow:var(--fig-shadow-lg);
}
.fig-form{display:flex;flex-direction:column;gap:1.25rem}
.fig-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:560px){.fig-form .form-row{grid-template-columns:1fr}}
.fig-form label{display:block;font-family:var(--fig-font-display);font-size:.75rem;font-weight:800;letter-spacing:.05em;color:var(--fig-text);margin-bottom:.45rem}
.fig-form label .req{color:var(--fig-pink-deep)}
.fig-form input,.fig-form select,.fig-form textarea{
  width:100%;background:var(--fig-cream);
  border:1.5px solid var(--fig-border);
  border-radius:var(--fig-radius-sm);padding:.85rem 1.1rem;
  color:var(--fig-text);font-family:var(--fig-font-body);
  font-size:.92rem;font-weight:500;transition:var(--fig-transition);outline:none;
}
.fig-form input:focus,.fig-form select:focus,.fig-form textarea:focus{
  border-color:var(--fig-pink);background:var(--fig-white);
  box-shadow:0 0 0 4px var(--fig-pink-soft);
}
.fig-form select option{background:var(--fig-white);color:var(--fig-text)}
.fig-form textarea{min-height:120px;resize:vertical;font-family:inherit}

/* File upload — drag & drop */
.fig-file-upload{
  position:relative;border:2px dashed var(--fig-pink);
  border-radius:var(--fig-radius-md);padding:2.25rem 1.5rem;
  text-align:center;cursor:pointer;transition:var(--fig-transition);
  background:var(--fig-pink-soft);
}
.fig-file-upload:hover,.fig-file-upload.dragover{
  border-color:var(--fig-pink-deep);background:#fde8f0;
  transform:translateY(-2px);
}
.fig-file-upload input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer}
.fig-file-upload .icon{font-size:2.4rem;margin-bottom:.5rem}
.fig-file-upload .main-text{font-family:var(--fig-font-display);font-size:.9rem;color:var(--fig-text);margin-bottom:.3rem;font-weight:700}
.fig-file-upload .sub-text{font-size:.74rem;color:var(--fig-text-soft);font-weight:600}

.fig-file-list{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem}
.fig-file-pill{
  display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  padding:.7rem 1rem;background:var(--fig-cream-soft);
  border:1px solid var(--fig-border);border-radius:var(--fig-radius-sm);
  font-size:.84rem;font-weight:600;
}
.fig-file-pill .name{color:var(--fig-text);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fig-file-pill .size{color:var(--fig-text-muted);font-size:.72rem}
.fig-file-pill .remove{background:transparent;border:0;color:var(--fig-pink-deep);cursor:pointer;font-size:1.3rem;line-height:1;padding:0 .3rem;font-weight:700}
.fig-file-pill .remove:hover{transform:rotate(90deg);transition:transform .3s ease}

.fig-honeypot{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}

.fig-form-note{font-size:.78rem;color:var(--fig-text-soft);text-align:center;line-height:1.6;font-weight:500}
.fig-form-note strong{color:var(--fig-pink-deep);font-weight:700}

.fig-submit-btn{
  background:linear-gradient(135deg,var(--fig-pink),var(--fig-gold));
  color:var(--fig-white);border:0;padding:1.1rem 2rem;
  font-family:var(--fig-font-display);font-size:.88rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  border-radius:100px;cursor:pointer;transition:var(--fig-transition);
  box-shadow:0 10px 24px -6px rgba(255,126,179,0.4);
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
}
.fig-submit-btn:hover{transform:translateY(-3px);box-shadow:0 16px 32px -6px rgba(255,126,179,0.55)}
.fig-submit-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}

.fig-form-msg{padding:.95rem 1.1rem;border-radius:var(--fig-radius-sm);font-size:.88rem;margin-top:.25rem;display:none;font-weight:600}
.fig-form-msg.show{display:block}
.fig-form-msg.error{background:#ffe0e8;border:1px solid var(--fig-pink-deep);color:#c43373}
.fig-form-msg.success{background:#dff5e8;border:1px solid #7cc4a8;color:#1f8259}

/* ============================================================
   FAQ — soft accordion
   ============================================================ */
#fig-faq{background:var(--fig-cream-soft)}
.fig-faq-list{max-width:780px;margin:0 auto;display:flex;flex-direction:column;gap:.85rem}
.fig-faq-item{
  background:var(--fig-white);
  border:1.5px solid var(--fig-border);
  border-radius:var(--fig-radius-md);overflow:hidden;
  transition:var(--fig-transition);
  box-shadow:var(--fig-shadow);
}
.fig-faq-item:hover{border-color:var(--fig-pink);transform:translateY(-2px)}
.fig-faq-item.open{border-color:var(--fig-pink-deep);box-shadow:0 12px 28px -8px rgba(255,126,179,0.25)}
.fig-faq-q{
  padding:1.3rem 1.5rem;cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;gap:1rem;
  font-family:var(--fig-font-display);font-size:.96rem;color:var(--fig-text);font-weight:700;
}
.fig-faq-q::after{
  content:'';width:28px;height:28px;border-radius:50%;
  background:var(--fig-pink-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ec5a99'%3E%3Cpath d='M12 4v16M4 12h16' stroke='%23ec5a99' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/14px;
  transition:transform .3s ease;flex-shrink:0;
}
.fig-faq-item.open .fig-faq-q::after{
  transform:rotate(45deg);
  background-color:var(--fig-pink-deep);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4v16M4 12h16' stroke='%23fff' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");
}
.fig-faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease;padding:0 1.5rem}
.fig-faq-item.open .fig-faq-a{max-height:400px;padding:0 1.5rem 1.3rem}
.fig-faq-a p{color:var(--fig-text-soft);font-size:.92rem;line-height:1.75;font-weight:500}

/* ============================================================
   REVEAL animations
   ============================================================ */
.fig-reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}
.fig-reveal.revealed{opacity:1;transform:none}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:900px){
  .nav-links{display:none}
  .nav-hamburger{display:flex}
  .nav-cta{display:none}
  .fig-section{padding:4.5rem 0}
  .footer-grid{grid-template-columns:1fr 1fr 1fr;gap:2rem}
  .footer-grid > .footer-brand{grid-column:span 3}
}
@media(max-width:600px){
  .fig-section{padding:3.5rem 0}
  .fig-hero{min-height:560px}
  .fig-create-card{padding:3rem 1.5rem}
  .fig-form-card{padding:1.75rem}
  .footer-grid{grid-template-columns:1fr}
  .footer-grid > .footer-brand{grid-column:span 1}
  .footer-bottom{flex-direction:column;text-align:center}
}

/* ─── Viewer empty state + active rotate button ─── */
.fig-viewer-empty{
  position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:2rem;color:var(--fig-text-soft);
  background:linear-gradient(135deg,#fff5e8 0%,#ffe4ec 100%);z-index:6;
  pointer-events:none;
}
.fig-viewer-empty.show{display:flex}
.fig-viewer-empty .icon{font-size:3rem;margin-bottom:.8rem;animation:fig-bounce 2s ease-in-out infinite}
.fig-viewer-empty p{font-family:var(--fig-font-display);font-weight:700;font-size:1rem;color:var(--fig-pink-deep)}
.fig-viewer-btn.active{background:linear-gradient(135deg,var(--fig-pink),var(--fig-gold));color:var(--fig-white);border-color:transparent}