/*
 * Content pages and the blog (css/pages.css).
 *
 * Part 1: the shop's own sections (cp-svc-*, cp-closure, cp-contact, cp-suppliers, cp-faq, cp-brands, cp-birthday,
 *         cp-affiliate, cp-blog, cp-article-more), ported with their values unchanged. Sizes are in px, as written.
 * Part 2: the page frame and the parts the live shop takes from its base theme (fold-out questions, collection row,
 *         form beside a picture, plain pages, policies, the article), re-created by look for this theme.
 */

/* ===== snippets/cp-svc-base.liquid (the shop's own section, ported) ===== */
.cp-svc { --ink: #16202B; --txt: #2B333D; --mut: #6B7280; --navy: #003662; --navy-h: #002849; --mist: #F7F8FA; --tile: #EEF2F6; --line: #E6E9EE; --gold: #C49430;
  color: var(--txt); font-size: 16px; line-height: 1.6; padding: 64px 0; background: #fff; }
.cp-svc--mist { background: var(--mist); }
.cp-svc--flush-top { padding-top: 0; }
.cp-svc *, .cp-svc *::before, .cp-svc *::after { box-sizing: border-box; }
.cp-svc p { margin: 0; }
.cp-svc__head { max-width: 720px; margin: 0 0 32px; }
.cp-svc__eyebrow { font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--navy); margin: 0 0 10px; }
.cp-svc__h2 { font-size: 34px; line-height: 1.18; letter-spacing: -.01em; color: var(--ink); margin: 0; font-weight: 400; text-transform: none; }
.cp-svc__lede { font-size: 17px; color: var(--mut); margin: 12px 0 0 !important; }
.cp-svc-ic { width: 24px; height: 24px; flex: 0 0 auto; display: block; }
.cp-svc__btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 12px; font-size: 15px; font-weight: 600; line-height: 1.2; text-decoration: none; white-space: nowrap; border: 1.5px solid var(--cp-action, #D9480F); background: var(--cp-action, #D9480F); color: #fff; transition: background .15s, border-color .15s, color .15s; cursor: pointer; }
.cp-svc__btn:hover { background: var(--cp-action-hover, #BF3F0C); border-color: var(--cp-action-hover, #BF3F0C); color: #fff; }
.cp-svc__btn--ghost { background: #fff; color: var(--navy); border-color: #C9D3DE; }
.cp-svc__btn--ghost:hover { background: var(--tile); color: var(--navy); border-color: var(--navy); }
.cp-svc__btn:focus-visible, .cp-svc a:focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; }
.cp-svc__link { color: var(--navy); font-weight: 600; font-size: 15px; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.cp-svc__link:hover { text-decoration: underline; text-underline-offset: 3px; }
.cp-svc__link svg { width: 16px; height: 16px; transition: transform .15s; }
.cp-svc__link:hover svg { transform: translateX(3px); }
@media (max-width: 749px) {
  .cp-svc { padding: 40px 0; font-size: 15px; }
  .cp-svc--flush-top { padding-top: 0; }
  .cp-svc__head { margin-bottom: 22px; }
  .cp-svc__h2 { font-size: 26px; }
  .cp-svc__btn { padding: 0 16px; font-size: 14.5px; }
  .cp-svc__lede { font-size: 15.5px; }
}
@media (prefers-reduced-motion: reduce) { .cp-svc * { transition: none !important; } }

/* ===== sections/cp-svc-hero.liquid (the shop's own section, ported) ===== */
.cp-svc-hero { padding: 40px 0 64px; }
.cp-svc-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; align-items: center; }
.cp-svc-hero__h1 { font-size: 50px; line-height: 1.08; letter-spacing: -.02em; color: var(--ink); margin: 0; font-weight: 400; text-transform: none; }
.cp-svc-hero__h1--m { font-size: 42px; line-height: 1.12; }
.cp-svc-hero__h1 span { color: var(--navy); display: block; }
.cp-svc-hero__lede { font-size: 18px; line-height: 1.55; color: var(--txt); margin-top: 18px !important; max-width: 560px; }
.cp-svc-hero__facts { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 12px; }
.cp-svc-hero__facts li { display: flex; gap: 12px; align-items: flex-start; font-size: 15.5px; line-height: 1.45; color: var(--txt); }
.cp-svc-hero__facts .cp-svc-ic { color: var(--navy); width: 22px; height: 22px; margin-top: 1px; }
.cp-svc-hero__facts b { color: var(--ink); font-weight: 600; margin-right: 6px; }
.cp-svc-hero__btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.cp-svc-hero__rating { display: inline-flex; align-items: center; gap: 10px; margin-top: 22px; font-size: 14.5px; color: var(--mut); text-decoration: none; }
.cp-svc-hero__rating b { color: var(--ink); font-weight: 600; }
.cp-svc-hero__rating:hover span:last-child { text-decoration: underline; text-underline-offset: 3px; }
.cp-svc-hero__stars { color: var(--gold); letter-spacing: 2px; font-size: 16px; }
.cp-svc-hero__media { border-radius: 24px; overflow: hidden; background: var(--tile); aspect-ratio: 5 / 4; }
.cp-svc-hero__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 989px) {
  .cp-svc-hero { padding: 0 0 40px; }
  .cp-svc-hero__grid { grid-template-columns: 1fr; gap: 22px; }
  .cp-svc-hero__media { order: -1; aspect-ratio: 16 / 10; border-radius: 16px; }
  .cp-svc-hero__h1 { font-size: 33px; }
  .cp-svc-hero__h1--m { font-size: 29px; }
  .cp-svc-hero__lede { font-size: 16px; margin-top: 12px !important; }
  .cp-svc-hero__facts { margin-top: 18px; gap: 10px; }
  .cp-svc-hero__facts li { font-size: 14.5px; }
  .cp-svc-hero__btns { margin-top: 22px; }
  .cp-svc-hero__btns .cp-svc__btn { flex: 1 1 150px; }
  .cp-svc-hero__rating { margin-top: 18px; }
}

/* ===== sections/cp-svc-visit.liquid (the shop's own section, ported) ===== */
.cp-svc-visit__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 48px; align-items: center; }
.cp-svc-visit__facts { list-style: none; margin: 26px 0 0; padding: 0; display: grid; gap: 16px; }
.cp-svc-visit__facts li { display: flex; gap: 14px; align-items: flex-start; font-size: 15.5px; line-height: 1.55; }
.cp-svc-visit__facts .cp-svc-ic { color: var(--navy); width: 22px; height: 22px; margin-top: 2px; }
.cp-svc-visit__facts b { display: block; color: var(--ink); font-weight: 600; }
.cp-svc-visit__facts a { color: var(--navy); font-weight: 600; text-decoration: none; }
.cp-svc-visit__facts a:hover { text-decoration: underline; text-underline-offset: 3px; }
.cp-svc-visit__btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.cp-svc-visit__map { border-radius: 20px; overflow: hidden; border: 1px solid var(--line); background: var(--tile); aspect-ratio: 16 / 11; }
.cp-svc-visit__map iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ===== sections/cp-shops (the two branches, 10 Oct 2026): one card a shop ===== */
.cp-shops__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 28px; align-items: start; }
.cp-shops__card { background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 26px; }
.cp-shops__name { margin: 0 0 8px; font-size: 22px; line-height: 1.25; font-weight: 600; color: var(--ink); letter-spacing: -.01em; }
/* Where a shop stands: a plain line, no box (the owner, 12 Oct 2026). Bold in the heading colour when open, the quiet text colour when not. */
.cp-shops__state { margin: 0 0 12px; font-size: 14.5px; line-height: 1.5; }
.cp-shops__state--open { color: var(--ink); font-weight: 600; }
.cp-shops__state--soon { color: var(--mut); font-weight: 400; }
.cp-shops__address { font-style: normal; font-size: 15.5px; line-height: 1.55; color: var(--txt); margin: 0 0 16px; max-width: 44ch; }
.cp-shops__services { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; padding: 0; }
.cp-shops__services li { padding: 5px 14px; border: 1px solid var(--line); border-radius: 999px; font-size: 14px; color: var(--txt); background: #fff; }
.cp-shops__call { margin: 0 0 16px; font-size: 15.5px; color: var(--txt); }
.cp-shops__call a { color: var(--navy); font-weight: 600; text-decoration: none; }
.cp-shops__call a:hover { text-decoration: underline; text-underline-offset: 3px; }
.cp-shops__btns { display: flex; flex-wrap: wrap; gap: 12px; }
.cp-shops__note { margin: 0; font-size: 15.5px; line-height: 1.55; color: var(--txt); max-width: 40ch; }
.cp-shops__fssai { margin: 18px 0 0; font-size: 13.5px; color: var(--mut); }
@media screen and (max-width: 749px) {
  .cp-shops__grid { grid-template-columns: 1fr; gap: 16px; margin-top: 20px; }
  .cp-shops__card { padding: 20px; border-radius: 16px; }
  .cp-shops__btns .cp-svc__btn { flex: 1 1 140px; }
}
@media (max-width: 989px) {
  .cp-svc-visit__grid { grid-template-columns: 1fr; gap: 26px; }
  .cp-svc-visit__map { aspect-ratio: 4 / 3; border-radius: 16px; }
  .cp-svc-visit__facts { margin-top: 20px; gap: 14px; }
  .cp-svc-visit__facts li { font-size: 15px; }
  .cp-svc-visit__btns { margin-top: 24px; }
  .cp-svc-visit__btns .cp-svc__btn { flex: 1 1 150px; }
}

/* ===== sections/cp-svc-cards.liquid (the shop's own section, ported) ===== */
.cp-svc-cards__grid { display: grid; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); gap: 16px; }
.cp-svc-card { background: var(--mist); border-radius: 20px; padding: 30px; }
.cp-svc--mist .cp-svc-card { background: #fff; border: 1px solid var(--line); }
.cp-svc-card__h { font-size: 24px; line-height: 1.2; font-weight: 400; color: var(--ink); margin: 0; letter-spacing: -.01em; text-transform: none; }
.cp-svc-card__p { font-size: 15.5px; line-height: 1.6; margin-top: 12px !important; max-width: 62ch; }
.cp-svc-card__list { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 10px; }
.cp-svc-card--wide .cp-svc-card__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 32px; }
.cp-svc-card__list li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; line-height: 1.45; }
.cp-svc-card { display: flex; flex-direction: column; align-items: flex-start; }
.cp-svc-card__link { margin-top: auto; padding-top: 18px; }
.cp-svc-card__list svg { width: 18px; height: 18px; flex: 0 0 auto; color: var(--navy); margin-top: 2px; }
@media (max-width: 749px) {
  .cp-svc-cards__grid { grid-template-columns: 1fr; gap: 10px; }
  .cp-svc-card { padding: 20px 18px; border-radius: 16px; }
  .cp-svc-card__h { font-size: 21px; }
  .cp-svc-card__p { font-size: 15px; }
  .cp-svc-card--wide .cp-svc-card__list { grid-template-columns: 1fr; gap: 10px; }
  .cp-svc-card__list li { font-size: 14.5px; }
}

/* ===== sections/cp-svc-more.liquid (the shop's own section, ported) ===== */
.cp-svc-more__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.cp-svc-more__card { display: flex; gap: 20px; align-items: stretch; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 14px; text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s; }
.cp-svc-more__card:hover { border-color: #C9D3DE; box-shadow: 0 6px 24px rgba(22, 32, 43, .07); }
.cp-svc-more__img { flex: 0 0 150px; border-radius: 12px; overflow: hidden; background: var(--tile); aspect-ratio: 1 / 1; align-self: flex-start; }
.cp-svc-more__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cp-svc-more__body { display: flex; flex-direction: column; justify-content: center; gap: 6px; padding: 6px 10px 6px 0; }
.cp-svc-more__t { font-size: 20px; line-height: 1.25; font-weight: 400; color: var(--ink); }
.cp-svc-more__d { font-size: 15px; line-height: 1.5; color: var(--mut); }
.cp-svc-more__body .cp-svc__link { margin-top: 6px; }
.cp-svc-more__card:hover .cp-svc__link svg { transform: translateX(3px); }
.cp-svc-more__grid--stack { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cp-svc-more__grid--stack .cp-svc-more__card { flex-direction: column; gap: 0; padding: 0; overflow: hidden; }
.cp-svc-more__grid--stack .cp-svc-more__img { flex: 0 0 auto; width: 100%; aspect-ratio: 16 / 10; border-radius: 0; }
.cp-svc-more__grid--stack .cp-svc-more__body { padding: 20px 22px 22px; justify-content: flex-start; flex: 1; }
.cp-svc-more__grid--stack .cp-svc-more__body .cp-svc__link { margin-top: auto; padding-top: 10px; }
@media (max-width: 989px) {
  .cp-svc-more__grid, .cp-svc-more__grid--stack { grid-template-columns: 1fr; gap: 10px; }
  .cp-svc-more__grid--stack .cp-svc-more__card { flex-direction: row; gap: 14px; padding: 12px; }
  .cp-svc-more__grid--stack .cp-svc-more__img { flex: 0 0 150px; width: auto; aspect-ratio: 1 / 1; border-radius: 12px; }
  .cp-svc-more__grid--stack .cp-svc-more__body { padding: 6px 10px 6px 0; justify-content: center; }
  .cp-svc-more__grid--stack .cp-svc-more__body .cp-svc__link { margin-top: 6px; padding-top: 0; }
}
@media (max-width: 749px) {
  .cp-svc-more__card, .cp-svc-more__grid--stack .cp-svc-more__card { gap: 14px; padding: 12px; border-radius: 16px; }
  .cp-svc-more__img, .cp-svc-more__grid--stack .cp-svc-more__img { flex-basis: 96px; }
  .cp-svc-more__t { font-size: 17px; }
  .cp-svc-more__d { font-size: 14px; }
  .cp-svc-more__body, .cp-svc-more__grid--stack .cp-svc-more__body { padding: 0; gap: 4px; }
}

/* ===== sections/cp-svc-points.liquid (the shop's own section, ported) ===== */
.cp-svc-points__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: 32px 40px; }
.cp-svc-point { display: flex; gap: 16px; align-items: flex-start; }
.cp-svc-point__ic { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 12px; background: var(--tile); color: var(--navy); display: grid; place-items: center; }
.cp-svc--mist .cp-svc-point__ic { background: #fff; border: 1px solid var(--line); }
.cp-svc-point__t { font-size: 17px; line-height: 1.3; font-weight: 600; color: var(--ink); margin: 2px 0 0; letter-spacing: 0; text-transform: none; }
.cp-svc-point__d { font-size: 15px; line-height: 1.55; color: var(--mut); margin-top: 6px !important; }
.cp-svc-points__grid--card { gap: 16px; }
.cp-svc-points__grid--card .cp-svc-point { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 22px; flex-direction: column; gap: 14px; }
.cp-svc-points__grid--card .cp-svc-point__ic { background: var(--tile); border: 0; }
@media (max-width: 989px) { .cp-svc-points__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 28px; } .cp-svc-points__grid--card { gap: 12px; } }
@media (max-width: 749px) {
  .cp-svc-points__grid { grid-template-columns: 1fr; gap: 20px; }
  .cp-svc-point { gap: 14px; }
  .cp-svc-point__ic { width: 42px; height: 42px; }
  .cp-svc-point__t { font-size: 16px; }
  .cp-svc-point__d { font-size: 14.5px; margin-top: 4px !important; }
  .cp-svc-points__grid--card { gap: 10px; }
  .cp-svc-points__grid--card .cp-svc-point { flex-direction: row; padding: 16px; border-radius: 14px; }
}

/* ===== sections/cp-svc-stats.liquid (the shop's own section, ported) ===== */
.cp-svc-stats { padding-top: 0; }
.cp-svc-stats__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: 16px; }
.cp-svc-stat { background: var(--mist); border-radius: 18px; padding: 22px; display: flex; flex-direction: column; }
.cp-svc--mist .cp-svc-stat { background: #fff; border: 1px solid var(--line); }
.cp-svc-stat__ic { width: 40px; height: 40px; border-radius: 11px; background: #fff; color: var(--navy); display: grid; place-items: center; margin-bottom: 16px; }
.cp-svc--mist .cp-svc-stat__ic { background: var(--tile); }
.cp-svc-stat__v { font-size: 28px; line-height: 1.1; letter-spacing: -.02em; color: var(--ink); font-weight: 500; font-variant-numeric: tabular-nums; }
.cp-svc-stat__l { font-size: 14.5px; line-height: 1.45; color: var(--mut); margin-top: 6px; }
.cp-svc-stats__text { margin-top: 24px; max-width: 880px; font-size: 15px; line-height: 1.65; color: var(--mut); }
.cp-svc .cp-svc-stats__text p { margin: 0 0 10px; }
.cp-svc .cp-svc-stats__text p:last-child { margin-bottom: 0; }
.cp-svc-stats__text a { color: var(--navy); }
@media (max-width: 989px) { .cp-svc-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } }
@media (max-width: 749px) {
  .cp-svc-stat { padding: 16px; border-radius: 14px; }
  .cp-svc-stat__ic { width: 34px; height: 34px; margin-bottom: 12px; border-radius: 9px; }
  .cp-svc-stat__ic .cp-svc-ic { width: 20px; height: 20px; }
  .cp-svc-stat__v { font-size: 22px; }
  .cp-svc-stat__l { font-size: 13px; }
  .cp-svc-stats__text { font-size: 14px; margin-top: 18px; }
}

/* ===== sections/cp-svc-guide.liquid (the shop's own section, ported) ===== */
.cp-svc-guide__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.cp-svc-note { background: var(--mist); border-radius: 20px; padding: 26px 28px; }
.cp-svc--mist .cp-svc-note { background: #fff; border: 1px solid var(--line); }
.cp-svc-note summary { list-style: none; display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; cursor: default; pointer-events: none; }
.cp-svc-note summary::-webkit-details-marker { display: none; }
.cp-svc-note summary svg { display: none; width: 18px; height: 18px; flex: 0 0 auto; margin-top: 3px; color: var(--navy); transition: transform .2s; }
.cp-svc-note__t { font-size: 19px; line-height: 1.3; font-weight: 600; color: var(--ink); margin: 0; letter-spacing: 0; text-transform: none; }
.cp-svc-note__d { font-size: 15px; line-height: 1.65; margin-top: 10px; }
.cp-svc .cp-svc-note__d p { margin: 0 0 10px; }
.cp-svc .cp-svc-note__d p:last-child { margin-bottom: 0; }
.cp-svc-note__d a { color: var(--navy); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 989px) { .cp-svc-guide__grid { grid-template-columns: 1fr; gap: 10px; } }
@media (max-width: 749px) {
  .cp-svc-note { padding: 0; border-radius: 14px; }
  .cp-svc-note summary { padding: 16px; cursor: pointer; pointer-events: auto; }
  .cp-svc-note summary svg { display: block; }
  .cp-svc-note[open] summary svg { transform: rotate(180deg); }
  .cp-svc-note__t { font-size: 16.5px; }
  .cp-svc-note__d { padding: 0 16px 16px; margin-top: 0; font-size: 14.5px; }
}

/* ===== sections/cp-svc-tiles.liquid (the shop's own section, ported) ===== */
.cp-svc .cp-svc-tiles__head { max-width: none; display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; }
.cp-svc-tiles__grid { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: 20px; }
.cp-svc-tile { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.cp-svc-tile__img { display: block; background: var(--tile); border-radius: 18px; aspect-ratio: 4 / 3; overflow: hidden; padding: 18px; transition: background .15s; }
.cp-svc--mist .cp-svc-tile__img { background: #fff; border: 1px solid var(--line); }
.cp-svc-tile__img img { width: 100%; height: 100%; object-fit: contain; display: block; transition: transform .3s ease; }
.cp-svc-tile:hover .cp-svc-tile__img img { transform: scale(1.04); }
.cp-svc-tile__t { font-size: 18px; line-height: 1.3; font-weight: 600; color: var(--ink); margin-top: 14px; }
.cp-svc-tile__d { font-size: 14.5px; line-height: 1.5; color: var(--mut); margin-top: 4px; }
.cp-svc-tile .cp-svc__link { margin-top: 10px; font-size: 14.5px; }
.cp-svc-tile:hover .cp-svc__link svg { transform: translateX(3px); }
@media (max-width: 989px) { .cp-svc-tiles__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 14px; } }
@media (max-width: 749px) {
  .cp-svc-tiles__head { align-items: flex-start; flex-direction: column; gap: 10px; }
  .cp-svc-tiles__grid { gap: 18px 12px; }
  .cp-svc-tile__img { border-radius: 14px; padding: 12px; }
  .cp-svc-tile__t { font-size: 16px; margin-top: 10px; }
  .cp-svc-tile__d { display: none; }
  .cp-svc-tile .cp-svc__link { margin-top: 4px; font-size: 13.5px; }
}

/* ===== sections/cp-svc-story.liquid (the shop's own section, ported) ===== */
.cp-svc-story__rows { display: grid; gap: 72px; }
.cp-svc-story__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.cp-svc-story__row:nth-child(even) .cp-svc-story__media { order: 2; }
.cp-svc-story__media { border-radius: 24px; overflow: hidden; background: var(--tile); aspect-ratio: 4 / 3; }
.cp-svc-story__media img, .cp-svc-story__media video { width: 100%; height: 100%; object-fit: cover; display: block; }
.cp-svc-story__h { font-size: 30px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: var(--ink); margin: 0; text-transform: none; }
.cp-svc-story__p { font-size: 17px; line-height: 1.7; margin-top: 14px !important; max-width: 54ch; }
@media (max-width: 989px) {
  .cp-svc-story__rows { gap: 40px; }
  .cp-svc-story__row { grid-template-columns: 1fr; gap: 18px; }
  .cp-svc-story__row:nth-child(even) .cp-svc-story__media { order: 0; }
  .cp-svc-story__media { aspect-ratio: 16 / 10; border-radius: 16px; }
  .cp-svc-story__h { font-size: 24px; }
  .cp-svc-story__p { font-size: 15.5px; line-height: 1.65; margin-top: 10px !important; }
}

/* ===== sections/cp-svc-prices.liquid (the shop's own section, ported) ===== */
.cp-svc-prices { scroll-margin-top: 140px; }
.cp-svc-prices__grid { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: 16px; }
.cp-svc-price { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 24px 22px 22px; display: flex; flex-direction: column; }
.cp-svc-price__name { font-size: 15px; line-height: 1.3; font-weight: 600; color: var(--ink); margin: 0; letter-spacing: 0; text-transform: none; }
.cp-svc-price__amt { font-size: 34px; line-height: 1.1; font-weight: 500; color: var(--ink); letter-spacing: -.02em; margin-top: 10px !important; font-variant-numeric: tabular-nums; }
.cp-svc-price__note { font-size: 13.5px; color: var(--mut); margin-top: 4px !important; }
.cp-svc-price__text { font-size: 14.5px; line-height: 1.5; color: var(--txt); margin-top: 12px !important; }
.cp-svc-price__inc { list-style: none; margin: 16px 0 0; padding: 16px 0 0; border-top: 1px solid var(--line); display: grid; gap: 8px; }
.cp-svc-price__inc li, .cp-svc-prices__shared li { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; line-height: 1.4; }
.cp-svc-price__inc svg, .cp-svc-prices__shared svg { width: 16px; height: 16px; flex: 0 0 auto; color: var(--navy); margin-top: 2px; }
.cp-svc-price__cta { margin-top: auto; padding-top: 20px; }
.cp-svc-prices__shared { margin-top: 16px; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 20px 22px; }
.cp-svc-prices__shared-t { font-size: 15px; font-weight: 600; color: var(--ink); margin-bottom: 12px !important; }
.cp-svc-prices__shared ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 28px; }
.cp-svc-prices__foot { font-size: 14px; color: var(--mut); margin-top: 18px !important; }
@media (max-width: 1099px) { .cp-svc-prices__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 749px) {
  .cp-svc-prices { scroll-margin-top: 90px; }
  .cp-svc-prices__grid { grid-template-columns: 1fr; gap: 10px; }
  .cp-svc-price { padding: 16px 16px 14px; border-radius: 14px; }
  .cp-svc-price__top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
  .cp-svc-price__name { font-size: 16px; }
  .cp-svc-price__amt { font-size: 22px; margin-top: 0 !important; white-space: nowrap; }
  .cp-svc-price__text { margin-top: 6px !important; font-size: 14px; }
  .cp-svc-price__inc { display: block; margin-top: 8px; padding-top: 0; border-top: 0; color: var(--mut); line-height: 1.5; }
  .cp-svc-price__inc li { display: inline; font-size: 13px; }
  .cp-svc-price__inc li + li::before { content: " · "; }
  .cp-svc-price__inc svg { display: none; }
  .cp-svc-price__cta { padding-top: 10px; font-size: 14px; }
  .cp-svc-prices__shared { padding: 16px; border-radius: 14px; margin-top: 10px; }
  .cp-svc-prices__shared ul { display: grid; gap: 8px; }
}

/* ===== sections/cp-closure.liquid (the shop's own section, ported) ===== */
.cp-closure--bar { background: #003662; color: #fff; font-size: 14px; line-height: 1.4; text-align: center; }
  .cp-closure--bar .cp-closure__in { padding-top: 9px; padding-bottom: 9px; }
  .cp-closure p { margin: 0; }
  .cp-closure--bar a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }
  .cp-closure__short { display: none; }
  .cp-closure--notice { margin: 16px 0; }
  .cp-closure--notice .cp-closure__in > p { flex: 1; }
  .cp-closure--notice .cp-closure__in { display: flex; gap: 12px; align-items: flex-start; }
  .cp-closure--notice .cp-closure__in { background: #FBF3E1; color: #2B333D; border: 1px solid #EBD9A8; border-radius: 12px; padding: 14px 16px; font-size: 15px; line-height: 1.5; max-width: min(1200px, calc(100% - 32px)); }
  .cp-closure--notice strong { color: #16202B; }
  .cp-closure--notice a { color: #003662; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
  .cp-closure--notice svg { width: 22px; height: 22px; flex: 0 0 auto; margin-top: 1px; fill: none; stroke: #7A5A12; stroke-width: 1.8; stroke-linecap: round; }
  @media (max-width: 749px) {
    .cp-closure--bar { font-size: 13px; }
    .cp-closure--has-short .cp-closure__long { display: none; }
    .cp-closure--has-short .cp-closure__short { display: inline; }
  }

/* ===== sections/cp-contact.liquid (the shop's own section, ported) ===== */
.cp-ct { padding: 44px 0 40px; }
.cp-ct__top { max-width: 720px; }
.cp-ct__h1 { font-size: 48px; line-height: 1.1; letter-spacing: -.02em; font-weight: 400; color: var(--ink); margin: 0; text-transform: none; }
.cp-ct__ways { list-style: none; margin: 32px 0 0; padding: 0; display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: 16px; }
.cp-ct__way { display: flex; flex-direction: column; align-items: flex-start; padding: 26px; border: 1px solid var(--line); border-radius: 20px; background: #fff; }
.cp-ct__way--main { background: var(--mist); border-color: transparent; }
.cp-ct__ic { width: 44px; height: 44px; border-radius: 12px; background: var(--tile); color: var(--navy); display: grid; place-items: center; margin-bottom: 16px; }
.cp-ct__way--main .cp-ct__ic { background: #fff; }
.cp-ct__way-h { font-size: 22px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: var(--ink); margin: 0; text-transform: none; }
.cp-svc .cp-ct__way-p { margin-top: 8px; font-size: 15px; color: var(--mut); }
.cp-svc .cp-ct__way-v { margin-top: 10px; font-size: 16px; font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.cp-ct__txt { flex: 1 1 auto; margin-bottom: 20px; }
.cp-ct__quick { margin-top: 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cp-ct__quick-h { font-size: 14px; color: var(--mut); margin-right: 4px; }
.cp-ct__quick a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border: 1px solid #C9D3DE; border-radius: 10px; background: #fff; color: var(--navy); font-size: 14px; font-weight: 600; text-decoration: none; }
.cp-ct__quick a:hover { background: var(--tile); border-color: var(--navy); }
@media (max-width: 989px) { .cp-ct__ways { grid-template-columns: 1fr; } }
@media (max-width: 749px) {
  .cp-ct { padding: 26px 0 28px; }
  .cp-ct__h1 { font-size: 32px; }
  .cp-ct__ways { margin-top: 20px; gap: 10px; }
  .cp-ct__way { padding: 18px; border-radius: 16px; display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 14px; align-items: start; }
  .cp-ct__ic { width: 40px; height: 40px; margin: 0; grid-row: 1 / span 2; }
  .cp-ct__way > *:not(.cp-ct__ic) { grid-column: 2; }
  .cp-ct__txt { margin-bottom: 14px; }
  .cp-ct__way-h { font-size: 19px; }
  .cp-ct__way .cp-svc__btn { justify-self: start; min-height: 44px; }
  .cp-ct__quick { margin-top: 16px; }
  .cp-ct__quick-h { flex-basis: 100%; }
}

/* ===== sections/cp-suppliers.liquid (the shop's own section, ported) ===== */
.cp-sup__intro p { margin: 0; }
.cp-sup__intro a { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.cp-sup__list { display: grid; gap: 16px; }
.cp-sup__card { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 36px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 24px; padding: 28px; }
.cp-sup__logo { aspect-ratio: 5 / 3; border-radius: 16px; background: #fff; border: 1px solid var(--line); display: grid; place-items: center; padding: 18px; }
.cp-sup__logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.cp-sup__logo span { font-size: 20px; font-weight: 600; color: var(--ink); text-align: center; }
.cp-sup__kind { display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--navy); background: var(--tile); border-radius: 7px; padding: 4px 9px; }
.cp-sup__name { font-size: 26px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: var(--ink); margin: 12px 0 0; text-transform: none; }
.cp-svc .cp-sup__text { margin-top: 8px; max-width: 62ch; }
.cp-svc .cp-sup__label { margin-top: 18px; font-size: 13px; font-weight: 600; color: var(--mut); }
.cp-sup__brands { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cp-sup__brands a, .cp-sup__brands span { display: inline-flex; align-items: center; min-height: 36px; padding: 0 13px; border-radius: 10px; border: 1px solid var(--line); background: var(--mist); color: var(--ink); font-size: 14px; font-weight: 500; text-decoration: none; white-space: nowrap; }
.cp-sup__brands a { background: #fff; border-color: #C9D3DE; color: var(--navy); }
.cp-sup__brands a:hover { background: var(--tile); border-color: var(--navy); }
.cp-sup__site { margin-top: 20px; }
.cp-svc .cp-sup__foot { margin-top: 20px; font-size: 14.5px; color: var(--mut); max-width: 70ch; }
@media (max-width: 749px) {
  .cp-sup__card { grid-template-columns: 1fr; gap: 16px; padding: 18px; border-radius: 16px; }
  .cp-sup__logo { aspect-ratio: auto; height: 96px; width: 170px; padding: 10px; border-radius: 12px; }
  .cp-sup__name { font-size: 22px; margin-top: 10px; }
  .cp-sup__brands a, .cp-sup__brands span { min-height: 34px; font-size: 13.5px; padding: 0 11px; }
}

/* ===== sections/cp-faq.liquid (the shop's own section, ported) ===== */
.cp-svc.cp-faq { padding-top: 40px; }
.cp-faq__hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: 56px; align-items: center; }
.cp-faq__hero--plain { grid-template-columns: minmax(0, 760px); }
.cp-faq__media { border-radius: 24px; overflow: hidden; background: var(--tile); aspect-ratio: 5 / 4; }
.cp-faq__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; display: block; }
.cp-faq__main { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 56px; align-items: start; margin-top: 56px; }
.cp-faq__h1 { font-size: 48px; line-height: 1.1; letter-spacing: -.02em; font-weight: 400; color: var(--ink); margin: 0; text-transform: none; }
.cp-faq__search { display: flex; align-items: center; gap: 10px; height: 52px; margin-top: 24px; padding: 0 16px; border: 1.5px solid #C9D3DE; border-radius: 14px; background: #fff; color: var(--mut); max-width: 460px; }
.cp-faq__search:focus-within { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(0, 54, 98, .12); }
.cp-faq__search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 16px; color: var(--ink); padding: 0; box-shadow: none; -webkit-appearance: none; appearance: none; }
.cp-faq__topics { position: sticky; top: 130px; display: flex; flex-direction: column; gap: 2px; }
.cp-svc .cp-faq__topics-h { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); margin: 0 0 8px 12px; }
.cp-faq__topics a { display: flex; align-items: center; min-height: 42px; padding: 0 12px; border-radius: 10px; color: var(--txt); font-size: 15px; font-weight: 500; text-decoration: none; }
.cp-faq__topics a:hover { background: var(--mist); color: var(--navy); }
.cp-faq__body { min-width: 0; }
.cp-faq__group { margin: 0 0 36px; scroll-margin-top: 120px; }
.cp-faq__h2 { font-size: 24px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: var(--ink); margin: 0 0 12px; text-transform: none; }
.cp-faq__list { border: 1px solid var(--line); border-radius: 18px; overflow: hidden; background: #fff; }
.cp-faq__item + .cp-faq__item { border-top: 1px solid var(--line); }
.cp-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 20px; cursor: pointer; list-style: none; }
.cp-faq__item summary::-webkit-details-marker { display: none; }
.cp-faq__item summary:hover { background: var(--mist); }
.cp-faq__item summary:focus-visible { outline: 2px solid var(--navy); outline-offset: -2px; }
.cp-faq__item summary svg { flex: 0 0 auto; color: var(--navy); transition: transform .2s; }
.cp-faq__item[open] summary svg { transform: rotate(180deg); }
.cp-faq__q { font-size: 16.5px; line-height: 1.35; font-weight: 600; color: var(--ink); margin: 0; text-transform: none; letter-spacing: 0; }
.cp-faq__a { padding: 0 20px 20px; font-size: 15.5px; line-height: 1.65; color: var(--txt); max-width: 70ch; }
.cp-svc .cp-faq__a p { margin: 0 0 10px; }
.cp-svc .cp-faq__a p:last-child { margin-bottom: 0; }
.cp-faq__a ul, .cp-faq__a ol { margin: 0 0 10px; padding-left: 20px; }
.cp-faq__a li { margin: 0 0 4px; }
.cp-faq__a a { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.cp-svc .cp-faq__none { color: var(--mut); }
.cp-svc.cp-faq [hidden] { display: none !important; }
.cp-faq__help { margin-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 26px 28px; background: var(--mist); border-radius: 20px; }
.cp-faq__help-h { font-size: 22px; line-height: 1.2; font-weight: 400; color: var(--ink); margin: 0 0 6px; text-transform: none; }
.cp-faq__help p { color: var(--mut); }
.cp-faq__help-btns { display: flex; gap: 10px; flex-wrap: wrap; }
@media (max-width: 989px) {
  .cp-faq__hero { grid-template-columns: 1fr; gap: 20px; }
  .cp-faq__media { order: -1; aspect-ratio: 16 / 9; border-radius: 16px; }
  .cp-faq__main { grid-template-columns: 1fr; gap: 0; margin-top: 18px; }
  .cp-faq__topics { position: static; flex-direction: row; gap: 8px; overflow-x: auto; margin: 0 -16px; padding: 0 16px 4px; scrollbar-width: none; }
  .cp-faq__topics::-webkit-scrollbar { display: none; }
  .cp-faq__topics-h { display: none; }
  .cp-faq__topics a { flex: 0 0 auto; min-height: 40px; padding: 0 14px; background: var(--mist); color: var(--navy); font-size: 14px; font-weight: 600; white-space: nowrap; }
  .cp-faq__body { margin-top: 26px; }
}
@media (max-width: 749px) {
  .cp-svc.cp-faq { padding-top: 20px; }
  .cp-faq__h1 { font-size: 32px; }
  .cp-faq__search { height: 48px; margin-top: 18px; max-width: none; }
  .cp-faq__group { margin-bottom: 26px; }
  .cp-faq__h2 { font-size: 21px; }
  .cp-faq__list { border-radius: 14px; }
  .cp-faq__item summary { padding: 15px 16px; }
  .cp-faq__q { font-size: 15.5px; }
  .cp-faq__a { padding: 0 16px 16px; font-size: 15px; }
  .cp-faq__help { flex-direction: column; align-items: flex-start; padding: 20px 18px; border-radius: 16px; gap: 14px; }
  .cp-faq__help-btns .cp-svc__btn { flex: 1 1 auto; }
}

/* ===== sections/cp-brands.liquid (the shop's own section, ported) ===== */
.cp-br { padding-top: 48px; }
.cp-br__top { max-width: 760px; }
.cp-br__h1 { font-size: 48px; line-height: 1.1; letter-spacing: -.02em; font-weight: 400; color: var(--ink); margin: 0; text-transform: none; }
.cp-br__search { display: flex; align-items: center; gap: 10px; height: 52px; margin-top: 24px; padding: 0 16px; border: 1.5px solid #C9D3DE; border-radius: 14px; background: #fff; color: var(--mut); max-width: 460px; }
.cp-br__search:focus-within { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(0, 54, 98, .12); }
.cp-br__search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 16px; color: var(--ink); padding: 0; box-shadow: none; -webkit-appearance: none; appearance: none; }
.cp-br__letters { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 18px; }
.cp-br__letters a { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; background: var(--mist); color: var(--navy); font-size: 14px; font-weight: 600; text-decoration: none; }
.cp-br__letters a:hover { background: var(--tile); }
.cp-br__h2 { font-size: 24px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: var(--ink); margin: 0 0 18px; text-transform: none; }
.cp-br__logos { margin-top: 48px; }
.cp-br__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.cp-br__tile { display: flex; flex-direction: column; gap: 8px; padding: 10px 10px 12px; border: 1px solid var(--line); border-radius: 16px; background: #fff; text-decoration: none; color: var(--ink); transition: border-color .15s, transform .15s; height: 100%; }
.cp-br__tile:hover { border-color: var(--navy); transform: translateY(-2px); }
.cp-br__tile-img { display: block; aspect-ratio: 5 / 3; border-radius: 10px; overflow: hidden; background: #fff; }
.cp-br__tile-img img { width: 100%; height: 100%; object-fit: contain; display: block; }
.cp-br__tile-n { font-size: 14px; font-weight: 600; line-height: 1.25; text-align: center; }
.cp-br__index { margin-top: 56px; }
.cp-br__groups { columns: 4; column-gap: 24px; }
.cp-br__group { break-inside: avoid; margin: 0 0 16px; padding: 18px 20px; background: var(--mist); border-radius: 16px; scroll-margin-top: 120px; }
.cp-br__letter { font-size: 22px; line-height: 1; font-weight: 500; color: var(--navy); margin: 0 0 10px; text-transform: none; }
.cp-br__group ul { list-style: none; margin: 0; padding: 0; }
.cp-br__group li { font-size: 15px; line-height: 1.3; }
.cp-br__group a { display: block; padding: 6px 0; color: var(--txt); text-decoration: none; }
.cp-br__group a:hover { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.cp-svc .cp-br__none { margin-top: 8px; color: var(--mut); }
.cp-br [hidden] { display: none !important; }
.cp-br__note { margin-top: 40px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 26px 28px; border: 1px solid var(--line); border-radius: 20px; }
.cp-br__note-h { font-size: 22px; line-height: 1.2; font-weight: 400; color: var(--ink); margin: 0 0 6px; text-transform: none; }
.cp-br__note p { color: var(--mut); max-width: 62ch; }
@media (max-width: 989px) { .cp-br__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .cp-br__groups { columns: 3; } }
@media (max-width: 749px) {
  .cp-br { padding-top: 28px; }
  .cp-br__h1 { font-size: 32px; }
  .cp-br__search { height: 48px; margin-top: 18px; max-width: none; }
  .cp-br__letters { flex-wrap: nowrap; overflow-x: auto; margin: 14px -16px 0; padding: 0 16px 4px; scrollbar-width: none; }
  .cp-br__letters::-webkit-scrollbar { display: none; }
  .cp-br__letters a { flex: 0 0 auto; width: 38px; height: 38px; }
  .cp-br__logos { margin-top: 30px; }
  .cp-br__h2 { font-size: 21px; margin-bottom: 14px; }
  .cp-br__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .cp-br__tile { padding: 6px 6px 9px; border-radius: 12px; gap: 5px; }
  .cp-br__tile-n { font-size: 12.5px; }
  .cp-br__index { margin-top: 36px; }
  .cp-br__groups { columns: 2; column-gap: 10px; }
  .cp-br__group { padding: 14px; margin-bottom: 10px; border-radius: 14px; }
  .cp-br__group li { font-size: 14.5px; }
  .cp-br__group a { padding: 7px 0; }
  .cp-br__note { flex-direction: column; align-items: flex-start; padding: 20px 18px; border-radius: 16px; gap: 14px; margin-top: 26px; }
}

/* ===== sections/cp-birthday.liquid (the shop's own section, ported) ===== */
.cp-svc.cp-bd { padding-top: 40px; }
.cp-bd__hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: 56px; align-items: center; }
.cp-bd__h1 { font-size: 48px; line-height: 1.1; letter-spacing: -.02em; font-weight: 400; color: var(--ink); margin: 0; text-transform: none; }
.cp-bd__media { border-radius: 24px; overflow: hidden; background: var(--tile); aspect-ratio: 5 / 4; }
.cp-bd__media img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; display: block; }
.cp-bd__steps { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 14px; }
.cp-bd__steps li { display: flex; gap: 14px; align-items: flex-start; font-size: 15.5px; line-height: 1.5; color: var(--mut); }
.cp-bd__steps b { display: block; color: var(--ink); font-weight: 600; }
.cp-bd__n { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; background: var(--navy); color: #fff; font-size: 14px; font-weight: 600; display: grid; place-items: center; margin-top: 1px; }
.cp-bd__join { margin-top: 48px; padding: 32px; background: var(--mist); border-radius: 24px; scroll-margin-top: 130px; }
.cp-bd__h2 { font-size: 26px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: var(--ink); margin: 0; text-transform: none; }
.cp-svc .cp-bd__sub { margin-top: 8px; color: var(--mut); max-width: 62ch; }
.cp-bd__gate { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.cp-bd__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 22px; }
.cp-bd__f { display: flex; flex-direction: column; gap: 6px; }
.cp-bd__f > span { font-size: 13px; font-weight: 600; color: var(--ink); }
.cp-bd__f input, .cp-bd__f select { height: 48px; width: 100%; padding: 0 14px; border: 1.5px solid #C9D3DE; border-radius: 12px; background: #fff; font: inherit; font-size: 16px; color: var(--ink); box-shadow: none; }
.cp-bd__f input:focus, .cp-bd__f select:focus { outline: 0; border-color: var(--navy); box-shadow: 0 0 0 3px rgba(0, 54, 98, .12); }
.cp-bd__date { display: grid; grid-template-columns: 1fr 1.5fr; gap: 8px; }
.cp-bd__go { margin-top: 22px; }
.cp-svc .cp-bd__fine { margin-top: 12px; font-size: 13px; color: var(--mut); max-width: 70ch; }
.cp-svc .cp-bd__err { margin-top: 12px; color: #B42318; font-weight: 600; }
.cp-bd__done p { margin-top: 8px; color: var(--mut); }
.cp-bd__terms { margin-top: 24px; font-size: 14px; line-height: 1.6; color: var(--mut); max-width: 80ch; }
.cp-svc .cp-bd__terms p { margin: 0 0 8px; }
.cp-bd__terms ul { margin: 0; padding-left: 18px; }
.cp-bd__terms a { color: var(--navy); }
@media (max-width: 989px) {
  .cp-bd__hero { grid-template-columns: 1fr; gap: 20px; }
  .cp-bd__media { order: -1; aspect-ratio: 16 / 9; border-radius: 16px; }
  .cp-bd__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 749px) {
  .cp-svc.cp-bd { padding-top: 20px; }
  .cp-bd__h1 { font-size: 32px; }
  .cp-bd__steps { margin-top: 20px; }
  .cp-bd__join { margin-top: 28px; padding: 20px 18px; border-radius: 16px; }
  .cp-bd__h2 { font-size: 22px; }
  .cp-bd__gate { flex-direction: column; align-items: flex-start; gap: 16px; }
  .cp-bd__gate .cp-svc__btn, .cp-bd__go { width: 100%; }
  .cp-bd__grid { grid-template-columns: 1fr; gap: 14px; margin-top: 18px; }
}

/* ===== sections/cp-affiliate.liquid (the shop's own section, ported) ===== */
.cp-af { padding-top: 40px; }
.cp-af__hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: 56px; align-items: center; }
.cp-af__h1 { font-size: 48px; line-height: 1.1; letter-spacing: -.02em; font-weight: 400; color: var(--ink); margin: 0; text-transform: none; }
.cp-af__media { border-radius: 24px; overflow: hidden; background: var(--tile); aspect-ratio: 5 / 4; }
.cp-af__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cp-af__steps { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 14px; }
.cp-af__steps li { display: flex; gap: 14px; align-items: flex-start; font-size: 15.5px; line-height: 1.5; color: var(--mut); }
.cp-af__steps b { display: block; color: var(--ink); font-weight: 600; }
.cp-af__n { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; background: var(--navy); color: #fff; font-size: 14px; font-weight: 600; display: grid; place-items: center; margin-top: 1px; }
.cp-af__join { margin-top: 48px; padding: 32px; background: var(--mist); border-radius: 24px; scroll-margin-top: 130px; }
.cp-af__h2 { font-size: 26px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: var(--ink); margin: 0; text-transform: none; }
.cp-svc .cp-af__sub { margin-top: 8px; color: var(--mut); max-width: 62ch; }
.cp-af__gate { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.cp-af__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 22px; }
.cp-af__f { display: flex; flex-direction: column; gap: 6px; }
.cp-af__f > span, .cp-af__box > span { font-size: 13px; font-weight: 600; color: var(--ink); }
.cp-af__f input, .cp-af__f select { height: 48px; width: 100%; padding: 0 14px; border: 1.5px solid #C9D3DE; border-radius: 12px; background: #fff; font: inherit; font-size: 16px; color: var(--ink); box-shadow: none; }
.cp-af__f input:focus, .cp-af__f select:focus { outline: 0; border-color: var(--navy); box-shadow: 0 0 0 3px rgba(0, 54, 98, .12); }
.cp-af__agree { display: flex; gap: 10px; align-items: flex-start; margin-top: 18px; font-size: 14.5px; line-height: 1.5; color: var(--ink); cursor: pointer; }
.cp-af__agree a { color: var(--navy); text-decoration: underline; }
.cp-af__agree input { width: 20px; height: 20px; margin: 1px 0 0; flex: 0 0 auto; accent-color: var(--navy); }
.cp-af__go { margin-top: 22px; }
.cp-af__go[disabled] { opacity: .45; cursor: not-allowed; }
.cp-svc .cp-af__note { margin-top: 16px; padding: 12px 16px; background: #fff; border: 1px solid var(--line); border-radius: 12px; font-size: 14.5px; color: var(--ink); max-width: 70ch; }
.cp-af__note[hidden] { display: none; }
.cp-svc .cp-af__fine { margin-top: 12px; font-size: 13px; color: var(--mut); max-width: 70ch; }
.cp-svc .cp-af__err { margin-top: 12px; color: #B42318; font-weight: 600; }
.cp-af__mine { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 16px; margin-top: 22px; }
.cp-af__box { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 16px 18px; }
.cp-af__box > span { grid-column: 1 / -1; }
.cp-af__box output { font-size: 17px; font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.cp-af__copy { min-height: 44px; padding: 0 16px; border: 1.5px solid var(--navy); border-radius: 999px; background: #fff; color: var(--navy); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.cp-af__copy:focus-visible { outline: 3px solid rgba(0, 54, 98, .3); outline-offset: 2px; }
@media (max-width: 989px) {
  .cp-af__hero { grid-template-columns: 1fr; gap: 20px; }
  .cp-af__media { order: -1; aspect-ratio: 16 / 9; border-radius: 16px; }
}
@media (max-width: 749px) {
  .cp-af { padding-top: 20px; }
  .cp-af__h1 { font-size: 32px; }
  .cp-af__steps { margin-top: 20px; }
  .cp-af__join { margin-top: 28px; padding: 20px 18px; border-radius: 16px; }
  .cp-af__h2 { font-size: 22px; }
  .cp-af__gate { flex-direction: column; align-items: flex-start; gap: 16px; }
  .cp-af__gate .cp-svc__btn, .cp-af__go { width: 100%; }
  .cp-af__grid, .cp-af__mine { grid-template-columns: 1fr; gap: 14px; margin-top: 18px; }
}

/* ===== sections/cp-blog.liquid (the shop's own section, ported) ===== */
.cp-blog { padding-top: 36px; }
.cp-blog__head { margin-bottom: 36px; max-width: 860px; }
.cp-blog__h1 { font-size: 46px; line-height: 1.1; letter-spacing: -.02em; font-weight: 400; color: var(--ink); margin: 0; text-transform: none; }
.cp-blog__topics { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.cp-blog__topic { display: inline-flex; align-items: center; min-height: 38px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--line); background: #fff; color: var(--txt); font-size: 14.5px; font-weight: 500; text-decoration: none; white-space: nowrap; transition: border-color .15s, background .15s, color .15s; }
.cp-blog__topic:hover { border-color: var(--navy); color: var(--navy); }
.cp-blog__topic.is-active { background: var(--navy); border-color: var(--navy); color: #fff; }
.cp-blog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 28px; }
.cp-blog__card { display: flex; flex-direction: column; min-width: 0; }
.cp-blog__img { display: block; border-radius: 16px; overflow: hidden; background: var(--tile); aspect-ratio: 3 / 2; }
.cp-blog__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.cp-blog__card:hover .cp-blog__img img { transform: scale(1.03); }
.cp-blog__body { padding-top: 16px; display: flex; flex-direction: column; flex: 1; }
.cp-blog__tag { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--navy); margin-bottom: 8px !important; }
.cp-blog__t { font-size: 19px; line-height: 1.32; font-weight: 600; color: var(--ink); margin: 0; letter-spacing: -.005em; text-transform: none; }
.cp-blog__t a { color: inherit; text-decoration: none; }
.cp-blog__t a:hover { color: var(--navy); }
.cp-blog__ex { font-size: 15px; line-height: 1.55; color: var(--mut); margin-top: 8px !important; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cp-blog__meta { font-size: 13px; color: var(--mut); margin-top: auto !important; padding-top: 12px; }
.cp-blog__card--feature { grid-column: 1 / -1; flex-direction: row; gap: 40px; align-items: center; padding-bottom: 44px; border-bottom: 1px solid var(--line); }
.cp-blog__card--feature .cp-blog__img { flex: 0 0 56%; border-radius: 22px; aspect-ratio: 16 / 10; }
.cp-blog__card--feature .cp-blog__body { padding-top: 0; flex: 1; }
.cp-blog__card--feature .cp-blog__t { font-size: 32px; line-height: 1.18; font-weight: 400; letter-spacing: -.015em; }
.cp-blog__card--feature .cp-blog__ex { font-size: 16.5px; line-height: 1.6; -webkit-line-clamp: 4; margin-top: 14px !important; }
.cp-blog__card--feature .cp-blog__meta { margin-top: 0 !important; padding-top: 14px; }
.cp-blog__more { margin-top: 18px; }
.cp-blog__pager { margin-top: 44px; }
.cp-blog__empty { grid-column: 1 / -1; }
@media (max-width: 989px) {
  .cp-blog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 22px; }
  .cp-blog__card--feature { flex-direction: column; align-items: stretch; gap: 0; padding-bottom: 32px; }
  .cp-blog__card--feature .cp-blog__img { flex: 0 0 auto; }
  .cp-blog__card--feature .cp-blog__body { padding-top: 18px; }
  .cp-blog__card--feature .cp-blog__t { font-size: 26px; }
}
@media (max-width: 749px) {
  .cp-blog { padding-top: 22px; }
  .cp-blog__head { margin-bottom: 24px; }
  .cp-blog__h1 { font-size: 32px; }
  .cp-blog__topics { flex-wrap: nowrap; overflow-x: auto; margin: 18px -20px 0; padding: 0 20px 4px; scrollbar-width: none; }
  .cp-blog__topics::-webkit-scrollbar { display: none; }
  .cp-blog__grid { grid-template-columns: 1fr; gap: 0; }
  .cp-blog__card { flex-direction: row; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--line); align-items: flex-start; }
  .cp-blog__img { flex: 0 0 104px; aspect-ratio: 1 / 1; border-radius: 12px; }
  .cp-blog__body { padding-top: 0; }
  .cp-blog__tag { font-size: 11px; margin-bottom: 4px !important; }
  .cp-blog__t { font-size: 16px; line-height: 1.35; }
  .cp-blog__ex { display: none; }
  .cp-blog__meta { padding-top: 6px; font-size: 12.5px; margin-top: 0 !important; }
  .cp-blog__card--feature { flex-direction: column; padding: 0 0 22px; gap: 0; }
  .cp-blog__card--feature .cp-blog__img { flex: 0 0 auto; width: 100%; aspect-ratio: 16 / 10; border-radius: 16px; }
  .cp-blog__card--feature .cp-blog__body { padding-top: 14px; }
  .cp-blog__card--feature .cp-blog__t { font-size: 23px; font-weight: 500; }
  .cp-blog__card--feature .cp-blog__ex { display: -webkit-box; font-size: 15px; -webkit-line-clamp: 3; margin-top: 8px !important; }
  .cp-blog__pager { margin-top: 28px; }
}

/* ===== sections/cp-article-more.liquid (the shop's own section, ported) ===== */
/* ---- 2. what to do next ---- */
.cp-am { padding-top: 8px; }
.cp-am__help { max-width: 760px; margin: 0 auto 56px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 26px 28px; background: var(--mist); border-radius: 20px; }
.cp-am__help-h { font-size: 22px; line-height: 1.2; font-weight: 400; color: var(--ink); margin: 0 0 6px; text-transform: none; }
.cp-am__help p { color: var(--mut); font-size: 15.5px; }
.cp-am__btns { display: flex; gap: 10px; flex-wrap: wrap; flex: 0 0 auto; }
.cp-am__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.cp-am__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.cp-am__img { display: block; aspect-ratio: 3 / 2; border-radius: 16px; overflow: hidden; background: var(--tile); }
.cp-am__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.cp-am__card:hover .cp-am__img img { transform: scale(1.03); }
.cp-am__body { padding-top: 14px; }
.cp-svc .cp-am__tag { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--navy); margin-bottom: 6px; }
.cp-am__t { font-size: 18px; line-height: 1.3; font-weight: 600; margin: 0; text-transform: none; letter-spacing: 0; }
.cp-am__t a { color: var(--ink); text-decoration: none; }
.cp-am__t a:hover { text-decoration: underline; text-underline-offset: 3px; }
.cp-svc .cp-am__meta { margin-top: 8px; font-size: 13.5px; color: var(--mut); }
@media (max-width: 749px) {
  .cp-am__help { flex-direction: column; align-items: flex-start; padding: 20px 18px; border-radius: 16px; gap: 14px; margin-bottom: 36px; }
  .cp-am__btns { width: 100%; }
  .cp-am__btns .cp-svc__btn { flex: 1 1 auto; }
  .cp-am__head { margin-bottom: 6px; }
  .cp-am__grid { grid-template-columns: 1fr; gap: 0; }
  .cp-am__card { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 14px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line); }
  .cp-am__card:last-child { border-bottom: 0; }
  .cp-am__img { aspect-ratio: 1; border-radius: 12px; }
  .cp-am__body { padding: 0; }
  .cp-am__t { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) { .cp-am__img img { transition: none; } }

/* =====================================================================================================================
   Written for this theme: the page frame, and the sections the live shop takes from its base theme, re-created by look
   from the reference pictures and the measured values in theme-spec (no code of the base theme is used).
   ===================================================================================================================== */

/* ---------- page frame ---------- */
/* The live page container: 1520px wide at most, 20px at the sides on phones, 50px from 750px (SPEC-3 0.3). */
.page-width { max-width: 1520px; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; }
@media (min-width: 750px) { .page-width { padding-left: 50px; padding-right: 50px; } }

/* Pages whose stored layout has the breadcrumb trail switched off (About, FAQ, Brands, Birthday Club, Affiliates,
   plain pages, policies) show none on the live shop. */
.cp-no-crumbs .cp-crumbs { display: none; }

/* A page built from sections: sections run edge to edge and bring their own container. A section that has no
   designed template yet is printed plainly and gets the container here. */
.cp-page > .cp-plain-section, .cp-page > .cp-notice, .cp-page > .cp-faqs, .cp-page > h1 { max-width: 1520px; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; }
@media (min-width: 750px) { .cp-page > .cp-plain-section, .cp-page > .cp-notice, .cp-page > .cp-faqs, .cp-page > h1 { padding-left: 50px; padding-right: 50px; } }
.cp-svc a { text-underline-offset: 3px; }
.cp-svc h1, .cp-svc h2, .cp-svc h3, .cp-fold h2, .cp-fold h3, .cp-row h2, .cp-row h3, .cp-cf h2, .cp-cf h3, .cp-art h1, .cp-art h2, .cp-art h3, .cp-pg-plain h1, .cp-pg-plain h2, .cp-pg-plain h3 { text-wrap: wrap; }
/* On the live pages the shared block (cp-svc-base) is printed again before every cp-svc section, so wherever another
   such section follows, the shared padding wins over a section's own. That is so for the hero, the top of Contact and
   the top of the Birthday Club; these are the values the live pages therefore show. */
.cp-svc.cp-svc-hero, .cp-svc.cp-ct, .cp-svc.cp-bd { padding: 64px 0; }
.cp-svc .cp-svc-price__cta { font-size: 15px; }
@media (max-width: 749px) { .cp-svc.cp-svc-hero, .cp-svc.cp-ct, .cp-svc.cp-bd { padding: 40px 0; } }
.cp-svc__h2 em, .cp-row__h em, .cp-fold__h em { font-style: normal; color: #003662; }
.cp-closure--notice { background: #F7F8FA; margin: 0; padding: 16px 0; }
.cp-closure--notice .cp-closure__in { padding-left: 16px; padding-right: 16px; }
.cp-svc-visit__facts b, .cp-svc-hero__facts b { letter-spacing: 0; }

/* The live phone rule for every section heading (cp-mobile-density): 21px. */
@media (max-width: 749px) {
  .cp-svc .cp-svc__h2 { font-size: 21px; line-height: 1.22; letter-spacing: -.01em; }
}

/* The FAQ page section shares its class name with the plain question list in style.css; undo what leaks in. */
.cp-svc.cp-faq { border-bottom: 0; }
.cp-svc.cp-faq summary::after, .cp-svc.cp-faq[open] summary::after { content: none; }
.cp-svc.cp-faq summary { justify-content: space-between; color: inherit; }
.cp-svc-note summary { list-style: none; }

/* ---------- plain pages (the live "main-page" look): title and the stored body in a narrow column ---------- */
.cp-pg-plain { background: #F7F8FA; padding: 20px 0 48px; }
.cp-pg-plain__col { max-width: 1520px; margin: 0 auto; padding: 0 20px; }
.cp-pg-plain__h1 { font-size: 34px; line-height: 1.26; letter-spacing: -.009em; font-weight: 400; color: #2B333D; margin: 0 0 6px; }
.cp-rte { font-size: 13.5px; line-height: 1.45; color: #2B333D; word-break: break-word; }
.cp-rte > * + * { margin-top: 14px; }
.cp-rte h2 { font-size: 28px; line-height: 1.26; font-weight: 400; margin: 30px 0 14px; color: #2B333D; }
.cp-rte h3 { font-size: 25px; line-height: 1.26; font-weight: 400; margin: 26px 0 12px; color: #2B333D; }
.cp-rte h4 { font-size: 21.5px; line-height: 1.26; font-weight: 400; margin: 22px 0 10px; }
.cp-rte ul { list-style: disc; padding-left: 20px; }
.cp-rte ol { list-style: decimal; padding-left: 20px; }
.cp-rte li + li { margin-top: 8px; }
.cp-rte a { color: #003662; text-decoration: underline; text-underline-offset: 3px; }
.cp-rte hr { border: 0; border-top: 1px solid #E6E9EE; margin: 40px 0; }
.cp-rte img { border-radius: 16px; }
.cp-rte table { display: block; overflow-x: auto; border-collapse: collapse; }
.cp-rte th, .cp-rte td { border: 1px solid #E6E9EE; padding: 8px 10px; text-align: left; vertical-align: top; }
.cp-pg-plain .cp-faqs { margin-left: 0; }
@media (min-width: 750px) {
  .cp-pg-plain { padding: 28px 0 64px; }
  .cp-pg-plain__col { padding: 0 90px; }
  .cp-pg-plain__h1 { font-size: 42px; }
  .cp-rte { font-size: 15.5px; line-height: 1.8; }
  .cp-rte h2 { font-size: 36px; margin: 34px 0 12px; }
  .cp-rte h3 { font-size: 30px; }
  .cp-rte li + li { margin-top: 10px; }
}
@media (min-width: 990px) { .cp-pg-plain__col { max-width: 726px; padding: 0; } }
@media (min-width: 1100px) {
  .cp-pg-plain__h1 { font-size: 52px; }
  .cp-rte { font-size: 16px; }
  .cp-rte h2 { font-size: 40px; }
  .cp-rte h3 { font-size: 34px; }
}
/* The food cost calculator centres its own introduction from 860px; the live page shows the title centred with it. */
@media (min-width: 860px) { .cp-pg-plain--tool .cp-pg-plain__h1 { text-align: center; } }
.cp-pg-plain--tool .cp-rte > * + * { margin-top: 0; }

/* On phones the live shop's phone rules make every paragraph of a page body 13.5px (cp-mobile-density, "section
   text"), whatever the body's own styles say; the food cost calculator's paragraphs are sized by that rule. */
@media (max-width: 749px) { .cp-pg-plain:not(.cp-pg-policy) .cp-rte p { font-size: 13.5px !important; line-height: 1.45 !important; } }

/* ---------- policy pages: centred title, the stored body in one reading column ---------- */
.cp-pg-policy .cp-pg-plain__h1 { text-align: center; margin-bottom: 26px; }
.cp-pg-policy .cp-rte { font-size: 15px; line-height: 1.8; }
.cp-pg-policy .cp-rte > * + * { margin-top: 15px; }
.cp-pg-policy .cp-rte .rte > * + * { margin-top: 15px; }
.cp-pg-policy .cp-rte hr, .cp-pg-policy .cp-rte .rte > hr { margin: 50px 0; }
.cp-pg-policy .cp-rte h2 { font-size: 28px; margin: 0 0 20px; }
.cp-pg-policy .cp-rte li + li { margin-top: 9px; }
@media (min-width: 750px) {
  .cp-pg-policy .cp-pg-plain__col { max-width: 616px; padding: 0 20px; box-sizing: content-box; }
  .cp-pg-policy .cp-rte hr, .cp-pg-policy .cp-rte .rte > hr { margin: 70px 0; }
  .cp-pg-policy .cp-rte li + li { margin-top: 9px; }
  .cp-pg-policy .cp-pg-plain__h1 { font-size: 42px; margin-bottom: 30px; }
  .cp-pg-policy .cp-rte h2 { font-size: 36px; }
}
@media (min-width: 1100px) {
  .cp-pg-policy .cp-pg-plain__h1 { font-size: 52px; }
  .cp-pg-policy .cp-rte { font-size: 16px; }
  .cp-pg-policy .cp-rte h2 { font-size: 40px; }
}

/* ---------- fold-out questions (the live "collapsible content" section) ---------- */
.cp-fold { background: #fff; padding: 28px 0; color: #2B333D; }
.cp-fold__h { font-size: 21px; line-height: 1.22; letter-spacing: -.01em; font-weight: 400; color: #16202B; margin: 0; }
.cp-fold__text { font-size: 13.5px; line-height: 1.45; margin-top: 5px; color: #2B333D; }
.cp-fold__rows { margin-top: 8px; }
.cp-fold__row { border-bottom: 1px solid #E6E9EE; }
.cp-fold__row summary { display: flex; align-items: center; gap: 12px; padding: 16px 0; cursor: pointer; list-style: none; color: #16202B; }
.cp-fold__row summary::-webkit-details-marker { display: none; }
.cp-fold__ic { flex: 0 0 auto; width: 20px; height: 20px; color: #2B333D; }
.cp-fold__ic svg { width: 20px; height: 20px; display: block; }
.cp-fold__q { flex: 1; font-size: 16px; line-height: 1.4; font-weight: 400; letter-spacing: -.009em; margin: 0; color: #16202B; text-wrap: pretty; }
.cp-fold__chev { flex: 0 0 auto; width: 16px; height: 16px; margin: 0 4px 0 12px; color: #16202B; transition: transform .2s; }
.cp-fold__row[open] .cp-fold__chev { transform: rotate(180deg); }
.cp-fold__row.is-shutting .cp-fold__chev { transform: none; }
/* The section's own button under its heading (live: 44px tall, outlined in navy, 13px bold, 20px under the heading). */
.cp-fold__btn { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; margin: 20px 0 10px; padding: 0 20px; border-radius: 9px; background: none; box-shadow: inset 0 0 0 1px #003662; color: #003662; font-size: 13px; font-weight: 700; line-height: 1.2; text-decoration: none; }
.cp-fold__btn svg { width: 16px; height: 16px; flex: 0 0 auto; }
.cp-fold__btn:focus-visible { outline: 2px solid #003662; outline-offset: 2px; }
.cp-fold__row summary:focus-visible { outline: 2px solid #003662; outline-offset: 2px; }
.cp-fold__a { padding: 0 32px 18px 32px; font-size: 14px; line-height: 1.8; color: #2B333D; max-width: 80ch; }
.cp-fold__row--plain .cp-fold__a { padding-left: 0; }
.cp-fold__a > * + * { margin-top: 10px; }
.cp-fold__a ul { list-style: disc; padding-left: 20px; }
.cp-fold__a ol { list-style: decimal; padding-left: 20px; }
.cp-fold__a a { color: #003662; text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 750px) {
  .cp-fold { padding: 40px 0; }
  .cp-fold__h { font-size: 36px; line-height: 1.26; letter-spacing: -.009em; }
  .cp-fold__text { font-size: 15px; line-height: 1.8; margin-top: 10px; }
  .cp-fold__row summary { padding: 18px 0; }
}
@media (min-width: 990px) {
  .cp-fold--beside .cp-fold__grid { display: grid; grid-template-columns: minmax(0, 40%) minmax(0, 60%); align-items: start; }
  .cp-fold--beside .cp-fold__head { padding-right: 40px; }
  .cp-fold--beside .cp-fold__rows { margin-top: 0; }
  .cp-fold__row summary { padding: 18px 0; }
  /* Heading above the rows (the area pages): a centred column 726px wide, closer rows, a larger button
     (measured on the live picture at 1440: column 357 to 1083, rows 47px apart, button 202 x 50). */
  .cp-fold:not(.cp-fold--beside) > .cp-fold__grid { max-width: 826px; }
  .cp-fold:not(.cp-fold--beside) .cp-fold__row summary { padding: 12px 0; }
  .cp-fold:not(.cp-fold--beside) .cp-fold__a { font-size: 15px; padding-right: 60px; }
  .cp-fold:not(.cp-fold--beside) .cp-fold__btn { min-height: 50px; margin: 25px 0 21px; padding: 0 25px; font-size: 15px; }
}
@media (min-width: 1100px) { .cp-fold__h { font-size: 40px; } }

/* ---------- the row of collection cards (the live "collection list" section) ---------- */
.cp-row { background: #fff; padding: 14px 0; color: #2B333D; overflow: hidden; }
.cp-row__h { font-size: 21px; line-height: 1.22; letter-spacing: -.01em; font-weight: 400; color: #16202B; margin: 0; }
.cp-row__all { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 15px; color: #003662; text-decoration: none; }
.cp-row__all svg { width: 16px; height: 16px; }
.cp-row__list { display: flex; gap: 16px; margin: 14px -20px 0; padding: 6px 20px 26px; overflow-x: auto; scroll-padding-left: 20px; scrollbar-width: none; list-style: none; }
.cp-row__list::-webkit-scrollbar { display: none; }
.cp-row__item { flex: 0 0 78%; max-width: 300px; scroll-snap-align: start; }
.cp-row__card { display: block; text-decoration: none; color: #2B333D; }
.cp-row__img { display: block; border-radius: 20px; overflow: hidden; background: #fff; box-shadow: 0 0 1px 1px rgba(0, 15, 30, .01), 0 6px 8px 0 rgba(0, 15, 30, .03), 0 2px 4px 0 rgba(0, 15, 30, .01); }
.cp-row__img img { width: 100%; height: auto; display: block; }
.cp-row__name { display: block; margin-top: 12px; text-align: center; font-size: 17px; line-height: 1.4; color: #2B333D; }
.cp-row__card:hover .cp-row__name { color: #003662; }
.cp-row__bar { position: relative; height: 2px; margin: 12px 18px 16px; background: #D5DAE0; border-radius: 2px; }
.cp-row__bar span { position: absolute; left: 0; top: 0; height: 100%; width: 16%; background: #16202B; border-radius: 2px; }
@media (min-width: 750px) {
  .cp-row { padding: 20px 0; }
  .cp-row__h { font-size: 36px; line-height: 1.26; letter-spacing: -.009em; }
  .cp-row__list { margin: 22px -50px 0; padding: 6px 50px 26px; scroll-padding-left: 50px; }
  .cp-row__item { flex: 0 0 calc((100% - 16px * 2.6) / 3.3); max-width: none; }
  .cp-row__bar { margin: 14px 46px 20px; }
}
@media (min-width: 990px) {
  .cp-row__item { flex-basis: calc((100% - 16px * 5) / 5.12); }
  .cp-row__bar { margin-left: 66px; margin-right: 66px; }
  .cp-row__img { box-shadow: 0 0 1px 1px rgba(0, 15, 30, .01), 0 2px 7px 0 rgba(0, 15, 30, .03), 0 1px 3px 0 rgba(0, 15, 30, .01); }
}
@media (min-width: 1100px) { .cp-row__h { font-size: 40px; } }

/* ---------- a picture beside a form (the live "contact form" section) ---------- */
.cp-cf { padding: 14px 0; background: #fff; color: #2B333D; }
.cp-cf--line-bottom { border-bottom: 1px solid #E6E9EE; }
.cp-cf--line-top { border-top: 1px solid #E6E9EE; }
.cp-cf__media { border-radius: 16px; overflow: hidden; background: #EEF2F6; height: var(--cp-cf-mh, 220px); }
.cp-cf__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cp-cf__body { padding-top: 26px; }
/* The band with a white card on it (the Contact page). */
.cp-cf--card { background: #F7F8FA; padding: 28px 0; }
.cp-cf--card .cp-cf__grid-in { background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 0 1px 1px rgba(0, 15, 30, .01), 0 6px 8px 0 rgba(0, 15, 30, .03), 0 2px 4px 0 rgba(0, 15, 30, .01); }
.cp-cf--card .cp-cf__media { border-radius: 0; }
.cp-cf--card .cp-cf__body { padding: 40px; }
/* The plugin's form inside it. */
.cp-cf .cp-form-wrap { max-width: none; margin: 0; scroll-margin-top: 130px; }
.cp-cf .cp-form-wrap > h2, .cp-cf .cp-form-wrap > h3 { font-weight: 400; letter-spacing: -.009em; line-height: 1.26; color: #16202B; margin: 0 0 14px; }
.cp-cf .cp-form-wrap > h2 { font-size: 28px; }
.cp-cf .cp-form-wrap > h3 { font-size: 25px; }
.cp-cf .cp-form-wrap > .cp-prose { max-width: none; font-size: 15px; line-height: 1.8; margin-bottom: 12px; }
.cp-cf .cp-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
.cp-cf .cp-form > * { grid-column: 1 / -1; margin: 0; }
.cp-cf .cp-field { position: relative; }
.cp-cf .cp-field label { display: block; font-size: 13px; line-height: 1.3; margin: 0 0 5px; color: #2B333D; }
.cp-cf .cp-field input, .cp-cf .cp-field select, .cp-cf .cp-field textarea { display: block; width: 100%; min-height: 46px; padding: 12px 20px; border: 0; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px rgba(43, 51, 61, .35); font: inherit; font-size: 16px; line-height: 1.3; letter-spacing: .02em; color: #2B333D; -webkit-appearance: none; appearance: none; }
.cp-cf .cp-field select { padding-right: 44px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%232B333D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; background-size: 16px; cursor: pointer; }
.cp-cf .cp-field textarea { height: 102px; min-height: 102px; resize: vertical; }
/* When the browser stops the form and goes to the field that needs an answer, that field stops below the header. */
.cp-cf .cp-field input, .cp-cf .cp-field select, .cp-cf .cp-field textarea { scroll-margin-top: 150px; }
.cp-cf .cp-field input:hover, .cp-cf .cp-field select:hover, .cp-cf .cp-field textarea:hover { box-shadow: inset 0 0 0 1px #2B333D; }
.cp-cf .cp-field input:focus-visible, .cp-cf .cp-field select:focus-visible, .cp-cf .cp-field textarea:focus-visible { outline: 0; box-shadow: inset 0 0 0 2px #2B333D; }
.cp-cf .cp-form hr { border: 0; border-top: 1px solid #E6E9EE; margin: 0; height: 0; }
.cp-cf .cp-form .cp-btn { min-height: 0; padding: 1.1em 1.6em; border: 1px solid #D9480F; border-radius: 8px; background: #D9480F; color: #fff; font-size: 15px; font-weight: 700; line-height: 1.2; letter-spacing: .005em; }
.cp-cf .cp-form .cp-btn:hover { background: #BF3F0C; border-color: #BF3F0C; box-shadow: none; }
.cp-cf .cp-form__ok { margin-bottom: 12px; }
.cp-cf .cp-form__errors { margin-bottom: 12px; }
/* With script, labels sit inside their field as on the live form and move to its top edge when it is in use. */
.cp-cf.is-float .cp-field label { position: absolute; left: 14px; top: 13px; z-index: 1; max-width: calc(100% - 56px); margin: 0; padding: 0 6px; font-size: 16px; line-height: 1.3; letter-spacing: .02em; color: rgba(43, 51, 61, .75); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; transition: top .1s, font-size .1s; }
.cp-cf.is-float .cp-field.is-up label, .cp-cf.is-float .cp-field:focus-within label { top: -6px; font-size: 10px; line-height: 1.2; background: #fff; color: #2B333D; }
/* A list shows its own first line (the question, with a star when it must be answered) and then the answer, in
   the softer ink; its label is kept for screen readers only. Measured on the live form, 6 Oct 2026. */
.cp-cf .cp-field--list select { color: rgba(43, 51, 61, .75); }
.cp-cf .cp-field--list select option { color: #2B333D; }
.cp-cf.is-float .cp-field--list label { top: 0; left: 0; width: 1px; height: 1px; max-width: none; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; transition: none; }
/* On wider screens the list is drawn by the page (js/pages.js), over the browser's own, which stays in place
   unseen so that sending the form and the browser's "please choose" message still work.
   Live values: field 45px tall; list 4px under it, 1px in from each side, white, 1px line, 6px corners, at most
   350px tall; lines 40px, 8px 24px padding, 16px; the chosen line bold on a 5% black wash; the same wash under the mouse. */
.cp-cf .cp-field.has-pick select { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; }
.cp-pick { display: block; position: relative; }
.cp-pick__btn { display: flex; align-items: center; min-height: 46px; padding: 12px 44px 12px 20px; border-radius: 8px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%232B333D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E") no-repeat right 16px center / 16px; box-shadow: inset 0 0 0 1px rgba(43, 51, 61, .35); font-size: 16px; line-height: 1.3; letter-spacing: .02em; color: rgba(43, 51, 61, .75); cursor: pointer; -webkit-user-select: none; user-select: none; }
.cp-pick__btn:hover, .cp-pick.is-open .cp-pick__btn { box-shadow: inset 0 0 0 1px #2B333D; }
.cp-pick__btn:focus-visible { outline: 0; box-shadow: inset 0 0 0 2px #2B333D; }
.cp-pick__cur { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cp-pick__list { display: block; position: absolute; z-index: 9; left: 1px; right: 1px; top: calc(100% + 4px); max-height: 350px; padding: 5px 0; overflow-y: auto; background: #fff; border: 1px solid rgba(43, 51, 61, .35); border-radius: 6px; }
.cp-pick__list[hidden] { display: none; }
.cp-pick__opt { display: block; min-height: 40px; padding: 8px 24px; font-size: 16px; line-height: 24px; letter-spacing: .02em; color: rgba(43, 51, 61, .75); cursor: pointer; }
.cp-pick__opt:hover, .cp-pick__opt.is-at { background: rgba(0, 0, 0, .05); }
.cp-pick__opt[aria-selected="true"] { font-weight: 700; }
/* A date that has passed: the field is emptied and says why underneath (live: 13px, 11px under the field, a red mark). */
.cp-field__error { display: flex; align-items: center; gap: 8px; margin-top: 11px; font-size: 13px; line-height: 1.4; letter-spacing: 0; color: #2B333D; }
.cp-field__error[hidden] { display: none; }
.cp-field__error svg { flex: 0 0 auto; color: #FF0000; }
.cp-cf .cp-form > .cp-cf__note { font-size: 15px; line-height: 1.8; }
.cp-cf .cp-form > .cp-cf__note--small { font-size: 12px; line-height: 1.6; }
@media (min-width: 750px) {
  .cp-cf { padding: 20px 0; }
  .cp-cf .cp-form { gap: 20px; margin-top: 20px; }
  .cp-cf .cp-field--half { grid-column: span 1; }
  .cp-cf .cp-form .cp-btn { padding: 1.2em 2.2em; }
  .cp-cf .cp-form-wrap > h2 { font-size: 36px; }
  .cp-cf .cp-form-wrap > h3 { font-size: 30px; }
  .cp-cf--card { padding: 40px 0; }
}
@media (min-width: 990px) {
  .cp-cf__grid-in { display: grid; grid-template-columns: minmax(0, var(--cp-cf-mw, 44%)) minmax(0, 1fr); align-items: stretch; }
  .cp-cf__media { height: auto; min-height: var(--cp-cf-dh, 500px); border-radius: 24px; position: relative; }
  .cp-cf__media img { position: absolute; inset: 0; }
  .cp-cf__body { padding: 60px 70px 50px; align-self: center; }
  .cp-cf--card .cp-cf__body { padding: 60px 70px; }
  .cp-cf .cp-field input, .cp-cf .cp-field select, .cp-cf .cp-field textarea { font-size: 15px; }
  .cp-cf.is-float .cp-field label { font-size: 15px; }
  .cp-pick__btn { font-size: 15px; }
}
@media (min-width: 1100px) {
  .cp-cf .cp-form-wrap > h2 { font-size: 40px; }
  .cp-cf .cp-form-wrap > h3 { font-size: 34px; }
}

/* ---------- Birthday Club and affiliate pages: the plugin's box, dressed as the live sections' box ---------- */
.cp-club .cp-club__join { max-width: none; margin-top: 48px; padding: 32px; background: #F7F8FA; border-radius: 24px; scroll-margin-top: 130px; display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 24px; align-items: center; }
.cp-club .cp-club__join > * { grid-column: 1; }
.cp-club .cp-club__join > h2, .cp-club .cp-club__join [role="status"] h2 { font-size: 26px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: #16202B; margin: 0; }
.cp-club .cp-club__join > p, .cp-club .cp-club__join [role="status"] p { margin-top: 8px; color: #6B7280; max-width: 62ch; }
.cp-club .cp-club__join > p:has(> .cp-btn) { grid-column: 2; grid-row: 1 / span 2; margin: 0; max-width: none; }
.cp-club .cp-club__join .cp-btn { min-height: 48px; padding: 0 22px; border-radius: 12px; border: 1.5px solid #D9480F; background: #D9480F; color: #fff; font-size: 15px; font-weight: 600; letter-spacing: 0; line-height: 1.2; white-space: nowrap; }
.cp-club .cp-club__join .cp-btn:hover { background: #BF3F0C; border-color: #BF3F0C; box-shadow: none; }
.cp-club .cp-club__join .cp-form { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 22px; }
.cp-club.cp-af .cp-club__join .cp-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cp-club .cp-club__join .cp-form > * { grid-column: 1 / -1; margin: 0; }
.cp-club .cp-club__join .cp-form > .cp-field { grid-column: span 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; border: 0; padding: 0; }
.cp-club .cp-club__join .cp-form > .cp-club__agree { grid-column: 1 / -1; }
.cp-club .cp-field label, .cp-club .cp-field legend { font-size: 13px; font-weight: 600; color: #16202B; margin: 0; padding: 0; }
.cp-club .cp-field input:not([type="checkbox"]), .cp-club .cp-field select { height: 48px; min-height: 0; width: 100%; padding: 0 14px; border: 1.5px solid #C9D3DE; border-radius: 12px; background: #fff; font: inherit; font-size: 16px; color: #16202B; box-shadow: none; }
.cp-club .cp-field input:not([type="checkbox"]):focus, .cp-club .cp-field select:focus { outline: 0; border-color: #003662; box-shadow: 0 0 0 3px rgba(0, 54, 98, .12); }
.cp-club .cp-club__date { display: grid !important; grid-template-columns: 1fr 1.5fr; gap: 6px 8px; }
.cp-club .cp-club__date legend { grid-column: 1 / -1; float: left; width: 100%; }
.cp-club .cp-club__date select { min-width: 0; width: 100%; }
.cp-club .cp-club__agree label { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; font-weight: 400; line-height: 1.5; color: #2B333D; }
.cp-club .cp-club__agree input { width: 18px; height: 18px; margin: 2px 0 0; flex: 0 0 auto; accent-color: #003662; }
.cp-club .cp-club__agree a { color: #003662; font-weight: 600; }
.cp-club .cp-club__note { padding: 12px 14px; border-radius: 12px; background: #FBF3E1; border: 1px solid #EBD9A8; font-size: 14.5px; color: #2B333D; }
.cp-club .cp-club__small { margin-top: 12px; font-size: 13px; color: #6B7280; max-width: 70ch; }
.cp-club .cp-form__errors { grid-column: 1 / -1; margin-top: 12px; color: #B42318; font-weight: 600; border: 0; padding: 0; }
.cp-club .cp-club__label { display: block; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #6B7280; }
.cp-club .cp-club__out { font-size: 18px; font-weight: 600; color: #16202B; word-break: break-all; }
/* The small print under the box (Birthday Club terms). */
.cp-club .page-width > .cp-club__small { margin-top: 24px; font-size: 14px; line-height: 1.6; color: #6B7280; max-width: 80ch; }
.cp-club .page-width > .cp-club__small p { margin: 0 0 8px; }
.cp-club .page-width > .cp-club__small ul { margin: 0; padding-left: 18px; list-style: disc; }
.cp-club .page-width > .cp-club__small a { color: #003662; }
@media (max-width: 989px) {
  .cp-club .cp-club__join .cp-form, .cp-club.cp-af .cp-club__join .cp-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 749px) {
  .cp-club .cp-club__join { margin-top: 28px; padding: 20px 18px; border-radius: 16px; grid-template-columns: 1fr; }
  .cp-club .cp-club__join > h2, .cp-club .cp-club__join [role="status"] h2 { font-size: 22px; }
  .cp-club .cp-club__join > p:has(> .cp-btn) { grid-column: 1; grid-row: auto; margin-top: 16px; }
  .cp-club .cp-club__join .cp-btn { width: 100%; padding: 0 16px; font-size: 14.5px; }
  .cp-club .cp-club__join .cp-form, .cp-club.cp-af .cp-club__join .cp-form { grid-template-columns: 1fr; gap: 14px; margin-top: 18px; }
}

/* ---------- the blog list ---------- */
.cp-is-blog .cp-crumbs { background: #fff; }
.cp-blog .cp-postlist.cp-blog__grid { list-style: none; margin: 0; padding: 0; }
.cp-blog .cp-postlist > li { padding-block: 0; border-bottom: 0; }
.cp-blog .cp-postlist a { color: inherit; }
.cp-blog__t a { color: inherit; text-decoration: none; }
.cp-blog .cp-blog__more { color: #003662; }
.cp-blog__pager { text-align: center; }
.cp-blog__pager a, .cp-blog__pager .cp-svc__btn--ghost { display: inline-flex; min-height: 44px; padding: 0 18px; border: 0; background: none; color: #003662; font-size: 15px; font-weight: 700; }
.cp-blog__pager a:hover { background: none; }
.cp-blog .cp-postlist .cp-blog__t a:hover { color: #003662; }
@media (max-width: 749px) {
  .cp-blog .cp-postlist > li.cp-blog__card { padding: 16px 0; border-bottom: 1px solid #E6E9EE; }
  .cp-blog .cp-postlist > li.cp-blog__card--feature { padding: 0 0 22px; }
}
@media (prefers-reduced-motion: reduce) { .cp-blog__img img { transition: none; } }
/* A plain product row, used only until the designed featured-collection template exists. */
.cp-pg-row { background: #F7F8FA; padding: 28px 0; }
.cp-pg-row__h { font-size: 21px; font-weight: 400; margin: 0 0 14px; }
.cp-pg-row__h em { font-style: normal; color: #003662; }

/* ---------- the article ---------- */
.cp-art { background: #fff; padding: 28px 0 0; color: #2B333D; }
.cp-art__col { max-width: 760px; margin: 0 auto; padding: 0 16px; }
.cp-art__col--image { max-width: 980px; }
.cp-art__title { font-size: 30px; line-height: 1.15; font-weight: 400; letter-spacing: -.02em; color: #16202B; margin: 0; }
.cp-art__excerpt { margin-top: 20px; font-size: 17px; line-height: 1.8; color: #6B7280; }
.cp-art__rule { border: 0; border-top: 1px solid #E6E9EE; margin: 40px 0 24px; }
.cp-art__rule--end { margin: 24px 0; }
.cp-art__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 9px 24px; }
.cp-art__by { font-size: 12px; line-height: 1.5; letter-spacing: .06em; text-transform: uppercase; color: #2B333D; }
.cp-art__when { margin-top: 8px; font-size: 12px; line-height: 1.5; letter-spacing: .06em; text-transform: uppercase; color: #6B7280; }
.cp-art__share { display: flex; flex-wrap: wrap; align-items: center; gap: 0; list-style: none; margin: 0 0 0 -7px; padding: 0; }
.cp-art__share a, .cp-art__share button { position: relative; display: grid; place-items: center; width: 34.5px; height: 34px; border: 0; border-radius: 8px; background: none; color: #16202B; cursor: pointer; padding: 0; }
.cp-art__share svg { width: 25px; height: 25px; }
/* The share box (live: a white box under the icons, 47px tall, holding the address and a 44px "copy" button; after
   copying, the words "Link copied to clipboard" and a close button). On the live page the box hangs from the icon
   and runs off a phone screen; here it hangs from the row of icons so it always stays on the screen. */
.cp-art__share { position: relative; }
.cp-art__sharepanel { position: absolute; z-index: 5; left: 7px; top: 100%; display: flex; align-items: center; width: max-content; max-width: min(310px, calc(100vw - 40px)); height: 47px; padding: 1px; background: #fff; border-radius: 8px; box-shadow: inset 0 0 0 1px rgba(43, 51, 61, .35); }
.cp-art__sharepanel[hidden], .cp-art__sharepanel [hidden] { display: none; }
.cp-art__sharepanel input { flex: 1 1 auto; min-width: 0; width: 264px; height: 45px; padding: 0 0 0 20px; border: 0; border-radius: 8px; background: none; font: inherit; font-size: 16px; letter-spacing: .02em; color: #2B333D; text-overflow: ellipsis; }
.cp-art__sharepanel input:focus-visible { outline: 0; }
.cp-art__share .cp-art__sharepanel button { flex: 0 0 44px; width: 44px; height: 44px; }
.cp-art__copied { display: flex; align-items: center; height: 45px; padding: 0 6px 0 15px; white-space: nowrap; font-size: 16px; letter-spacing: .02em; color: #2B333D; }
.cp-art__media { margin: 33px 0 42px; border-radius: 16px; overflow: hidden; background: #EEF2F6; aspect-ratio: 16 / 9; }
.cp-art__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cp-art__content { font-size: 16.5px; line-height: 1.7; color: #2B333D; word-break: break-word; }
.cp-art__content p { margin: 0 0 1.15em; }
.cp-art__content h2 { font-size: 32px; line-height: 1.25; font-weight: 500; letter-spacing: -.01em; color: #16202B; margin: 1.9em 0 .6em; }
.cp-art__content h3 { font-size: 19px; line-height: 1.3; font-weight: 600; color: #16202B; margin: 1.6em 0 .5em; }
.cp-art__content a { color: #003662; text-decoration: underline; text-underline-offset: 3px; }
.cp-art__content ul, .cp-art__content ol { margin: 0 0 1.15em; padding-left: 1.3em; }
.cp-art__content ul { list-style: disc; }
.cp-art__content ol { list-style: decimal; }
.cp-art__content li { margin: 0 0 .6em; }
.cp-art__content img { border-radius: 16px; height: auto; max-width: 100%; }
.cp-art__content figure { margin: 1.4em 0; }
.cp-art__content figcaption { margin-top: 8px; font-size: 13.5px; color: #6B7280; }
.cp-art__content blockquote { margin: 1.4em 0; padding: 4px 0 4px 18px; border-left: 3px solid #C49430; color: #16202B; font-size: 19px; }
.cp-art__content table { width: 100%; border-collapse: collapse; font-size: 15.5px; display: block; overflow-x: auto; }
.cp-art__content th, .cp-art__content td { border: 1px solid #E6E9EE; padding: 10px 12px; text-align: left; vertical-align: top; }
.cp-art__content th { background: #F7F8FA; font-weight: 600; }
.cp-art__content details { border-bottom: 1px solid #E6E9EE; }
.cp-art__content summary { cursor: pointer; padding: 12px 0; font-weight: 600; color: #16202B; }
.cp-art__end { border: 0; border-top: 1px solid #E6E9EE; margin: 0; }
.cp-art-more-wrap { background: #fff; }
@media (min-width: 750px) {
  .cp-art { padding-top: 40px; }
  .cp-art__col { padding: 0 20px; box-sizing: content-box; }
  .cp-art__title { font-size: 42px; }
  .cp-art__excerpt { font-size: 19px; }
  .cp-art__media { border-radius: 24px; margin: 44px 0 40px; }
  .cp-art__when { margin-top: 9px; }
  .cp-art__content { font-size: 17.5px; line-height: 1.75; }
  .cp-art__content h3 { font-size: 21px; }
  .cp-art__share { margin-left: 0; margin-right: -5px; }
  .cp-art__meta { align-items: flex-start; }
  .cp-art__meta .cp-art__share { margin-top: -8px; }
  .cp-art__sharepanel input, .cp-art__copied { font-size: 15px; }
}

/* ---------- less motion where the visitor asks for it ---------- */
@media (prefers-reduced-motion: reduce) {
  .cp-fold__chev, .cp-cf.is-float .cp-field label, .cp-am__img img, .cp-blog__img img, .cp-svc-tile__img img { transition: none !important; }
}

/* R-091 topic blocks, "Lead and list" (mockups/topic-blocks-2026-10-19/): under a pillar's articles and on its collections.
   Phone first: the lead's picture full width, then rows of a small square picture and the title. No label above titles,
   no dates; the whole item is the link. On a collection the lead picture is smaller (the products are that page's job). */
.cp-tb-band { background: var(--cp-white); padding: 40px 0 8px; }
.cp-tb { color: var(--cp-heading); }
.cp-tb__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 0 0 16px; }
.cp-tb__h { font-size: 24px; line-height: 1.2; font-weight: 400; letter-spacing: -.01em; color: var(--cp-heading); margin: 0; text-transform: none; }
.cp-tb__all { color: var(--cp-navy); font-weight: 600; font-size: 14px; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; min-height: 44px; }
.cp-tb__all:hover { text-decoration: underline; text-underline-offset: 3px; }
.cp-tb__all svg { width: 16px; height: 16px; flex: 0 0 auto; }
.cp-tb a { color: inherit; text-decoration: none; }
.cp-tb a:focus-visible { outline: 2px solid var(--cp-navy); outline-offset: 3px; border-radius: var(--cp-radius-panel); }
.cp-tb__pic { display: block; overflow: hidden; border-radius: var(--cp-radius-panel); background: var(--cp-mist-deep); }
.cp-tb__pic img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s cubic-bezier(.16, 1, .3, 1); }
.cp-tb a:hover .cp-tb__pic img { transform: scale(1.03); }
.cp-tb a:hover .cp-tb__t { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.cp-tb__t { font-size: 15.5px; line-height: 1.3; font-weight: 600; color: var(--cp-heading); margin: 0; text-transform: none; letter-spacing: 0; text-wrap: balance; }
.cp-tb__min { font-size: 13px; line-height: 1.4; color: var(--cp-caption); margin: 4px 0 0; }
.cp-tb__lead { display: block; }
.cp-tb__lead .cp-tb__pic { aspect-ratio: 16 / 9; }
.cp-tb--collection .cp-tb__lead .cp-tb__pic { aspect-ratio: 2 / 1; }
.cp-tb__lead .cp-tb__t { font-size: 19px; margin-top: 12px; }
.cp-tb__sum { font-size: 15px; line-height: 1.5; color: var(--cp-text); margin: 6px 0 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cp-tb__list { list-style: none; margin: 8px 0 0; padding: 0; }
.cp-tb__row { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px 0; border-top: 1px solid var(--cp-line); }
.cp-tb__row .cp-tb__pic { aspect-ratio: 1; border-radius: 10px; }
@media (min-width: 900px) {
	.cp-tb-band { padding-top: 56px; }
	.cp-tb__h { font-size: 30px; }
	.cp-tb__grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 40px; align-items: start; }
	.cp-tb--collection .cp-tb__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.cp-tb__lead .cp-tb__pic, .cp-tb--collection .cp-tb__lead .cp-tb__pic { aspect-ratio: 2 / 1; }
	.cp-tb__lead .cp-tb__t { font-size: 24px; margin-top: 16px; }
	.cp-tb__list { margin: 0; }
	.cp-tb__list li:first-child .cp-tb__row { border-top: 0; padding-top: 0; }
	.cp-tb__row { grid-template-columns: 120px minmax(0, 1fr); gap: 18px; padding: 16px 0; }
	.cp-tb__row .cp-tb__pic { aspect-ratio: 4 / 3; }
	.cp-tb__t { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) { .cp-tb__pic img { transition: none; } }

/* R-094 the named author, text only (his "Option 2", 19 Oct 2026 22:53; mockups/author-2026-10-20/): the name in semi-bold
   with the role after it under the title; a light panel at the end of the article, no photo. */
.cp-art__by--named { font-size: 14.5px; line-height: 1.45; letter-spacing: 0; text-transform: none; }
.cp-art__by strong { font-weight: 600; color: var(--cp-heading); }
.cp-art__role { color: var(--cp-caption); }
.cp-art__author { margin: 40px 0 8px; padding: 20px 20px 18px; background: var(--cp-mist); border-radius: var(--cp-radius-panel); }
.cp-art__author-h { margin: 0 0 10px; font-size: 20px; line-height: 1.25; font-weight: 400; letter-spacing: -.01em; color: var(--cp-heading); text-transform: none; }
.cp-art__author-name { margin: 0; font-size: 18px; line-height: 1.3; font-weight: 600; color: var(--cp-heading); }
.cp-art__author-role { margin: 2px 0 0; font-size: 13px; color: var(--cp-caption); }
.cp-art__author-bio { margin: 8px 0 0; font-size: 15px; line-height: 1.55; color: var(--cp-text); max-width: 62ch; }
.cp-art__author-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; min-height: 44px; font-size: 14px; font-weight: 600; color: var(--cp-navy); text-decoration: none; }
.cp-art__author-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.cp-art__author-link svg { width: 16px; height: 16px; }
.cp-art__author-link:focus-visible { outline: 2px solid var(--cp-navy); outline-offset: 3px; border-radius: 6px; }
@media (min-width: 900px) { .cp-art__author { padding: 24px 28px; } }

/* ---------- the affiliate page (W12, 27 Oct 2026; mockups/website-2026-10-27/affiliates-faq.html): the title and one
   line, the join box beside six numbers, then ten questions that fold open. Everything here is under .cp-afq, so the
   Birthday Club box (.cp-club) and the other fold-outs (.cp-fold) look exactly as before. ---------- */
.cp-svc.cp-afq { padding: 18px 0 32px; }
.cp-afq__in { max-width: 1040px; margin: 0 auto; padding: 0 16px; }
.cp-afq__hd { margin: 0 0 14px; }
.cp-afq .cp-afq__h1 { margin: 0; font-size: 24px; line-height: 1.25; font-weight: 700; letter-spacing: -.015em; color: var(--ink); text-transform: none; }
.cp-afq .cp-afq__sub { margin: 4px 0 0; font-size: 14px; line-height: 1.5; color: var(--mut); }
/* the join box, printed by the plugin */
.cp-afq .cp-club__join { min-width: 0; max-width: none; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: #fff; scroll-margin-top: 130px; }
.cp-afq .cp-club__join h2 { margin: 0 0 4px; font-size: 18px; line-height: 1.3; font-weight: 700; letter-spacing: -.01em; color: var(--ink); text-transform: none; }
.cp-afq .cp-club__join > p { margin: 0 0 12px; font-size: 14px; line-height: 1.5; color: var(--txt); }
.cp-afq .cp-club__join > p:last-child { margin-bottom: 0; }
.cp-afq .cp-club__join [role="status"] { margin: 0 0 14px; padding: 12px 14px; border-radius: 12px; background: var(--mist); }
.cp-afq .cp-club__join [role="status"] p { margin: 2px 0 0; font-size: 14px; color: var(--txt); }
.cp-afq .cp-club__terms a, .cp-afq .cp-club__tick a { color: var(--navy); font-weight: 600; text-decoration: underline; }
.cp-afq .cp-club__join .cp-btn { display: inline-flex; width: 100%; min-height: 44px; padding: 0 20px; border-radius: 8px; font-size: 14.5px; font-weight: 600; letter-spacing: 0; white-space: nowrap; }
.cp-afq .cp-club__join .cp-btn[disabled] { opacity: .45; cursor: not-allowed; }
.cp-afq .cp-club__join .cp-btn:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; }
.cp-afq .cp-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin: 0; }
.cp-afq .cp-form > * { margin: 0; }
.cp-afq .cp-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cp-afq .cp-field label { font-size: 13px; line-height: 1.3; font-weight: 600; color: var(--ink); }
.cp-afq .cp-field input, .cp-afq .cp-field select { width: 100%; height: 46px; padding: 0 14px; border: 1px solid #C9D3DE; border-radius: 10px; background-color: #fff; font: inherit; font-size: 16px; color: var(--ink); box-shadow: none; }
.cp-afq .cp-field input::placeholder { color: var(--mut); opacity: 1; }
.cp-afq .cp-field input:focus, .cp-afq .cp-field select:focus { outline: 0; border-color: var(--navy); box-shadow: 0 0 0 3px rgba(0, 54, 98, .12); }
.cp-afq .cp-club__note { padding: 10px 12px; border: 1px solid #EBD9A8; border-radius: 10px; background: #FBF3E1; font-size: 13.5px; color: var(--txt); }
.cp-afq .cp-club__note[hidden] { display: none; }
.cp-afq .cp-club__tick { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.45; color: var(--txt); }
.cp-afq .cp-club__tick input { -webkit-appearance: none; appearance: none; flex: 0 0 auto; width: 20px; height: 20px; margin: 0; border: 1.5px solid #B9C1CC; border-radius: 4px; background: #fff; cursor: pointer; }
.cp-afq .cp-club__tick input:checked { border-color: var(--navy); background: var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E") center / 14px no-repeat; }
.cp-afq .cp-club__tick input:disabled { cursor: default; }
.cp-afq .cp-club__tick input:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; }
.cp-afq .cp-club__tick label { padding-top: 1px; cursor: pointer; }
.cp-afq .cp-club__tick input:disabled + label { cursor: default; }
.cp-afq .cp-club__go { margin-top: 4px; }
.cp-afq .cp-club__sendto { font-size: 12.5px; line-height: 1.5; color: var(--mut); }
.cp-afq .cp-club__sendto b { font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.cp-afq .cp-form__errors { padding: 0; border: 0; font-size: 14px; font-weight: 600; color: #B42318; }
/* an affiliate: their code, link and figures (the figures' own styles come with the plugin) */
.cp-afq .cp-club__label { display: block; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }
.cp-afq .cp-club__out { font-size: 17px; font-weight: 600; color: var(--ink); word-break: break-all; }
.cp-afq .cp-club__join .cp-chip { min-height: 36px; margin-left: 6px; font: inherit; font-size: 13px; font-weight: 600; color: var(--navy); cursor: pointer; }
.cp-afq .cp-club__join .cp-aff { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); color: #1F2937; }
/* the six numbers */
.cp-afq__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 22px 0 6px; padding: 0; list-style: none; }
.cp-afq__fact { padding: 12px; border-radius: 12px; background: var(--mist); }
.cp-afq__fact b { display: block; font-size: 22px; line-height: 1.25; font-weight: 700; letter-spacing: -.02em; color: var(--navy); }
.cp-afq__fact span { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.35; color: var(--txt); }
/* the ten questions */
.cp-afq__qs { margin-top: 28px; }
.cp-afq .cp-afq__qt { margin: 0 0 12px; font-size: 19px; line-height: 1.25; font-weight: 700; letter-spacing: -.01em; color: var(--ink); text-transform: none; }
.cp-afq__list { border-top: 1px solid var(--line); }
.cp-afq__q { border-bottom: 1px solid var(--line); }
.cp-afq__q > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 2px; list-style: none; cursor: pointer; font-size: 15px; line-height: 1.4; font-weight: 600; color: var(--ink); }
.cp-afq__q > summary::-webkit-details-marker { display: none; }
.cp-afq__q > summary::marker { content: ""; }
.cp-afq__q > summary:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; border-radius: 4px; }
.cp-afq__pm { flex: 0 0 auto; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 14px; background: var(--mist); color: var(--navy); }
.cp-afq__pm svg { display: block; }
.cp-afq__q[open] .cp-afq__p, .cp-afq__q:not([open]) .cp-afq__m, .cp-afq__q.is-shutting .cp-afq__m { display: none; }
.cp-afq__q.is-shutting .cp-afq__p { display: block; }
.cp-afq__a { max-width: 75ch; padding: 0 2px 16px; font-size: 14.5px; line-height: 1.6; color: var(--txt); }
.cp-afq__a p { margin: 0; }
.cp-afq__num { font-weight: 700; color: var(--ink); }
@media (min-width: 600px) { .cp-afq__facts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 750px) { .cp-afq__in { padding: 0 32px; } }
@media (min-width: 990px) {
  .cp-svc.cp-afq { padding: 40px 0 60px; }
  .cp-afq__in { padding: 0 40px; }
  .cp-afq__hd { margin-bottom: 16px; }
  .cp-afq .cp-afq__h1 { font-size: 34px; line-height: 1.2; }
  .cp-afq .cp-afq__sub { font-size: 16px; }
  .cp-afq__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; align-items: start; }
  .cp-afq__facts { margin: 0; }
  .cp-afq--mine .cp-afq__top { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .cp-afq--mine .cp-afq__facts { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .cp-afq .cp-form { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; }
  .cp-afq .cp-form > * { grid-column: 1 / -1; }
  .cp-afq .cp-form > .cp-field:not(.cp-field--wide) { grid-column: span 1; }
  .cp-afq .cp-field input, .cp-afq .cp-field select { font-size: 15px; }
  .cp-afq .cp-club__join .cp-btn { width: auto; }
  .cp-afq__qs { margin-top: 44px; }
  .cp-afq .cp-afq__qt { margin-bottom: 18px; font-size: 26px; }
  .cp-afq__q > summary { padding: 18px 2px; font-size: 16.5px; }
  .cp-afq__a { font-size: 15.5px; }
}
@media (prefers-reduced-motion: reduce) { .cp-afq * { transition: none !important; } }