/* Little Bits configurator: image slots are illustrated in CSS until product photos arrive. */
.little-bits-intro { max-width: 690px; margin: 0 0 24px; color:#52647b; line-height:1.55; }
.bits-family-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-bottom:28px; }
.bits-family-card { display:flex; flex-direction:column; padding:18px; border:2px solid #ffe1c0; border-radius:22px; background:#fff; box-shadow:0 8px 20px #2230440d; }
.bits-family-card h2 { margin:10px 0 2px; color:#1d3552; font-size:1.1rem; }
.bits-family-card p { margin:0 0 6px; color:#52647b; font-size:.88rem; }
.bits-from { color:#1d3552; font-size:.88rem; margin:auto 0 12px; }
.bits-primary,.bits-secondary { border:0; border-radius:12px; padding:12px 16px; font:800 .93rem Quicksand,sans-serif; cursor:pointer; }
.bits-primary { color:#fff; background:#ff6b0a; box-shadow:0 3px 0 #d95505; }
.bits-primary:hover { background:#e95600; }
.bits-secondary { background:#eef0f3; color:#20344d; }
.bits-primary:disabled { opacity:.48; cursor:not-allowed; box-shadow:none; }
.bits-config-panel { border:2px solid #ffb972; border-radius:22px; padding:clamp(18px,3vw,30px); background:#fffaf5; margin-bottom:30px; box-shadow:0 8px 25px #22304414; }
.bits-config-panel[open] { position:fixed; inset:0; box-sizing:border-box; width:min(640px,calc(100% - 32px)); max-width:none; max-height:min(88vh,760px); margin:auto; overflow-y:auto; overscroll-behavior:contain; z-index:10001; }
.bits-config-panel::backdrop { background:rgba(20,32,52,.64); backdrop-filter:blur(3px); }
body.bits-modal-open { overflow:hidden; }
.bits-config-panel[hidden] { display:none; }
.bits-panel-head { display:flex; justify-content:space-between; gap:15px; }
.bits-panel-head h2 { margin:0; color:#1d3552; font-size:1.3rem; }
.bits-panel-head p { margin:3px 0 14px; color:#52647b; font-size:.88rem; }
.bits-close { width:36px; height:36px; flex:none; border:0; border-radius:50%; background:#fff; color:#1d3552; font-size:1.65rem; cursor:pointer; }
.bits-question { margin:6px 0 15px; color:#1d3552; font-size:1rem; }
.bits-choices { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; max-height:260px; overflow:auto; }
.bits-option { min-height:60px; display:grid; justify-items:center; align-content:center; gap:5px; border:2px solid #e7e9ef; border-radius:12px; background:#fff; color:#1d3552; font:700 .85rem Quicksand,sans-serif; cursor:pointer; }
.bits-option.is-selected { border-color:#ff6b0a; box-shadow:inset 0 0 0 1px #ff6b0a; background:#fff5ed; }
.bits-candle-choices { grid-template-columns:repeat(4,minmax(0,1fr)); max-height:none; overflow:visible; gap:12px; }
.bits-candle-choices .bits-option { min-width:0; min-height:145px; align-content:start; padding:12px 6px 10px; border-color:transparent; background:transparent; box-shadow:none; }
.bits-candle-choices .bits-option.is-selected { border-color:#ff6b0a; background:#fff4e9; box-shadow:0 3px 10px #e66c1026; }
.bits-choice-art { display:block; width:min(100%,104px); aspect-ratio:1; border-radius:50%; overflow:hidden; background:#fff; box-shadow:0 5px 14px #2230441c; }
.bits-candle-choices .bits-option.is-selected .bits-choice-art { box-shadow:0 0 0 3px #ff8b19,0 5px 14px #2230441c; }
.bits-choice-art .bits-preview { width:100%!important; height:100%; border-radius:50%; background:radial-gradient(circle at 35% 25%,#fff 12%,#fff5ec 100%); }
.bits-choice-art .bits-number-candle { font-size:46px; -webkit-text-stroke:1px #fff; }
.bits-choice-art .bits-candle { height:64px; width:13px; }
.bits-option-label { display:block; text-align:center; line-height:1.25; }
.bits-candle-choices .bits-option-label { margin-top:10px; font-size:.8rem; }
.bits-swatch { width:30px; height:30px; border:2px solid #fff; border-radius:50%; box-shadow:0 0 0 1px #c8cdd4; }
.bits-helper { color:#52647b; font-size:.9rem; }
.bits-number-label { display:grid; gap:7px; max-width:190px; font-weight:800; color:#1d3552; }
.bits-number-input { width:100%; padding:10px; border:2px solid #ffcf9b; border-radius:10px; font:700 1rem Quicksand,sans-serif; }
.bits-quantity { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:18px 0; color:#1d3552; font-weight:800; }
.bits-quantity span { margin-right:10px; }
.bits-quantity button { width:36px; height:36px; border:0; border-radius:9px; background:#eef0f3; color:#1d3552; font-size:1.3rem; cursor:pointer; }
.bits-demonstration { display:flex; align-items:center; flex-wrap:wrap; gap:16px; margin:20px 0; }
.bits-draft-price { color:#1d3552; font-weight:800; }
.bits-step-actions { display:flex; justify-content:flex-end; gap:12px; }
.bits-variant-heading { display:flex; justify-content:space-between; align-items:center; gap:18px; margin:32px 0 14px; }
.bits-variant-heading h2 { margin:0; font-family:Pacifico,cursive; font-weight:400; color:#ff4f86; font-size:1.7rem; }
.bits-variant-list { display:grid; gap:10px; }
.bits-empty { margin:0; padding:22px; border:2px dashed #ffcf9b; border-radius:14px; color:#667; }
.bits-variant { display:grid; grid-template-columns:90px minmax(0,1fr) auto; gap:14px; align-items:center; padding:12px 16px; border:2px solid #ffe1c0; border-radius:14px; }
.bits-variant strong { color:#1d3552; }
.bits-variant p { margin:3px 0 0; color:#52647b; font-size:.82rem; }
.bits-variant-actions { grid-column:2/-1; display:flex; gap:10px; justify-content:flex-end; }
.bits-variant-actions button { border:0; background:none; color:#bc5308; font:800 .83rem Quicksand,sans-serif; cursor:pointer; text-decoration:underline; }
.bits-total { display:flex; justify-content:space-between; align-items:center; gap:16px; border-top:3px solid #ff9418; padding:20px 0 14px; margin-top:20px; font-weight:800; font-size:1.25rem; }
.bits-add-row { display:flex; justify-content:flex-end; }
.bits-preview { --preview-colour:#f66aa3; --preview-shade:#fff; position:relative; display:flex; align-items:center; justify-content:center; gap:5px; height:140px; border-radius:15px; background:linear-gradient(135deg,#fff4ea,#fff); overflow:hidden; }
.bits-config-panel .bits-preview { width:220px; }
.bits-variant .bits-preview { height:76px; }
.bits-candle { position:relative; width:11px; height:86px; border-radius:6px 6px 2px 2px; background:repeating-linear-gradient(145deg,var(--preview-colour) 0 9px,var(--preview-shade) 9px 13px,var(--preview-colour) 13px 19px); box-shadow:2px 5px 4px #0002; }
.bits-style-metallic .bits-candle { background:var(--preview-colour); }
.bits-style-metallic .bits-candle::after { content:''; position:absolute; inset:0 0 auto; height:25%; border-radius:6px 6px 0 0; background:linear-gradient(125deg,#ad8225,#fff5b2 48%,#ca932d); }
.bits-style-curly .bits-candle { width:14px; border-radius:35% 45% 20% 30%; transform:rotate(-7deg); background:repeating-linear-gradient(0deg,var(--preview-colour) 0 9px,var(--preview-shade) 9px 14px,var(--preview-colour) 14px 20px); }
.bits-style-bold .bits-candle { width:22px; border-radius:8px 8px 3px 3px; background:var(--preview-colour); }
.bits-number-option-two .bits-number-candle { font-family:Georgia,serif; font-style:italic; -webkit-text-stroke:1px #fff; }
.bits-candle::before,.bits-number-candle::before { content:'🔥'; position:absolute; left:50%; bottom:100%; transform:translateX(-50%); font-size:13px; }
.bits-number-candle { position:relative; color:var(--preview-colour); font-size:85px; font-family:Quicksand,sans-serif; font-weight:800; line-height:1; -webkit-text-stroke:2px #fff; filter:drop-shadow(2px 4px 2px #0002); }
.bits-variant .bits-number-candle { font-size:48px; }
.bits-preview .bits-svg-candle { display:block; width:auto; height:90%; max-width:80%; object-fit:contain; filter:drop-shadow(2px 4px 2px #0002); }
.bits-preview.bits-number-art { gap:0; }
.bits-preview .bits-number-image { display:block; width:auto; max-width:48%; height:82%; object-fit:contain; filter:drop-shadow(2px 3px 2px #0002); }
.bits-preview.bits-number-art[data-digits="3"] .bits-number-image { max-width:31%; height:70%; }
.bits-choice-art .bits-number-art .bits-number-image { height:78%; }
.bits-variant .bits-number-art .bits-number-image { height:85%; }
.bits-choice-art .bits-svg-candle { height:85%; }
.bits-candle-choices:not(.bits-colour-choices) .bits-option:nth-child(5n+1) .bits-svg-candle { transform:rotate(-5deg); }
.bits-candle-choices:not(.bits-colour-choices) .bits-option:nth-child(5n+2) .bits-svg-candle { transform:rotate(4deg); }
.bits-candle-choices:not(.bits-colour-choices) .bits-option:nth-child(5n+3) .bits-svg-candle { transform:rotate(-3deg); }
.bits-candle-choices:not(.bits-colour-choices) .bits-option:nth-child(5n+4) .bits-svg-candle { transform:rotate(5deg); }
.bits-candle-choices:not(.bits-colour-choices) .bits-option:nth-child(5n) .bits-svg-candle { transform:rotate(-4deg); }
.bits-variant .bits-candle { height:42px; width:7px; }
.bits-badge-number,.bits-balloon-text { display:grid; place-items:center; width:92px; height:92px; border-radius:50%; color:white; font-size:34px; font-weight:800; background:var(--preview-colour); border:8px solid #ffbfd5; box-shadow:0 5px 9px #0002; }
.bits-balloon-text { border-radius:50% 50% 47% 47%; border:0; }
.bits-banner-text,.bits-topper-text,.bits-confetti-text { color:var(--preview-colour); font:800 1.35rem Quicksand,sans-serif; text-align:center; padding:12px; }
.bits-variant .bits-badge-number,.bits-variant .bits-balloon-text { width:50px; height:50px; font-size:19px; border-width:4px; }
.bits-variant .bits-banner-text,.bits-variant .bits-topper-text,.bits-variant .bits-confetti-text { font-size:.8rem; }
@media(max-width:800px) { .bits-family-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .bits-family-grid { grid-template-columns:1fr; } .bits-family-card { display:grid; grid-template-columns:95px 1fr; column-gap:14px; align-items:center; } .bits-family-card .bits-preview { grid-row:1/5; height:105px; } .bits-family-card .bits-candle { height:58px; width:7px; } .bits-family-card .bits-number-candle { font-size:55px; } .bits-family-card h2 { margin:0; } .bits-family-card .bits-primary { grid-column:1/-1; margin-top:12px; } .bits-choices { grid-template-columns:repeat(2,minmax(0,1fr)); } .bits-candle-choices { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; } .bits-candle-choices .bits-option { min-height:135px; } .bits-variant { grid-template-columns:65px minmax(0,1fr) auto; gap:8px; padding:9px; } .bits-variant .bits-preview { height:62px; } .bits-variant-actions { grid-column:1/-1; } .bits-config-panel .bits-preview { max-width:100%; } .bits-config-panel[open] { width:calc(100% - 20px); max-height:calc(100dvh - 24px); padding:16px; border-radius:18px; } }

/* The dialog owns the rounded frame; scrolling stays inside it. */
.bits-config-panel[open] { padding:0; overflow:hidden; }
.bits-dialog-scroll { box-sizing:border-box; width:100%; max-height:calc(min(88vh,760px) - 4px); overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; padding:clamp(18px,3vw,30px); }

/* About-page circular choice treatment, without a second rectangular card. */
.bits-candle-choices { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.bits-candle-choices .bits-option,
.bits-candle-choices .bits-option.is-selected { box-sizing:border-box; width:calc((100% - 36px)/4); min-width:105px; max-width:130px; min-height:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:0; padding:5px 0 8px; border:0; border-radius:0; background:transparent; box-shadow:none; }
.bits-candle-choices .bits-option:focus-visible { outline:2px solid #ff6b0a; outline-offset:2px; border-radius:8px; }
.bits-candle-choices .bits-choice-art { box-sizing:border-box; width:min(100%,106px); border:2px solid #ff8112; transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.bits-candle-choices .bits-option:hover .bits-choice-art,
.bits-candle-choices .bits-option.is-selected .bits-choice-art { border-color:#ff4f86; box-shadow:0 0 0 3px #ff4f8640,0 5px 14px #2230441c; }
.bits-candle-choices .bits-option:hover .bits-choice-art { transform:translateY(-2px); }
.bits-candle-choices .bits-option-label { margin-top:9px; font-size:.82rem; }
.bits-option-price { margin-top:3px; color:#52647b; font-size:.71rem; font-weight:700; line-height:1.3; text-align:center; }
.bits-colour-choices .bits-choice-art { width:78px; height:78px; box-shadow:0 4px 12px #2230441c; }
.bits-colour-choices .bits-option { min-height:110px; }
.bits-colour-preview { display:flex; justify-content:center; align-items:center; margin:12px auto 0; }
.bits-colour-preview .bits-preview { width:150px; height:112px; background:transparent; }
.bits-colour-preview .bits-number-candle { font-size:66px; }
.bits-colour-preview .bits-candle { height:75px; }
.bits-demonstration { margin:10px 0 16px; }
.bits-draft-price { margin:0; font-size:1.05rem; }
@media(max-width:600px) {
  .bits-dialog-scroll { max-height:calc(100dvh - 28px); padding:16px; }
  .bits-candle-choices .bits-option,
  .bits-candle-choices .bits-option.is-selected { width:calc((100% - 8px)/2); max-width:150px; }
}

/* Compact candle stages fit without a second row of colour swatches. */
.bits-candle-choices:not(.bits-colour-choices) { gap:8px; }
.bits-candle-choices:not(.bits-colour-choices) .bits-option,
.bits-candle-choices:not(.bits-colour-choices) .bits-option.is-selected { width:calc((100% - 32px)/5); min-width:0; max-width:132px; }
.bits-colour-choices { flex-wrap:nowrap; gap:5px; }
.bits-colour-choices .bits-option,
.bits-colour-choices .bits-option.is-selected { width:calc((100% - 35px)/8); min-width:0; max-width:65px; padding:3px 0; }
.bits-colour-choices .bits-choice-art { width:min(100%,40px); height:auto; aspect-ratio:1; }
.bits-colour-choices .bits-option-label { margin-top:6px; font-size:.69rem; overflow-wrap:anywhere; }
.bits-colour-preview { margin:5px auto 0; }
.bits-colour-preview .bits-preview { height:95px; }
.bits-final-preview { width:118px; height:118px; margin:4px auto 10px; border:2px solid #ff8112; border-radius:50%; overflow:hidden; box-shadow:0 5px 14px #2230441c; }
.bits-final-preview .bits-preview { width:100%; height:100%; background:radial-gradient(circle at 35% 25%,#fff,#fff5ec); }
.bits-final-preview .bits-candle { height:82px; }
.bits-final-preview .bits-number-candle { font-size:57px; }
.bits-style-long .bits-candle { height:106px; width:13px; }
.bits-choice-art .bits-style-long .bits-candle { height:82px; }
.bits-colour-preview .bits-style-long .bits-candle { height:88px; }
.bits-final-preview .bits-style-long .bits-candle { height:98px; }
@media(max-width:600px) {
  .bits-candle-choices:not(.bits-colour-choices) .bits-option,
  .bits-candle-choices:not(.bits-colour-choices) .bits-option.is-selected { width:calc((100% - 16px)/3); max-width:104px; padding:2px 0 4px; }
  .bits-candle-choices:not(.bits-colour-choices) .bits-choice-art { width:min(100%,72px); }
  .bits-candle-choices:not(.bits-colour-choices) .bits-choice-art .bits-candle { height:50px; }
  .bits-candle-choices:not(.bits-colour-choices) .bits-choice-art .bits-style-long .bits-candle { height:58px; }
  .bits-candle-choices:not(.bits-colour-choices) .bits-choice-art .bits-number-candle { font-size:35px; }
  .bits-candle-choices:not(.bits-colour-choices) .bits-option-label { margin-top:5px; font-size:.72rem; }
  .bits-candle-choices:not(.bits-colour-choices) .bits-option-price { margin-top:2px; font-size:.64rem; }
  .bits-colour-choices { gap:4px; }
  .bits-colour-choices .bits-option,
  .bits-colour-choices .bits-option.is-selected { width:calc((100% - 28px)/8); }
  .bits-colour-choices .bits-choice-art { width:min(100%,29px); }
  .bits-colour-choices .bits-option-label { font-size:.56rem; line-height:1.1; }
  .bits-final-preview { width:92px; height:92px; }
  .bits-final-preview .bits-candle { height:62px; }
  .bits-final-preview .bits-style-long .bits-candle { height:78px; }
  .bits-final-preview .bits-number-candle { font-size:43px; }
}

/* Match the framed product cards on the homepage. */
.bits-family-grid{gap:20px}
.bits-family-card{display:flex;flex-direction:column;align-items:center;min-height:0;padding:0 0 22px;border:6px solid var(--brand,#ff8700);border-radius:36px;background:#fff;text-align:center;overflow:hidden;box-shadow:0 15px 35px #0000001a;transition:transform .25s ease,border-color .25s ease}
.bits-family-card:hover{transform:translateY(-8px);border-color:var(--pink,#ff4f86)}
.bits-card-image{box-sizing:border-box;display:grid;place-items:center;width:100%;height:190px;overflow:hidden;border-bottom:6px solid var(--brand,#ff8700);background:#fff8f1}
.bits-card-image .bits-card-photo{display:block;width:100%;height:100%;object-fit:cover}
.bits-card-image .bits-preview{grid-row:auto;width:100%;height:100%;border-radius:0;background:linear-gradient(135deg,#fff7ef,#fff)}
.bits-card-image .bits-svg-candle{height:76%}
.bits-family-card h2{margin:16px 12px 6px;padding:0 10px;color:var(--pink,#ff4f86);font:400 1.55rem Pacifico,cursive;line-height:1.35}
.bits-family-card p{margin:0 16px 12px;color:#52647b;font-size:.87rem;line-height:1.45}
.bits-family-card .bits-from{margin:auto 12px 12px;color:#20344d;font-size:.85rem}
.bits-family-card .bits-primary{margin:0 12px;align-self:center;padding:10px 20px;border-radius:15px;font-size:.82rem;text-transform:uppercase}
@media(max-width:600px){
  .bits-family-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
  .bits-family-card{display:flex;padding-bottom:13px;border-width:4px;border-radius:22px}
  .bits-card-image{height:112px;border-bottom-width:4px}
  .bits-family-card h2{margin:10px 5px 5px;padding:0;font-size:1.12rem}
  .bits-family-card p{margin:0 7px 8px;font-size:.72rem}
  .bits-family-card .bits-from{margin:auto 7px 8px;font-size:.72rem}
  .bits-family-card .bits-primary{margin:0 6px;padding:8px 11px;font-size:.7rem}
}