/*
 * Curious Octopus: shop pages (the Shop and product categories).
 * Builds on the cw-* components in homepage.css and uses its --cw-* colors and fonts.
 */

/* Shop sections use the full width for grids and the pricing ladder. */
.wp-block-group.cw-band > .cw-shop-wide{max-width:72rem;margin-top:2rem!important}
.cw-shop .cw-band h1{font-family:var(--cw-display);font-weight:400;font-size:clamp(2rem,4.5vw,3rem);line-height:1.08;letter-spacing:-.02em;text-wrap:balance}

/* ===== Hero ===== */
.wp-block-group.cw-shop-hero{gap:1rem;padding-top:clamp(3.5rem,7vw,6rem)!important;padding-bottom:clamp(2.2rem,4vw,3rem)!important}
.cw-shop .cw-shop-hero h1{font-size:clamp(2.8rem,7vw,4.8rem);line-height:.98;letter-spacing:-.03em;color:var(--cw-cream)}
.cw-shop-hero .cw-eyebrow{color:var(--cw-terra-light)}
.cw-shop-hero .cw-lede{max-width:36rem;color:#EFE3CE}

/* Jump links to each section. */
.cw-shop-nav{margin-top:.8rem!important}
.cw-shop-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.cw-shop-nav a{display:inline-block;padding:.4em 1em;border:1px solid rgba(246,239,223,.35);border-radius:2em;color:var(--cw-cream);text-decoration:none;font-size:.88rem;font-weight:600;line-height:1.3;transition:background-color .15s,color .15s}
.cw-shop-nav a:hover{background:var(--cw-cream);color:var(--cw-navy)}
@media (max-width:640px){
 .cw-shop-nav ul{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:.2rem}
 .cw-shop-nav li{flex:none}
}
.cw-shop [id]{scroll-margin-top:1rem}

/* ===== Start here ===== */
.cw-shop-price{font-size:1.15rem!important;font-weight:700}
.cw-shop-price del{opacity:.55;font-weight:400;margin-right:.35em}
.cw-shop-price ins{text-decoration:none}
.wp-block-group.cw-choice.is-featured{background:var(--cw-navy);border-color:var(--cw-navy);color:var(--cw-cream)}
.cw-choice.is-featured h3{color:var(--cw-cream)}
.cw-choice.is-featured .cw-eyebrow{color:var(--cw-terra-light)}

/* ===== The ladder: one circle per week; filled circles are the weeks you pay for ===== */
.cw-ladder{display:flex;flex-direction:column;border-top:1px solid var(--cw-rule)}
.cw-ladder-row{display:grid;grid-template-columns:minmax(8rem,12rem) 1fr minmax(10rem,14rem);align-items:center;gap:1.5rem;padding:1.5rem .5rem;border-bottom:1px solid var(--cw-rule);color:inherit;text-decoration:none;transition:background-color .2s}
.cw-ladder-row:hover{background:rgba(255,253,247,.55)}
.cw-ladder-name{font-family:var(--cw-display);font-size:clamp(1.15rem,2vw,1.5rem);line-height:1.15}
.cw-dots{display:flex;flex-wrap:wrap;gap:.5rem}
.cw-dot{--size:clamp(1.35rem,2.5vw,2.1rem);width:var(--size);height:var(--size);border-radius:50%;border:2px solid var(--cw-navy);background:linear-gradient(90deg,var(--cw-terra) var(--fill),transparent var(--fill))}
.cw-ladder-price{display:flex;flex-direction:column;gap:.15rem;font-size:.9rem;line-height:1.35}
.cw-ladder-price strong{font-size:1.4rem;font-weight:700}
@media (max-width:760px){
 .cw-ladder-row{grid-template-columns:1fr;gap:.8rem}
 .cw-dots{gap:.35rem}
 .cw-dot{--size:min(1.6rem,calc((100vw - 4.5rem) / 10 - .35rem))}  /* ten weeks on one line */
}

/* ===== Product grids ===== */
.cw-shop-grid .wc-block-product-template{gap:2rem 1.25rem}
.cw-shop-grid .wc-block-product{display:flex;flex-direction:column;gap:.45rem;text-align:left}
.cw-shop-grid .wc-block-product > *{margin:0!important}
.cw-shop-grid .wc-block-components-product-image{border-radius:2px;overflow:hidden;background:rgba(35,49,95,.07)}
.cw-shop-grid .wc-block-components-product-image img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.cw-shop-grid .wp-block-post-title{font-family:var(--cw-display);font-size:1.05rem!important;font-weight:400;line-height:1.25;text-align:left}
.cw-shop-grid .wp-block-post-title a{color:inherit;text-decoration:none}
.cw-shop-grid .wp-block-post-title a:hover{text-decoration:underline;text-underline-offset:.15em}
.cw-shop-grid .wc-block-components-product-price{font-size:.98rem;font-weight:700;text-align:left}
.cw-shop-grid .wc-block-components-product-price del{opacity:.55;font-weight:400}
.cw-shop-grid .wc-block-components-product-price ins{text-decoration:none}
.cw-shop-grid .wc-block-components-product-button{margin-top:auto!important;align-items:flex-start;justify-content:flex-start;padding-top:.35rem}
.cw-shop-grid .wc-block-components-product-button .wp-block-button__link{background:transparent;color:var(--cw-ink);border:1px solid var(--cw-rule);border-radius:2em;padding:.5em 1.15em;font-family:var(--cw-body);font-size:.88rem;font-weight:600;line-height:1.3;transition:background-color .15s,color .15s,border-color .15s}
.cw-shop-grid .wc-block-components-product-button .wp-block-button__link:hover{background:var(--cw-terra);border-color:var(--cw-terra);color:#fff}
.cw-shop-grid .wc-block-components-product-sale-badge{background:var(--cw-terra);color:#fff;border:0;border-radius:2em;padding:.3em .75em;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}

/* ===== Footnotes ===== */
.wp-block-group.cw-shop-footnotes{padding-top:clamp(2rem,4vw,3rem)!important}
.cw-shop-footnotes .cw-incl{margin-top:0!important}
.cw-shop-footnotes h3{margin-bottom:.4rem!important}

@media (prefers-reduced-motion:reduce){
 .cw-ladder-row,.cw-shop-nav a,.cw-shop-grid .wp-block-button__link{transition:none}
}

/* "Family License" label next to prices; "See all" links under shortened grids. */
.cw-price-note{display:block;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;opacity:.6;margin-top:.15rem}
.wp-block-group.cw-band > p.cw-shop-more{margin-top:1.4rem!important;font-weight:600}
.cw-shop-more a{color:var(--cw-terra);text-decoration:none;border-bottom:1px solid currentColor}
