.cib{--o:#ff8833;--blue:#c6e2f4;--ch:#34394d;--dark:#3a3f4b;--muted:#666;--flip:1.2s;--ease:cubic-bezier(.45,.05,.25,1);margin:28px 0;color:var(--ch);font-family:inherit}
.cib *{box-sizing:border-box}
.cib .cib-lab{display:block;font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;margin:0 0 8px;line-height:1.3}
.cib .cib-txt{font-size:17px;line-height:1.5;font-weight:500;margin:0!important;padding:0}
.cib .cib-dark{background:var(--dark);color:#eceef1}.cib .cib-dark .cib-lab{color:#b9bdc6}.cib .cib-dark .cib-title{color:#fff!important}
.cib .cib-light{background:#fff;color:var(--ch)}.cib .cib-light .cib-lab{color:#c25510}
.cib .cib-blue{background:var(--blue);color:var(--ch)}.cib .cib-blue .cib-lab{color:#c25510}
.cib .cib-tip{text-align:center;font-size:14px;color:var(--muted);margin:14px 0 0!important}
.cib .cib-grid{display:grid;gap:20px;grid-template-columns:repeat(2,minmax(0,1fr))}
.cib .cib-grid.cib-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cib .cib-grid.cib-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cib img{max-width:100%;-webkit-user-drag:none}
.cib-empty{padding:24px;border:2px dashed #c6e2f4;border-radius:16px;color:#666;text-align:center;font-size:14px}
/* flip cards: both faces share one grid cell, so the card is as tall as its tallest face */
.cib .cib-flip{display:grid;perspective:1600px;cursor:pointer;outline:none;border-radius:24px}
.cib .cib-flip:focus-visible{box-shadow:0 0 0 3px var(--o)}
.cib .cib-flip-in{display:grid;transform-style:preserve-3d;transition:transform var(--flip) var(--ease)}
.cib .cib-flip.is-on .cib-flip-in{transform:rotateY(180deg)}
.cib .cib-face{grid-area:1/1;display:flex;flex-direction:column;justify-content:center;padding:22px 24px;border-radius:24px;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 6px 18px rgba(52,57,77,.12)}
.cib .cib-face--back{transform:rotateY(180deg)}
.cib .cib-title{font-size:20px!important;line-height:1.2!important;font-weight:600!important;margin:0 0 6px!important;padding:0!important;text-transform:none!important;letter-spacing:0!important;color:var(--ch)}
.cib .cib-art{display:block;width:88%;height:auto;margin:0 auto 6px}
/* sliders */
.cib .cib-slider{position:relative;overflow:hidden;border-radius:24px;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize;--pos:50%;box-shadow:0 10px 30px rgba(52,57,77,.16)}
.cib .cib-pane{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.cib .cib-pane--top{clip-path:inset(0 0 0 var(--clip,var(--pos)))}
.cib .cib-fill{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;margin:0}
.cib .cib-handle{position:absolute;top:0;bottom:0;left:var(--pos);width:4px;margin-left:-2px;background:#fff;z-index:5;box-shadow:0 0 12px rgba(0,0,0,.25);outline:none}
.cib .cib-grip{position:absolute;top:50%;left:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:var(--o);box-shadow:0 2px 8px rgba(0,0,0,.22);transition:transform .35s var(--ease)}
.cib .cib-grip:before,.cib .cib-grip:after{content:"";position:absolute;top:50%;width:8px;height:8px;margin-top:-4px;border:solid #fff;border-width:0 0 3px 3px}
.cib .cib-grip:before{left:11px;transform:rotate(45deg)}.cib .cib-grip:after{right:11px;transform:rotate(-135deg)}
.cib .cib-slider:hover .cib-grip,.cib .cib-handle:focus-visible .cib-grip,.cib .cib-slider.is-drag .cib-grip{transform:scale(1.08)}
.cib .cib-pin{position:absolute;top:18px;z-index:3;font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;padding:6px 12px;border-radius:30px}
.cib .cib-pin--l{left:18px;background:rgba(255,255,255,.14);color:#eceef1}
.cib .cib-light .cib-pin--l,.cib .cib-blue .cib-pin--l{background:var(--dark);color:#fff}
.cib .cib-pin--r{right:18px;background:#fff;color:#c25510}
.cib .cib-dark .cib-pin--r{background:rgba(255,255,255,.14);color:#eceef1}
.cib .cib-stack{display:grid;gap:18px}
/* text slider: panes share one grid cell, so the slider grows with its text */
.cib .cib-tslider{display:grid;min-height:170px}
.cib .cib-tslider .cib-pane{position:relative;inset:auto;grid-area:1/1;justify-content:flex-start;padding:28px 0}
.cib .cib-tslider .cib-pane--top{justify-content:flex-end}
.cib .cib-half{width:50%;padding:0 40px 0 30px}
.cib .cib-half--r{padding:0 30px 0 40px}
/* reveal cards */
.cib .cib-reveal{display:grid;aspect-ratio:10/9;border-radius:24px;cursor:pointer;outline:none;overflow:hidden;box-shadow:0 6px 18px rgba(52,57,77,.12)}
.cib .cib-reveal:focus-visible{box-shadow:0 0 0 3px var(--o)}
.cib .cib-cover,.cib .cib-revealed{grid-area:1/1}
.cib .cib-revealed{display:flex;flex-direction:column;justify-content:center;padding:30px 34px;background:#fff;border:2px solid var(--blue);border-radius:24px;opacity:0;transition:opacity .6s var(--ease)}
.cib .cib-revealed .cib-lab{color:#c25510}.cib .cib-revealed .cib-txt{font-size:20px}
.cib .cib-reveal.is-on .cib-revealed{opacity:1}
/* numbered image list */
.cib .cib-numimg-fig{margin:0 0 22px;padding:22px;background:#fff;border-radius:24px;box-shadow:0 6px 18px rgba(52,57,77,.12)}
.cib .cib-numimg-img{display:block;width:100%;height:auto;margin:0}
.cib .cib-numlist{margin:0;padding:0;list-style:none;counter-reset:cib;display:grid;column-gap:28px}
.cib .cib-numlist.cib-cols-2{grid-template-columns:1fr 1fr}
.cib .cib-numlist li{counter-increment:cib;position:relative;padding:0 0 14px 40px;margin:0;font-size:15px;line-height:1.5;color:var(--muted);list-style:none}
.cib .cib-numlist li:before{content:counter(cib);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:var(--o);color:#fff;font-size:13px;font-weight:700;text-align:center;line-height:26px}
.cib .cib-numlist strong{display:block;color:var(--ch);font-weight:600}
@media (max-width:1000px){.cib .cib-grid.cib-cols-3,.cib .cib-grid.cib-cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:820px){.cib .cib-grid,.cib .cib-grid.cib-cols-3,.cib .cib-grid.cib-cols-4,.cib .cib-numlist.cib-cols-2{grid-template-columns:1fr}.cib .cib-half{padding:0 22px 0 16px}.cib .cib-half--r{padding:0 16px 0 22px}.cib .cib-tslider .cib-txt{font-size:15px}.cib .cib-revealed .cib-txt{font-size:18px}.cib .cib-numimg-fig{padding:12px}}
@media (prefers-reduced-motion:reduce){.cib *{transition:none!important}}
/* hold our colors against theme text rules (blog p / h3 colors) */
.cib .cib-dark .cib-txt,.cib .cib-dark p{color:#eceef1!important}
.cib .cib-light .cib-txt,.cib .cib-blue .cib-txt,.cib .cib-revealed .cib-txt,.cib .cib-light p,.cib .cib-blue p{color:#34394d!important}
.cib .cib-light .cib-title,.cib .cib-blue .cib-title{color:#34394d!important}
.cib .cib-dark .cib-lab{color:#b9bdc6!important}.cib .cib-light .cib-lab,.cib .cib-blue .cib-lab,.cib .cib-revealed .cib-lab{color:#c25510!important}
.cib .cib-tip{color:#666!important}

/* 1.0.3: faded cover behind revealed text, frameless image, handle-at-right start */
.cib .cib-revealed{position:relative;overflow:hidden}
.cib .cib-revealed-bg{position:absolute;inset:0;opacity:.12;pointer-events:none;filter:grayscale(1)}
.cib .cib-revealed .cib-lab,.cib .cib-revealed .cib-txt{position:relative;z-index:1}
.cib .cib-numimg-fig.cib-frame-none{padding:0;background:none;box-shadow:none}
.cib .cib-frame-none .cib-numimg-img{border-radius:24px;box-shadow:0 10px 30px rgba(20,22,30,.25)}
.cib .cib-tslider[data-start=right] .cib-half--r{padding-right:72px}
@media (max-width:820px){.cib .cib-tslider[data-start=right] .cib-half--r{padding-right:56px}}

/* 1.0.5: walkthrough fixes */
.cib .cib-tip--above{margin:0 0 16px!important;text-align:left}
@media (hover:hover) and (pointer:fine){
 .cib .cib-flip,.cib .cib-reveal{transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1)}
 .cib .cib-flip:hover,.cib .cib-reveal:hover{transform:translateY(-3px)}
 .cib .cib-reveal:hover{box-shadow:0 12px 26px rgba(52,57,77,.2)}
}
.cib .cib-tslider.cib-wipe{min-height:0}
.cib .cib-tslider.cib-wipe .cib-pane,.cib .cib-tslider.cib-wipe .cib-pane--top{justify-content:flex-start;padding:26px 0}
.cib .cib-tslider.cib-wipe .cib-half,.cib .cib-tslider.cib-wipe .cib-half--r{width:100%;padding:0 84px 0 34px;text-align:left}
.cib .cib-tslider.cib-wipe .cib-txt{font-size:19px}
.cib .cib-grid.cib-cols-4 .cib-revealed{padding:22px}
.cib .cib-grid.cib-cols-4 .cib-revealed .cib-txt{font-size:16px}
.cib .cib-grid.cib-cols-3 .cib-title{font-size:19px!important}
.cib .cib-grid.cib-cols-3 .cib-txt{font-size:16px}
@media (max-width:820px){.cib .cib-tslider.cib-wipe .cib-half,.cib .cib-tslider.cib-wipe .cib-half--r{padding:0 64px 0 20px}.cib .cib-tslider.cib-wipe .cib-txt{font-size:16px}}
.cib .cib-grid.cib-cols-4 .cib-revealed{padding:18px 20px}
.cib .cib-grid.cib-cols-4 .cib-revealed .cib-txt{font-size:15px;line-height:1.45}
@media (max-width:1000px){.cib .cib-grid.cib-cols-4 .cib-revealed{padding:26px 28px}.cib .cib-grid.cib-cols-4 .cib-revealed .cib-txt{font-size:18px}}

/* 1.0.7: theme forces every .blog-content link orange, which blanks the site's own button text */
.blog-content a.cantata-btn.cantata-btn{color:#fff!important}
/* wipe slider glides to the nearest end on release */
.cib .cib-tslider.cib-wipe.is-settling .cib-pane--top{transition:clip-path .45s cubic-bezier(.22,1,.36,1)}
.cib .cib-tslider.cib-wipe.is-settling .cib-handle{transition:left .45s cubic-bezier(.22,1,.36,1)}
.blog-content a.cantata-btn.cantata-btn{text-decoration:none!important}

/* 1.0.9: clickable numbers on an image */
.cib .cib-map{position:relative}
.cib .cib-map-stage{position:relative;line-height:0}
.cib .cib-spot{position:absolute;z-index:3;width:36px;height:36px;margin:-18px 0 0 -18px!important;padding:0!important;border-radius:50%!important;border:2px solid #1b1d24!important;background:#ff8833!important;color:#1b1d24!important;font-family:inherit!important;font-weight:700!important;font-size:15px!important;line-height:32px!important;text-align:center;cursor:pointer;box-shadow:0 0 0 4px rgba(255,136,51,.28),0 4px 10px rgba(0,0,0,.35);transition:transform .25s cubic-bezier(.22,1,.36,1),background-color .25s,box-shadow .25s}
.cib .cib-spot:hover{transform:scale(1.12)}
.cib .cib-spot:focus-visible{outline:3px solid #fff;outline-offset:2px}
.cib .cib-spot[aria-expanded=true]{background:#fff!important;transform:scale(1.12);box-shadow:0 0 0 5px rgba(255,255,255,.3),0 4px 12px rgba(0,0,0,.4)}
.cib .cib-spot-card{position:absolute;z-index:6;width:300px;max-width:72%;line-height:1.5;background:#fff;color:#34394d;border-radius:16px;padding:18px 44px 18px 20px;box-shadow:0 14px 34px rgba(0,0,0,.45);opacity:0;transform:translateY(6px);transition:opacity .3s cubic-bezier(.22,1,.36,1),transform .3s cubic-bezier(.22,1,.36,1)}
.cib .cib-spot-card[hidden]{display:block!important;visibility:hidden;pointer-events:none}
.cib .cib-spot-card.is-open{opacity:1;transform:none;visibility:visible;pointer-events:auto}
.cib .cib-spot-n{display:inline-block;width:24px;height:24px;border-radius:50%;background:#ff8833;color:#1b1d24;font-size:12px;font-weight:700;line-height:24px;text-align:center;margin:0 0 8px}
.cib .cib-spot-t{display:block;font-size:17px;font-weight:600;color:#34394d!important;margin:0 0 4px}
.cib .cib-spot-p{margin:0!important;font-size:15px;line-height:1.5;color:#34394d!important}
.cib .cib-spot-x{position:absolute;top:10px;right:10px;width:30px;height:30px;padding:0!important;border:0!important;border-radius:50%!important;background:#f0f1f4!important;color:#34394d!important;font-size:20px!important;line-height:30px!important;cursor:pointer}
.cib .cib-spot-x:hover{background:#e3e5ea!important}
@media (max-width:700px){
 .cib .cib-spot{width:30px;height:30px;margin:-15px 0 0 -15px!important;font-size:13px!important;line-height:26px!important}
 .cib .cib-spot-card{position:relative;left:auto!important;top:auto!important;width:auto;max-width:none;margin:12px 0 0;box-shadow:0 8px 22px rgba(52,57,77,.18);border:2px solid #c6e2f4}
 .cib .cib-spot-card[hidden]{display:none!important}
}

/* 1.0.12: theme sets font-size 16px / line-height 32px on spans and p in .blog-content; pin our numbers and card text */
.cib .cib-spot-n{display:flex!important;align-items:center;justify-content:center;width:26px!important;height:26px!important;padding:0!important;font-size:13px!important;line-height:1!important;font-weight:700!important;margin:0 0 10px!important}
.cib .cib-spot{display:flex!important;align-items:center;justify-content:center;line-height:1!important}
.cib .cib-spot-t{line-height:1.3!important;font-size:17px!important}
.cib .cib-spot-p{line-height:1.5!important;font-size:15px!important}
.cib .cib-spot-x{display:flex!important;align-items:center;justify-content:center;line-height:1!important}
