/* Capsule catalog (products/index.html). Scoped to .cc-page; builds on design-v2.css and product-catalog.css. */
.cc-page [hidden]{display:none!important}
.cc-page main{--cc-rule:#c4d2cd;--cc-muted:#49636a;--cc-panel:#ffffff;--cc-cream:#f4f4ed;--cc-mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace}
.cc-kicker{font:600 10.5px/1.5 var(--cc-mono);letter-spacing:.08em;text-transform:uppercase;color:#526870}

/* hero with search */
.cc-page .cc-hero{padding:34px 0 44px}
.cc-hero .wrap{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:56px;align-items:start}
.cc-hero__copy>.eyebrow{display:block;margin-bottom:18px}
.cc-page .cc-hero h1{font-size:clamp(36px,4vw,56px);line-height:1.05;margin-bottom:18px}
.cc-hero h1 span{color:#0879a9}
.cc-hero__copy>p{max-width:640px;font-size:16px;line-height:1.75}
.cc-legend{margin:62px 0 0;background:var(--cc-panel);border:1px solid var(--cc-rule);border-radius:6px;padding:20px 22px;display:grid;gap:14px}
.cc-legend div{display:grid;grid-template-columns:118px 1fr;gap:12px;align-items:baseline}
.cc-legend dt{margin:0}
.cc-legend dd{margin:0;font-size:13px;line-height:1.55;color:var(--cc-muted)}

.cc-search{background:var(--cc-panel);border:1px solid #9fb6bc;border-radius:8px;padding:18px 20px;margin:26px 0 0;box-shadow:0 10px 30px #102c360d}
.cc-search label{display:block;font:600 11px/1.5 var(--cc-mono);letter-spacing:.08em;text-transform:uppercase;color:#526870;margin-bottom:8px}
.cc-search__row{display:flex;gap:10px}
.cc-search input{flex:1;min-width:0;min-height:52px;border:1px solid #6f8d95;border-radius:4px;padding:10px 14px;font:inherit;font-size:17px;background:#fcfcf8;color:var(--dark)}
.cc-search input:focus-visible{outline:3px solid #148fc4;outline-offset:2px}
.cc-search__clear{min-height:52px;min-width:72px;border:1px solid var(--dark);background:transparent;border-radius:3px;font:inherit;font-size:14px;cursor:pointer;color:var(--dark)}
.cc-search__hint{margin:8px 0 0;font-size:12.5px;color:var(--cc-muted)}
.cc-count{margin:6px 0 0;font-size:13px;font-weight:600}
.cc-count:empty{display:none}
.cc-results{margin-top:10px;border-top:1px solid var(--cc-rule);padding-top:8px;max-height:420px;overflow:auto}
.cc-results__head{margin:8px 0 4px;font:600 10.5px/1.5 var(--cc-mono);letter-spacing:.08em;text-transform:uppercase;color:#526870}
.cc-results__list{list-style:none;margin:0;padding:0}
.cc-results__link{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 12px;min-height:44px;padding:9px 10px;border-radius:4px;text-decoration:none;color:var(--dark)}
.cc-results__link:hover,.cc-results__link:focus-visible{background:#e8f2f4;color:var(--dark)}
.cc-results__name{font-weight:600;font-size:14.5px}
.cc-results__meta{font-size:12.5px;color:var(--cc-muted)}
.cc-results__more{font-size:12.5px;color:var(--cc-muted);margin:6px 10px}
.cc-results__empty{padding:8px 4px}
.cc-results__empty p{margin:0 0 12px;font-size:14px}

/* status badges */
.cc-status{display:inline-flex;align-items:center;gap:6px;font:600 10.5px/1.4 var(--cc-mono);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;padding:4px 9px;border-radius:999px;border:1px solid currentColor}
.cc-status::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.cc-status--made{color:#0b6b4f;background:#e6f3ec}
.cc-status--can{color:#0a6488;background:#e3f1f7}
.cc-status--request{color:#6b5310;background:#f7f0dc}
.cc-status--sold{color:#454a5e;background:#ebecf2}
.cc-status--sm{font-size:9.5px;padding:2px 7px}

/* tab bar */
.cc-tabbar{position:sticky;top:var(--nav-occupied-height,0px);transition:top .2s;z-index:20;background:#fcfcf8;border-top:1px solid var(--cc-rule);border-bottom:1px solid var(--cc-rule)}
.cc-tabs{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.cc-tabs::-webkit-scrollbar{display:none}
.cc-tabs ul{display:flex;gap:6px;list-style:none;margin:0;padding:8px 0;min-width:max-content}
.cc-tab{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border-radius:999px;border:1px solid transparent;font-size:14px;font-weight:600;color:var(--dark);text-decoration:none;white-space:nowrap}
.cc-tab:hover{background:#eef3f1;color:var(--dark)}
.cc-tab[aria-current="true"]{background:var(--dark);color:#fff}
.cc-tab__count{font:600 11px/1 var(--cc-mono);opacity:.75}
.cc-page .cc-panel{padding:56px 0 72px;scroll-margin-top:calc(var(--nav-occupied-height,0px) + 70px)}
.cc-cat,.cc-type,.cc-card,.cc-az__group{scroll-margin-top:calc(var(--nav-occupied-height,0px) + 84px)!important}

/* By category */
.cc-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:36px;align-items:start}
.cc-nav{position:sticky;top:calc(var(--nav-occupied-height,0px) + 84px);max-height:calc(100vh - 110px - var(--nav-occupied-height,0px));overflow:auto;background:var(--cc-panel);border:1px solid var(--cc-rule);border-radius:6px;padding:14px 10px}
.cc-nav__title{font:600 10.5px/1.5 var(--cc-mono);letter-spacing:.08em;text-transform:uppercase;color:#526870;margin:0 10px 8px}
.cc-nav__list{list-style:none;margin:0;padding:0}
.cc-nav__item{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;padding:6px 12px;border-radius:4px;font-size:14px;font-weight:500;color:var(--dark);text-decoration:none}
.cc-nav__item:hover{background:#eef3f1;color:var(--dark)}
.cc-nav__item[aria-current="true"]{background:var(--dark);color:#fff}
.cc-nav__count{font:600 11px/1 var(--cc-mono);opacity:.7}
.cc-tree{min-width:0;display:grid;gap:34px}
.cc-cat{scroll-margin-top:140px}
.cc-cat__head{display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--cc-rule);padding-bottom:12px;margin-bottom:14px}
.cc-cat__title p{margin:4px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.cc-cat__count{font-size:13px;color:var(--cc-muted)}
.cc-page .cc-cat__head h3{margin:0;font-size:26px}
.cc-types{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.cc-type{background:var(--cc-panel);border:1px solid var(--cc-rule);border-radius:6px;min-width:0;scroll-margin-top:140px}
.cc-type>summary{list-style:none;cursor:pointer;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:14px 44px 14px 18px;min-height:44px;position:relative}
.cc-type>summary::-webkit-details-marker{display:none}
.cc-type>summary::after{content:"+";position:absolute;right:16px;top:12px;font:400 22px/1 var(--font-h);color:#0879a9}
.cc-type[open]>summary::after{content:"\2212"}
.cc-type>summary:focus-visible{outline:3px solid #148fc4;outline-offset:2px;border-radius:6px}
.cc-type[open]{border-color:#7fa6b0;box-shadow:0 8px 24px #102c3612}
.cc-type__name{font-weight:600;font-size:16px;line-height:1.3;margin-right:auto}
.cc-type__rf{font:600 9.5px/1.4 var(--cc-mono);letter-spacing:.06em;text-transform:uppercase;color:#7a3e00;background:#fbeedd;border-radius:999px;padding:2px 7px}
.cc-type__brief{flex-basis:100%;font-size:12.5px;color:var(--cc-muted)}
.cc-type__body{padding:2px 18px 18px;border-top:1px dashed var(--cc-rule)}
.cc-type__what{margin:12px 0;font-size:14px}
.cc-type__facts{margin:0;display:grid;gap:8px}
.cc-type__facts div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:10px;font-size:13.5px}
.cc-type__facts dt{font:600 10px/1.9 var(--cc-mono);letter-spacing:.08em;text-transform:uppercase;color:#526870}
.cc-type__facts dd{margin:0}
.cc-type__facts a{font-weight:600}
.cc-variants{list-style:none;margin:12px 0 0;padding:0;border-top:1px dashed var(--cc-rule)}
.cc-variant{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:8px 0;border-bottom:1px dashed var(--cc-rule);font-size:14px}
.cc-variant:last-child{border-bottom:0}
.cc-variant__name{font-weight:500;margin-right:auto}
.cc-variant__typical{flex-basis:100%;font-size:12px;color:var(--cc-muted)}
.cc-variant__rf,.cc-variant__studio{display:inline-flex;align-items:center;min-height:44px;font-size:12px;font-weight:600}
.cc-variant__rf+.cc-variant__studio{margin-left:6px}
.cc-type__cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.cc-page .cc-type__cta .btn,.cc-page .cc-card__cta .btn{min-height:44px;padding:11px 16px}

/* ready formula card header: typographic, no jar mockup or logo placeholder (David 27 Oct 2026) */
.cc-card__head{display:grid;gap:10px;margin:-24px -26px 0;padding:20px 26px 18px;background:linear-gradient(180deg,#eef3f1,#e3ecec);border-bottom:1px solid var(--cc-rule);border-radius:8px 8px 0 0;min-width:0}
.cc-page .cc-card .cc-card__head h4{font-size:24px;line-height:1.18;letter-spacing:-.01em;color:#102c36;overflow-wrap:anywhere}
.cc-card__head .cc-card__desc{color:#3d555c}
.cc-card__keys{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 0;padding:0;list-style:none}
.cc-card__keys li{margin:0;padding:4px 10px;border:1px solid #c4d2cd;border-radius:999px;background:#fff;font:600 11px/1.4 var(--cc-mono);letter-spacing:.04em;color:#102c36;white-space:nowrap}

/* ready formula cards */
.cc-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start}
.cc-card{background:var(--cc-panel);border:1px solid var(--cc-rule);border-radius:8px;padding:24px 26px;min-width:0;scroll-margin-top:140px;display:flex;flex-direction:column;gap:14px;overflow:hidden}
.cc-card:target{outline:3px solid #148fc4;outline-offset:3px}
.cc-card__path{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin:0}
.cc-card__path a{color:inherit}
.cc-page .cc-card h3{margin:0;font-size:22px}
.cc-card__desc{margin:0;color:var(--cc-muted);font-size:14px}
.cc-page .tw.cc-card__table{margin:0;overflow-x:auto;border:0;box-shadow:none;background:transparent}
.cc-page .cc-table{width:100%;min-width:0;border-collapse:collapse;font-size:14px;background:transparent}
.cc-table caption{text-align:left;font:600 10.5px/1.5 var(--cc-mono);letter-spacing:.08em;text-transform:uppercase;color:#526870;padding-bottom:6px}
.cc-page .cc-table th,.cc-page .cc-table td{padding:7px 8px;border-bottom:1px solid #e1e8e5;text-align:left;vertical-align:top}
.cc-page .cc-table thead th{background:var(--cc-cream);color:var(--cc-muted);font-size:10.5px;letter-spacing:.08em}
.cc-page .cc-table tbody th{font-weight:500}
.cc-page .cc-table tbody tr:nth-child(even) td{background:transparent}
.cc-page .cc-table tbody tr:last-child th,.cc-page .cc-table tbody tr:last-child td{border-bottom:1px solid #e1e8e5}
.cc-page .cc-table td:nth-child(2),.cc-page .cc-table td:nth-child(3),.cc-page .cc-table thead th:nth-child(2),.cc-page .cc-table thead th:nth-child(3){text-align:right;white-space:nowrap}
.cc-card__sources{margin:0;font-size:12.5px;color:var(--cc-muted)}
.cc-card__sources .cc-kicker{margin-right:6px}
.cc-spec{margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;border-top:1px solid var(--cc-rule);padding-top:12px}
.cc-spec dt{font:600 10px/1.5 var(--cc-mono);letter-spacing:.08em;text-transform:uppercase;color:#526870}
.cc-spec dd{margin:2px 0 0;font-size:13px;line-height:1.45}
.cc-card__cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto}
.cc-notes{margin-top:32px;display:grid;grid-template-columns:1fr 1fr;gap:24px;font-size:13px;color:var(--cc-muted)}
.cc-notes p{margin:0}

/* Ingredients A to Z */
.cc-az__letters ul{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 24px;padding:0}
.cc-az__letters a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:1px solid var(--cc-rule);border-radius:4px;background:#fff;font-weight:600;text-decoration:none;color:var(--dark)}
.cc-az__letters a:hover{border-color:var(--dark)}
/* two columns of letter groups in a grid (not CSS columns): opening one row moves only what is below it */
.cc-az{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,380px),1fr));column-gap:40px;align-items:start}
.cc-az__group{margin-bottom:22px;scroll-margin-top:140px}
.cc-page .cc-az__group h3{font-size:22px;margin:0 0 6px;border-bottom:1px solid var(--cc-rule);padding-bottom:4px}
.cc-az__group ul{list-style:none;margin:0;padding:0}
.cc-az__group>ul>li{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr);gap:10px;align-items:baseline;padding:6px 0;border-bottom:1px dashed #dde6e3;font-size:13.5px}
.cc-az__name{font-weight:600}
.cc-az__name a{color:#0f5f80}
.cc-az__more>summary{display:inline-flex;align-items:center;gap:6px;min-height:24px;cursor:pointer;list-style:none;color:#0f5f80;font-size:13px}
.cc-az__more>summary::-webkit-details-marker{display:none}
.cc-az__more>summary::after{content:"+";font-weight:600;line-height:1}
.cc-az__more[open]>summary::after{content:"\2212"}
.cc-az__more>summary:hover{text-decoration:underline}
.cc-az__more>summary:focus-visible{outline:3px solid #148fc4;outline-offset:2px;border-radius:4px}
.cc-az__types{margin:4px 0 2px!important}
.cc-az__types li{padding:2px 0}
.cc-az__types a{color:#0f5f80}

/* Most made */
.cc-most{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px}
.cc-most li{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;background:#fff;border:1px solid var(--cc-rule);border-radius:6px;padding:12px 16px;min-height:44px}
.cc-most__rank{font:600 20px/1 var(--cc-mono);color:#0879a9;min-width:34px}
.cc-most li>a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;font-size:15.5px;margin-right:auto}
.cc-most__cat{flex-basis:100%;order:3;font-size:12.5px;color:var(--cc-muted);padding-left:46px}

@media (max-width:1000px){
  .cc-types,.cc-cards,.cc-most{grid-template-columns:minmax(0,1fr)}
  .cc-hero .wrap{grid-template-columns:minmax(0,1fr);gap:24px}
  .cc-legend{margin-top:0}
}
@media (max-width:860px){
  .cc-layout{grid-template-columns:minmax(0,1fr);gap:16px}
  .cc-nav{position:static;max-height:none;overflow:visible;padding:0;border:0;border-radius:0;background:transparent}
  .cc-nav__title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .cc-nav__list{display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin;padding:2px 2px 10px;-webkit-overflow-scrolling:touch}
  .cc-nav__item{white-space:nowrap;border:1px solid #8aa3aa;border-radius:999px;padding:6px 14px;font-size:13px;background:#fff}
  .cc-nav__item[aria-current="true"]{border-color:var(--dark)}
  .cc-notes{grid-template-columns:minmax(0,1fr)}
  .cc-type__facts div{grid-template-columns:minmax(0,1fr);gap:0}
}
@media (max-width:560px){
  .cc-page .cc-hero{padding-top:22px}
  .cc-search{padding:14px}
  .cc-search__row{flex-wrap:wrap}
  .cc-search__clear{min-height:44px}
  .cc-card{padding:18px 16px}
  .cc-card__head{margin:-18px -16px 0;padding:18px 16px 16px}
  .cc-page .cc-card .cc-card__head h4{font-size:21px}
  .cc-spec{grid-template-columns:minmax(0,1fr)}
  .cc-legend div{grid-template-columns:minmax(0,1fr);gap:4px}
  .cc-page .cc-cat__head h3{font-size:22px}
  .cc-az__group>ul>li{grid-template-columns:minmax(0,1fr);gap:2px}
}

/* What is inside: label-style facts panel of a ready formula (export_site.py facts_html, same markup in the Studio) */
.cc-page .sf{margin:4px 0 0;display:grid;gap:8px;min-width:0;text-align:left}
.cc-page .sf__title{margin:0;font-weight:600;font-size:15px;line-height:1.4;color:#102c36}
.cc-page .sf__label{background:#fff;border:1px solid #102c36;border-radius:4px;padding:12px 14px 10px;color:#102c36;min-width:0}
.cc-page .sf__head{margin:0 0 6px;padding:0 0 6px;border-bottom:1px solid #102c36;font-family:"Ubuntu","Trebuchet MS","Segoe UI",Arial,sans-serif;font-weight:700;font-size:20px;line-height:1.15;letter-spacing:-.01em;color:#102c36}
.cc-page .sf__serving{margin:0 0 8px;display:grid;gap:2px;font-size:13.5px;line-height:1.45}
.cc-page .sf__serving div{display:flex;flex-wrap:wrap;gap:0 6px}
.cc-page .sf__serving dt{margin:0;font-weight:600;font-family:inherit;font-size:inherit;letter-spacing:normal;text-transform:none;color:#102c36}
.cc-page .sf__serving dt::after{content:":"}
.cc-page .sf__serving dd{margin:0}
.cc-page .sf__table{width:100%;min-width:0;margin:0;border-collapse:collapse;font-size:13.5px;line-height:1.4;background:transparent;font-family:inherit}
.cc-page .sf__table caption{caption-side:top;text-align:left;padding:6px 0 4px;border-top:1px solid #102c36;font-weight:600;font-size:12.5px;line-height:1.4;font-family:inherit;letter-spacing:normal;text-transform:none;color:#102c36}
.cc-page .sf__table th,.cc-page .sf__table td{padding:5px 6px;border:0;border-bottom:1px solid #c4d2cd;vertical-align:top;text-align:left;background:transparent;color:#102c36;font-family:inherit;letter-spacing:normal;text-transform:none}
.cc-page .sf__table th:first-child,.cc-page .sf__table td:first-child{padding-left:0}
.cc-page .sf__table th:last-child,.cc-page .sf__table td:last-child{padding-right:0}
.cc-page .sf__table thead th{font-size:12px;font-weight:600;border-bottom:1px solid #102c36}
.cc-page .sf__table tbody th{font-weight:400;overflow-wrap:anywhere}
.cc-page .sf__table td,.cc-page .sf__table thead th + th{text-align:right;white-space:nowrap}
.cc-page .sf__table tbody tr:last-child > *{border-bottom:1px solid #102c36}
.cc-page .sf__other{margin:8px 0 4px;font-size:13px;line-height:1.45;color:#102c36}
.cc-page .sf__legend{margin:0;font-size:12px;line-height:1.45;color:#4b6067}
.cc-page .sf__notes{margin:0;padding:0 0 0 18px;font-size:13px;line-height:1.45;color:#102c36}
.cc-page .sf__notes li{margin:0 0 2px}
.cc-page .sf__check{margin:0;font-size:12px;line-height:1.45;color:#4b6067}
.cc-cards__cat{margin:30px 0 12px;font-size:20px}
.cc-cards__cat:first-of-type{margin-top:6px}
.cc-cards__count{font:600 12px/1 var(--cc-mono);color:#526870;margin-left:6px}
.cc-page .cc-card h4{margin:0;font-size:22px;line-height:1.2}
.cc-rf{margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--cc-rule);display:grid;gap:8px;min-width:0}
.cc-rf__kicker{margin:0;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.cc-page .cc-rf__name{margin:0;font-size:18px;line-height:1.25}
.cc-rf__spec{margin:0;font-size:13.5px;color:var(--cc-muted)}
.cc-rf__cta{display:flex;flex-wrap:wrap;gap:10px}
.cc-page .cc-rf__cta .btn{min-height:44px;padding:11px 16px}