/* Demonstration store surfaces stay light in both portfolio themes, like Figma. */
.anchor-demo { --a-ink:#193724;--a-muted:#54615a;--a-line:#e2e7e1;--a-green:#067346;background:#f6f7f5;color:var(--a-ink);padding:clamp(16px,3vw,40px);border-radius:12px;font:14px/1.5 'Geist',sans-serif; }
.anchor-demo * { box-sizing:border-box; }
.anchor-demo h3,.anchor-demo h4,.anchor-demo h5,.anchor-demo p { margin:0 0 16px; }
.anchor-demo h3 { font-size:14px; }.anchor-demo h4 { font-size:18px; }.anchor-demo h5 { font-size:13px;margin-top:24px; }
.anchor-demo button,.anchor-demo input,.anchor-demo select,.anchor-demo textarea { font:inherit;color:inherit; }
.anchor-demo button,.anchor-demo select { cursor:pointer; }
.anchor-demo button { border:1px solid var(--a-line);border-radius:6px;background:#fff;padding:9px 12px;transition:background 150ms ease-out,transform 100ms ease-out; }
.anchor-demo button:hover:not(:disabled) { background:#eef2ec; }.anchor-demo button:active:not(:disabled) { transform:scale(.97); }
.anchor-demo button:disabled { opacity:.5;cursor:default; }
.anchor-demo :is(button,input,select,textarea,summary):focus-visible { outline:2px solid #067346;outline-offset:3px; }
.anchor-demo .anchor-primary { background:var(--a-green);color:#fff;border-color:transparent; }.anchor-demo .anchor-primary:hover:not(:disabled) { background:#045a36; }
.anchor-demo label { display:flex;flex-direction:column;gap:6px;font-size:12px; }
.anchor-demo input:not([type=checkbox]):not([type=range]),.anchor-demo select,.anchor-demo textarea { width:100%;padding:10px 12px;border:1px solid var(--a-line);border-radius:5px;background:#fff;min-width:0; }
.anchor-demo input[type=range] { width:100%;accent-color:#067346; }.anchor-demo input[type=checkbox] { accent-color:#067346;width:20px;height:20px; }
.anchor-demo details { border-bottom:1px solid var(--a-line); }.anchor-demo summary { cursor:pointer;padding:14px 0; }.anchor-demo details p { margin-top:12px; }
.anchor-demo svg { display:block;width:20px;height:20px;flex-shrink:0; }
.anchor-demo-note { font-size:12px!important;color:var(--a-muted);margin:24px 0 0!important;max-width:75ch; }
.anchor-pair { display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,3vw,32px);align-items:start; }
.anchor-example { background:#fff;padding:clamp(16px,2.5vw,28px);border-radius:10px;min-height:280px; }
.anchor-example.is-before { background:#eee; }.anchor-example.is-before button { background:#202020;color:#fff; }.anchor-example.is-before h4 { font-weight:400; }
.anchor-result { display:flex;gap:16px;align-items:center;padding:16px 0; }.anchor-result img { width:76px;height:86px;object-fit:cover;border-radius:6px; }.anchor-result strong,.anchor-result span { display:block; }.anchor-result span { color:var(--a-muted);margin-top:6px; }
.anchor-recent { display:grid;gap:4px; }.anchor-recent button { border:0;text-align:left; }.anchor-category-links { display:flex;flex-wrap:wrap;gap:8px; }.anchor-category-links button { background:#f4f5f3;border:0; }
.anchor-demo-toolbar { display:flex;gap:16px;align-items:center;justify-content:space-between;margin-bottom:24px;font-weight:600; }.anchor-demo-toolbar button { font-weight:400;font-size:12px; }
.anchor-carousel-shell { display:flex;gap:12px;align-items:center; }.anchor-carousel-shell>button { padding:8px;border-radius:50%; }.anchor-carousel-prev svg { transform:rotate(180deg); }
.anchor-fast-track { display:flex;gap:56px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 4px 20px;scrollbar-width:thin;min-width:0; }
.anchor-demo .anchor-fast { flex:0 0 100px;border:0;border-radius:0;padding:0;background:transparent;scroll-snap-align:start;text-align:center; }.anchor-fast img { width:100px;height:140px;object-fit:cover;border-radius:5px;transition:transform 200ms ease-out,box-shadow 200ms ease-out; }.anchor-fast span { display:block;margin-top:12px;line-height:1.3; }.anchor-fast:hover img { transform:scale(1.05);box-shadow:0 8px 16px #1937241a; }.anchor-fast[aria-pressed=true] img { outline:2px solid #067346;outline-offset:3px; }
.anchor-selection { margin-top:20px!important; }.anchor-selected-product:empty { display:none; }
.anchor-count { display:inline-block;vertical-align:middle;background:#193724;color:white;border-radius:15px;padding:2px 7px;font-size:10px;white-space:nowrap; }
.anchor-active-filters { display:flex;flex-wrap:wrap;gap:6px;margin:16px 0; }.anchor-active-filters:empty { display:none; }.anchor-active-filters button { padding:4px 8px;font-size:11px;background:#eef2ec; }
.anchor-demo .anchor-stock { flex-direction:row;align-items:center;justify-content:space-between;font-size:13px; }
.anchor-options { display:flex;gap:6px;flex-wrap:wrap; }.anchor-options button { font-size:11px;padding:6px 9px;display:flex;align-items:center;gap:5px; }.anchor-options button span { width:10px;height:10px;border-radius:50%;border:1px solid #0002; }.anchor-options button[aria-pressed=true] { background:#193724;color:white;border-color:#193724; }
.anchor-price-value { float:right; }.anchor-filter-actions { display:flex;gap:10px;margin-top:28px; }.anchor-filter-actions button { flex:1; }.anchor-filter-status { font-size:12px;margin-top:12px!important; }
.anchor-product>img { width:100%;aspect-ratio:1;object-fit:cover;border-radius:5px;margin-bottom:16px; }.anchor-product-heading { display:flex;justify-content:space-between;gap:12px; }.anchor-product-heading h4 { font-size:14px;font-weight:400; }.anchor-product-heading>div { flex-shrink:0;text-align:right; }.anchor-product-heading del { display:block;font-size:11px;color:var(--a-muted); }.anchor-product fieldset { border:0;padding:0;margin:12px 0; }.anchor-product legend { font-size:12px;margin-bottom:8px; }.anchor-buy-row { display:flex;gap:10px;align-items:end;margin-top:12px; }.anchor-buy-row label { width:80px; }.anchor-buy-row button { flex:1;min-height:42px; }.anchor-product-feedback { font-size:12px;margin:12px 0 0!important; }
.anchor-cart-line { display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:start;padding:20px 0;border-bottom:1px solid var(--a-line); }.anchor-cart-line img { width:64px;height:80px;object-fit:cover;border-radius:5px; }.anchor-cart-line strong { font-size:12px; }.anchor-cart-line span { display:block;font-size:11px;color:var(--a-muted);margin:6px 0; }.anchor-cart-line input { max-width:70px;padding:5px!important; }.anchor-cart-line label { font-size:10px; }.anchor-demo progress { width:100%;height:6px;accent-color:#4389fb; }.anchor-shipping-message { font-size:12px;margin-bottom:4px!important; }.anchor-totals { margin:24px 0; }.anchor-totals>div { display:flex;justify-content:space-between;padding:5px 0; }.anchor-totals dd { margin:0; }.anchor-totals>div:last-child { font-weight:700;border-top:1px solid var(--a-line);margin-top:8px;padding-top:12px; }.anchor-checkout { width:100%; }.anchor-checkout-status { font-size:12px;margin:12px 0 0!important; }
.anchor-store-nav { background:#fff;padding:20px;display:flex;gap:32px;align-items:flex-start;flex-wrap:wrap;border-radius:10px;margin-bottom:24px; }.anchor-store-nav>strong { font-size:20px; }.anchor-store-nav details { border:0; }.anchor-store-nav summary { padding:4px 0; }.anchor-menu { min-width:240px;max-width:100%; }.anchor-menu-items { padding-top:16px; }.anchor-menu-items>details { border-bottom:1px solid var(--a-line); }.anchor-menu-items summary { display:flex;justify-content:space-between;align-items:center;padding:10px 0; }.anchor-menu-items details[open]>summary svg { transform:rotate(90deg); }.anchor-menu-items details>div { display:flex;gap:16px;padding:16px 0;align-items:center; }.anchor-menu-items img { width:64px;height:80px;object-fit:cover; }
.anchor-product-details { background:white;padding:8px 24px;border-radius:10px; }.anchor-accordion { border-bottom:1px solid var(--a-line); }.anchor-accordion:last-child { border-bottom:0; }.anchor-accordion h3 { margin:0; }.anchor-accordion button { width:100%;border:0;border-radius:0;display:flex;justify-content:space-between;text-align:left;padding:20px 0; }.anchor-accordion button:hover { background:white!important; }.anchor-accordion svg { transform:rotate(90deg);transition:transform 250ms ease-out; }.anchor-accordion.is-open svg { transform:rotate(-90deg); }.anchor-accordion-content { display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows 300ms cubic-bezier(.22,1,.36,1),opacity 200ms ease-out; }.anchor-accordion-content>div { overflow:hidden; }.anchor-accordion-content p { padding-bottom:16px;margin:0;max-width:65ch; }.anchor-accordion.is-open .anchor-accordion-content { grid-template-rows:1fr;opacity:1; }
.anchor-store-footer { background:#141414;color:#fff;padding:clamp(20px,4vw,48px); }.anchor-store-footer>div:first-child { display:flex;justify-content:space-between;gap:32px;border-bottom:1px solid #fff2;padding-bottom:32px; }.anchor-footer-brand { font-size:36px;font-weight:500;letter-spacing:-.03em; }.anchor-store-footer>div:first-child p { max-width:42ch;font-size:12px; }.anchor-footer-columns { display:grid;grid-template-columns:1fr 1fr 2fr;gap:24px;margin-top:32px; }.anchor-footer-columns h4 { font-size:13px; }.anchor-footer-columns p { font-size:12px;line-height:2; }.anchor-footer-columns input { background:transparent!important;border-color:#555!important;color:#fff!important; }.anchor-footer-columns input::placeholder { color:#ccc; }.anchor-footer-columns button { margin-top:12px;color:#193724; }.anchor-footer-note { font-size:11px;margin-top:32px!important;color:#ccc; }
.anchor-motion-library details { padding:4px 0 16px; }.anchor-motion-library video { display:block;width:100%;max-height:650px;background:#fff; }.anchor-motion-library a { display:inline-block;color:#193724;margin-top:12px; }
@media(max-width:700px){.anchor-pair { grid-template-columns:1fr; }.anchor-example { min-height:0; }.anchor-fast-track { gap:24px; }.anchor-carousel-shell { gap:6px; }.anchor-carousel-shell>button { padding:5px; }.anchor-footer-columns { grid-template-columns:1fr 1fr; }.anchor-footer-columns form { grid-column:1/-1; }.anchor-store-footer>div:first-child { flex-direction:column;gap:16px; }.anchor-demo-toolbar { align-items:flex-start; }.anchor-store-nav { gap:16px; }.anchor-menu { min-width:0;flex:1; }.anchor-cart-line { grid-template-columns:52px 1fr auto;gap:8px; }.anchor-cart-line img { width:52px;height:70px; }}
@media(prefers-reduced-motion:reduce){.anchor-demo *, .anchor-demo *::before,.anchor-demo *::after { transition:none!important;animation:none!important;scroll-behavior:auto!important; }}

.anchor-quick-launch { display:flex;align-items:center;justify-content:space-between;gap:24px; }.anchor-quick-launch>img { width:180px;max-width:40%;height:210px;object-fit:cover;border-radius:8px; }
.anchor-quick-dialog { border:0;width:min(446px,calc(100vw - 32px));max-height:90dvh;padding:20px;border-radius:16px;box-shadow:0 24px 64px #0003;overflow-y:auto; }.anchor-quick-dialog::backdrop { background:#0006; }.anchor-quick-dialog .anchor-close-quick { position:absolute;z-index:1;right:10px;top:10px;padding:8px;border-radius:50%; }.anchor-quick-media { display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin-bottom:20px; }.anchor-quick-media img { width:76%;height:307px;object-fit:cover;scroll-snap-align:start;flex-shrink:0; }.anchor-quick-dialog fieldset { border:0;padding:0;margin:16px 0; }.anchor-quick-dialog legend { font-size:12px;margin-bottom:8px; }.anchor-quick-dialog .anchor-quick-add { margin-top:20px;width:100%; }.anchor-quick-feedback { font-size:12px;margin-top:12px!important; }

.anchor-demo.is-figma-study { padding:0;background:white;overflow:hidden; }.anchor-html-study iframe { display:block;width:100%;border:0;background:white; }.anchor-html-open { display:inline-block;color:#193724;padding:12px 16px;font-size:12px; }.anchor-motion-library .anchor-html-study { margin-bottom:12px; }

.anchor-study-subheading { padding:20px 24px 0;margin:0;font-size:16px;color:#202020; }
