/**
 * COR single product page — data blocks rendered by the plugin shortcodes.
 * Loaded only on singular cor_product (see cor_enqueue_frontend_assets).
 *
 * Layout and section spacing are Elementor's job (the single template).
 * Type and colour here follow the Elementor globals so Site Settings edits
 * flow through: Eyebrow cd11b38 · Small Label 3wl86pk · Body Copy 1379a02 ·
 * Subheading c0aac55 · Small Header 9c2291f · Text Link ad3ac6f.
 */

.cor-pp-crumb, .cor-pp-details, .cor-pp-accordions, .cor-gallery, .cor-pp-resources, .cor-pp-dims, a.pdp-brand-link {
    --cor-ink:      var(--e-global-color-text, #2D2926);
    --cor-midnight: var(--e-global-color-primary, #1A4348);
    --cor-agave:    var(--e-global-color-secondary, #259596);
    --cor-meta:     var(--e-global-color-3dd68a6, #888B8D);
    --cor-tint:     var(--e-global-color-bc28358, #F5F5F4);
    --cor-line:     #D9D9D6;
    --cor-sans:     var(--e-global-typography-1379a02-font-family, "Circular"), "CircularXX", sans-serif;
    --cor-serif:    var(--e-global-typography-9c2291f-font-family, "utile-display"), "Utile Display", serif;
    box-sizing: border-box;
}
.cor-pp-crumb *, .cor-pp-details *, .cor-pp-accordions *, .cor-gallery *, .cor-pp-resources *, .cor-pp-dims * { box-sizing: border-box; }

/* ---------- Breadcrumb ---------- */
.cor-pp-crumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0 10px; }
.cor-pp-crumb li { display: flex; align-items: center; gap: 0 10px; font: 400 16px/1.5 var(--cor-sans); color: var(--cor-meta); }
.cor-pp-crumb li + li::before { content: "\203A"; color: var(--cor-meta); font-size: 18px; line-height: 1; }
.cor-pp-crumb a { color: var(--cor-meta); text-decoration: none; transition: color .25s ease; }
.cor-pp-crumb a:hover { color: var(--cor-agave); }
.cor-pp-crumb li:last-child a { color: var(--cor-midnight); }

/* ---------- Brand eyebrow ([cor_product_brand]) ---------- */
a.pdp-brand-link {
    display: inline-block; margin: 0; padding: 0; background: transparent; box-shadow: none;
    font-family: var(--e-global-typography-cd11b38-font-family, "Circular"), sans-serif;
    font-size: var(--e-global-typography-cd11b38-font-size, 18px);
    font-weight: var(--e-global-typography-cd11b38-font-weight, 700);
    line-height: var(--e-global-typography-cd11b38-line-height, 1.22em);
    letter-spacing: var(--e-global-typography-cd11b38-letter-spacing, 2px);
    text-transform: var(--e-global-typography-cd11b38-text-transform, uppercase);
    color: var(--cor-agave);
    text-decoration: none;
    transition: color .25s ease;
}
a.pdp-brand-link:hover, a.pdp-brand-link:focus-visible { color: var(--cor-midnight); }
a.pdp-brand-link:visited { color: var(--cor-agave); }

/* ---------- Gallery ---------- */
.cor-gallery { width: 100%; }
.cor-gallery__main {
    position: relative; width: 100%; aspect-ratio: 1 / 1; min-height: 240px;
    background: #fff; border-radius: 10px; overflow: hidden;
}
.cor-gallery__zoom { position: absolute; inset: 0; display: block; cursor: zoom-in; }
.cor-gallery .cor-gallery__main img { display: block; width: 100% !important; height: 100% !important; max-width: none; max-height: none; object-fit: contain; object-position: center; margin: 0; border-radius: 0; }
.cor-gallery__video { position: absolute; inset: 0; cursor: pointer; background: #fff; }
.cor-gallery__video img { object-fit: cover; }
/* Wistia is 16:9 — centre it in the square instead of filling the box */
.cor-gallery__video iframe { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; background: #fff; }
.cor-gallery__play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); line-height: 0; pointer-events: none; }
.cor-gallery__play svg { width: 72px; height: 72px; filter: drop-shadow(0 4px 12px rgba(0, 0, 0, .25)); }
.cor-gallery__play--small svg { width: 28px; height: 28px; }

.cor-gallery__strip {
    display: flex; gap: 12px; margin-top: 16px; padding: 2px;
    max-width: 100%;
    overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity;
    scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch;
}
.cor-gallery__strip::-webkit-scrollbar { display: none; }
.cor-gallery button.cor-gallery__thumb {
    position: relative; flex: 0 0 auto; width: 92px; height: 92px; min-height: 0; padding: 0 !important; margin: 0;
    background: #fff !important; border: 2px solid transparent !important; border-radius: 8px !important; overflow: hidden;
    box-shadow: none !important; color: inherit; line-height: 0;
    cursor: pointer; scroll-snap-align: start; appearance: none; -webkit-appearance: none;
    transition: border-color .2s ease;
}
.cor-gallery__thumb img { display: block; width: 100%; height: 100%; object-fit: contain; }
.cor-gallery__thumb--video img { object-fit: cover; }
.cor-gallery button.cor-gallery__thumb:hover { border-color: var(--cor-line) !important; background: #fff !important; }
.cor-gallery button.cor-gallery__thumb.is-active { border-color: var(--cor-midnight) !important; }
.cor-gallery button.cor-gallery__thumb:focus-visible { outline: 2px solid var(--cor-agave); outline-offset: 2px; }

.cor-gallery__bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 20px; }
.cor-gallery__nav { display: flex; align-items: center; gap: 27px; }
.cor-gallery button.cor-gallery__arrow {
    display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; min-height: 0;
    padding: 0 !important; margin: 0; background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
    color: var(--cor-agave); cursor: pointer; line-height: 0; transition: color .25s ease, transform .35s cubic-bezier(.22, 1, .36, 1);
}
.cor-gallery button.cor-gallery__arrow svg { width: 36px; height: 35px; display: block; }
.cor-gallery button.cor-gallery__arrow:hover { color: var(--cor-midnight); background: none !important; }
.cor-gallery button.cor-gallery__arrow--next:hover { transform: translateX(4px); }
.cor-gallery button.cor-gallery__arrow--prev:hover { transform: translateX(-4px); }
.cor-gallery button.cor-gallery__arrow:focus-visible { outline: 2px solid var(--cor-agave); outline-offset: 2px; }
.cor-gallery button.cor-gallery__all {
    display: inline-block; margin-top: 0; padding: 0 !important; background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; min-height: 0; cursor: pointer;
    font-family: var(--e-global-typography-ad3ac6f-font-family, "Circular"), sans-serif;
    font-size: var(--e-global-typography-ad3ac6f-font-size, 18px);
    font-weight: var(--e-global-typography-ad3ac6f-font-weight, 700);
    line-height: var(--e-global-typography-ad3ac6f-line-height, 24px);
    letter-spacing: .1em; text-transform: uppercase; text-decoration: underline; text-underline-offset: 4px;
    color: var(--cor-midnight) !important; transition: color .25s ease;
}
.cor-gallery button.cor-gallery__all:hover { color: var(--cor-agave) !important; background: none !important; }
.cor-gallery__lb { display: none; }

/* Thumbs placed in their own container (part="thumbs"): no top margin, the
   container's own spacing rules. */
.cor-gallery--thumbs .cor-gallery__strip { margin-top: 0; }
.cor-gallery--thumbs { min-width: 0; }

/* ---------- Details list ---------- */
.cor-pp-details { margin: 0; padding: 0; border-top: 1px solid var(--cor-line); }
.cor-pp-details__row {
    display: grid; grid-template-columns: minmax(120px, 34%) 1fr; gap: 0 20px; align-items: baseline;
    padding: 18px 0; border-bottom: 1px solid var(--cor-line);
}
.cor-pp-details dt {
    margin: 0;
    font-family: var(--e-global-typography-3wl86pk-font-family, "Circular"), sans-serif;
    font-size: var(--e-global-typography-3wl86pk-font-size, 16px);
    font-weight: var(--e-global-typography-3wl86pk-font-weight, 700);
    line-height: var(--e-global-typography-3wl86pk-line-height, 1.25em);
    letter-spacing: var(--e-global-typography-3wl86pk-letter-spacing, 2px);
    text-transform: var(--e-global-typography-3wl86pk-text-transform, uppercase);
    color: var(--cor-midnight);
}
.cor-pp-details dd {
    margin: 0;
    font-family: var(--e-global-typography-1379a02-font-family, "Circular"), sans-serif;
    font-size: var(--e-global-typography-1379a02-font-size, 18px);
    font-weight: var(--e-global-typography-1379a02-font-weight, 400);
    line-height: 1.5; color: var(--cor-ink);
}
.cor-pp-details dd a { color: var(--cor-midnight); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; transition: color .25s ease; }
.cor-pp-details dd a:hover { color: var(--cor-agave); }

/* ---------- Accordions ---------- */
.cor-pp-accordions { border-top: 1px solid var(--cor-line); }
.cor-pp-acc { border-bottom: 1px solid var(--cor-line); }
.cor-pp-acc summary {
    display: flex; align-items: center; justify-content: space-between; gap: 20px;
    padding: 28px 0; cursor: pointer; list-style: none;
    font-family: var(--e-global-typography-9c2291f-font-family, "utile-display"), serif;
    font-size: var(--e-global-typography-9c2291f-font-size, 32px);
    font-weight: var(--e-global-typography-9c2291f-font-weight, 500);
    line-height: 1.1; color: var(--cor-midnight);
    transition: color .25s ease;
}
.cor-pp-acc summary::-webkit-details-marker { display: none; }
.cor-pp-acc summary:hover { color: var(--cor-agave); }
.cor-pp-acc summary:focus-visible { outline: 2px solid var(--cor-agave); outline-offset: 4px; }
.cor-pp-acc__icon { position: relative; flex: 0 0 auto; width: 24px; height: 24px; }
.cor-pp-acc__icon::before, .cor-pp-acc__icon::after {
    content: ""; position: absolute; left: 50%; top: 50%; background: currentColor; border-radius: 1px;
    transform: translate(-50%, -50%); transition: transform .25s ease;
}
.cor-pp-acc__icon::before { width: 24px; height: 2px; }
.cor-pp-acc__icon::after { width: 2px; height: 24px; }
.cor-pp-acc[open] .cor-pp-acc__icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.cor-pp-acc__body { padding: 0 0 40px; }
.cor-pp-sublabel {
    margin: 32px 0 12px;
    font-family: var(--e-global-typography-3wl86pk-font-family, "Circular"), sans-serif;
    font-size: var(--e-global-typography-3wl86pk-font-size, 16px);
    font-weight: 700; letter-spacing: 2px; text-transform: uppercase; line-height: 1.25;
    color: var(--cor-meta);
}

/* Resources list */
.cor-pp-resources { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 0 40px; }
.cor-pp-resources li { border-bottom: 1px solid var(--cor-line); }
.cor-pp-resources a {
    display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 14px 0;
    font-family: var(--e-global-typography-1379a02-font-family, "Circular"), sans-serif;
    font-size: var(--e-global-typography-1379a02-font-size, 18px);
    font-weight: 400; line-height: 1.4; color: var(--cor-ink); text-decoration: none;
    transition: color .25s ease;
}
.cor-pp-resources a:hover { color: var(--cor-agave); }
/* The site's standard arrow — Utile Display →, agave, nudges 10px on hover.
   Same shape as .cor-arrow-title; drawn here rather than carried as a
   character so it cannot fall back to the system font. */
.cor-pp-ext { flex: 0 0 auto; color: var(--cor-agave); font-style: normal; }
.cor-pp-ext::after {
    content: "\2192";
    font-family: utile-display, sans-serif;
    font-size: 21px;
    line-height: 1;
    display: inline-block;
    vertical-align: 2.5px;
    transition: transform .35s cubic-bezier(.22, 1, .36, 1);
}
.cor-pp-resources a:hover .cor-pp-ext::after { transform: translateX(10px); }

/* Dimension drawings */
.cor-pp-dims { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 24px; }
.cor-pp-dims__item { margin: 0; }
.cor-pp-dims__item a { display: block; background: #fff; border-radius: 10px; padding: 20px; cursor: zoom-in; }
.cor-pp-dims__item img { display: block; width: 100%; height: auto; }
.cor-pp-dims__item figcaption {
    margin-top: 12px; font: 400 16px/1.4 var(--cor-sans); color: var(--cor-meta);
}

/* Jump links */
.cor-pp-jump { white-space: nowrap; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
    /* In the stacked (column) layout Chrome sizes a flex item whose only
       content is an aspect-ratio box at 0, so give the box a real height. */
    .cor-gallery__main { aspect-ratio: auto; height: min(calc(100vw - 150px), 700px); }
    .cor-pp-acc summary { padding: 22px 0; }
    .cor-gallery button.cor-gallery__thumb { width: 80px; height: 80px; }
}
@media (max-width: 767px) {
    .cor-gallery__main { height: calc(100vw - 60px); }
    .cor-pp-crumb li { font-size: 14px; }
    .cor-pp-details__row { grid-template-columns: 1fr; gap: 4px 0; padding: 14px 0; }
    .cor-gallery button.cor-gallery__thumb { width: 64px; height: 64px; border-radius: 6px !important; }
    .cor-gallery__strip { gap: 8px; margin-top: 12px; }
    .cor-gallery__play svg { width: 56px; height: 56px; }
    .cor-pp-acc summary { padding: 18px 0; }
    .cor-pp-acc__body { padding-bottom: 28px; }
    .cor-pp-resources { grid-template-columns: 1fr; }
    .cor-pp-dims { grid-template-columns: 1fr 1fr; gap: 12px; }
    .cor-pp-dims__item a { padding: 10px; }
}
@media (prefers-reduced-motion: reduce) {
    .cor-pp-crumb a, a.pdp-brand-link, .cor-gallery__thumb, .cor-gallery__all, .cor-pp-details dd a, .cor-pp-acc summary, .cor-pp-acc__icon::before, .cor-pp-acc__icon::after, .cor-pp-resources a, .cor-pp-ext::after { transition: none; }
}