/* v15: an interactive orbit of original Lucide marks in frosted glass. */
.category-section.category-orbit { display:block; padding-block:24px 32px; }
.category-orbit .category-list { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; width:100%; margin:auto; }
.category-orbit .category { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:16px; padding:10px 4px; border-radius:16px; color:var(--ink); }
.category-orbit .category strong { display:block; margin:0; font-size:14px; font-weight:550; line-height:1.8; white-space:nowrap; }
.category-orbit .category-art { position:relative; isolation:isolate; display:grid; place-items:center; width:110px; height:110px; overflow:visible; border:0; outline:0; border-radius:50%; background:none; }
.category-orbit .category-art::before { content:""; position:absolute; inset:13px 10px 9px 16px; z-index:-1; border-radius:24px; background:linear-gradient(145deg,#a9dfbf,#57a67b); transform:rotate(-18deg); box-shadow:0 9px 15px rgb(25 59 45 / .12); }
.category-orbit .category-glass { display:grid; place-items:center; position:relative; width:91px; height:91px; border-radius:27px; border:1px solid rgb(255 255 255 / .95); background:linear-gradient(140deg,rgb(255 255 255 / .72),rgb(235 255 242 / .3) 55%,rgb(255 255 255 / .54)); box-shadow:inset 0 1px 2px #fff,inset 0 -2px 2px rgb(255 255 255 / .42),0 0 0 1px rgb(46 121 77 / .12),0 13px 20px rgb(25 59 45 / .09); backdrop-filter:blur(8px) saturate(1.3); -webkit-backdrop-filter:blur(8px) saturate(1.3); }
.category-orbit .category-glass::after { content:""; position:absolute; top:7px; left:9px; right:9px; height:31px; border-top:1px solid #fff; border-radius:20px 20px 50% 50%; background:linear-gradient(rgb(255 255 255 / .32),transparent); pointer-events:none; }
.category-orbit .category-glass svg { position:relative; z-index:1; width:43px; height:43px; color:#1c5b3b; stroke-width:1.5; filter:drop-shadow(0 1px 0 rgb(255 255 255 / .8)); }
.category-orbit .category[data-category="pen"] .category-art::before { transform:rotate(17deg); background:linear-gradient(145deg,#c0e8d1,#75b28e); }
.category-orbit .category[data-category="art"] .category-art::before { transform:rotate(-9deg); background:linear-gradient(145deg,#b4dfc6,#4f9674); }
.category-orbit .category[data-category="pouch"] .category-art::before { transform:rotate(11deg); background:linear-gradient(145deg,#d2eddd,#71ad8b); }
.category-orbit .category[aria-pressed="true"] .category-art { outline:0; }
.category-orbit .category[aria-pressed="true"] strong { text-decoration:underline; text-underline-offset:6px; }
.category-orbit-controls { display:none; }
.category-orbit[data-orbit-ready="true"] .category-list { --orbit-offset:clamp(104px,25vw,245px); display:block; position:relative; height:208px; max-width:860px; isolation:isolate; touch-action:pan-y pinch-zoom; user-select:none; -webkit-user-select:none; }
.category-orbit[data-orbit-ready="true"] .category-list::before { content:""; position:absolute; top:45px; left:9%; right:9%; height:95px; z-index:-1; border:1px solid #d9eade; border-radius:50%; transform:rotate(-4deg); pointer-events:none; }
.category-orbit[data-orbit-ready="true"] .category { position:absolute; top:10px; left:50%; width:170px; margin:0; transform:translateX(-50%); transform-origin:50% 45%; transition:transform 420ms cubic-bezier(.22,1,.36,1),opacity 300ms ease; }
.category-orbit[data-orbit-ready="true"] .category[data-orbit-slot="0"] { z-index:3; opacity:1; transform:translateX(-50%) translateY(16px); }
.category-orbit[data-orbit-ready="true"] .category[data-orbit-slot="-1"] { z-index:2; opacity:.88; transform:translateX(calc(-50% + var(--orbit-offset))) translateY(-4px) scale(.82) rotate(4deg); }
.category-orbit[data-orbit-ready="true"] .category[data-orbit-slot="1"] { z-index:2; opacity:.88; transform:translateX(calc(-50% - var(--orbit-offset))) translateY(-4px) scale(.82) rotate(-4deg); }
.category-orbit[data-orbit-ready="true"] .category[data-orbit-slot="2"] { z-index:0; visibility:hidden; opacity:0; transform:translateX(-50%) translateY(-12px) scale(.65); pointer-events:none; }
.category-orbit[data-orbit-ready="true"] .category-orbit-controls { display:flex; justify-content:center; gap:10px; direction:ltr; }
.category-orbit-controls button { display:grid; place-items:center; width:44px; height:44px; padding:11px; border:1px solid #d5e7dc; border-radius:50%; background:rgb(246 252 248 / .78); color:var(--ink); }
.category-orbit-controls svg { width:19px; height:19px; }
.category-orbit-controls [data-orbit-prev] svg { transform:rotate(180deg); }
.category-orbit :is(button):focus-visible { outline:2px solid var(--primary); outline-offset:3px; }
@media (hover:hover) and (pointer:fine) {
  .category-orbit-controls button:hover { background:#e6f4eb; }
  .category-orbit .category:hover .category-glass { border-color:white; box-shadow:inset 0 1px 2px #fff,0 0 0 1px rgb(33 131 88 / .28),0 13px 20px rgb(25 59 45 / .13); }
}
@media (max-width:700px) {
  .category-section.category-orbit { padding-block:14px 24px; }
  .category-orbit .category-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 6px; }
  .category-orbit .category strong { font-size:13px; }
  .category-orbit[data-orbit-ready="true"] .category-list { --orbit-offset:clamp(92px,25vw,170px); height:190px; }
  .category-orbit[data-orbit-ready="true"] .category { width:142px; gap:10px; }
  .category-orbit .category-art { width:96px; height:96px; }
  .category-orbit .category-glass { width:80px; height:80px; border-radius:24px; }
  .category-orbit .category-glass svg { width:38px; height:38px; }
  .category-orbit[data-orbit-ready="true"] .category[data-orbit-slot="-1"] { transform:translateX(calc(-50% + var(--orbit-offset))) translateY(-3px) scale(.72) rotate(4deg); }
  .category-orbit[data-orbit-ready="true"] .category[data-orbit-slot="1"] { transform:translateX(calc(-50% - var(--orbit-offset))) translateY(-3px) scale(.72) rotate(-4deg); }
}
@media (max-width:359px) {
  .category-orbit[data-orbit-ready="true"] .category-list { --orbit-offset:88px; }
  .category-orbit[data-orbit-ready="true"] .category { width:132px; }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) { .category-orbit .category-glass { background:#e3f3e9; } }
@media (prefers-reduced-transparency:reduce) { .category-orbit .category-glass { background:#e3f3e9; backdrop-filter:none; -webkit-backdrop-filter:none; } }
@media (prefers-reduced-motion:reduce) { .category-orbit[data-orbit-ready="true"] .category { transition:none; } }