/* ==========================================================================
   Caldwell Psychic theme layer.
   Every colour/font below reads an Elementor Site Settings global
   (--e-global-*), with the original value only as a fallback. Change a
   Global Color or Global Font and the header, footer and blog follow.
   ========================================================================== */

:root {
  --cp-heading: var(--e-global-color-primary, #F6EFFF);
  --cp-violet: var(--e-global-color-secondary, #4B2A6B);
  --cp-text: var(--e-global-color-text, #C4B0DC);
  --cp-gold: var(--e-global-color-accent, #E3C98A);
  --cp-night: var(--e-global-color-cp_night, #150A22);
  --cp-deep: var(--e-global-color-cp_deep, #0E0517);
  --cp-abyss: var(--e-global-color-cp_abyss, #0C0415);
  --cp-plum: var(--e-global-color-cp_plum, #3A1B58);
  --cp-violet-dark: var(--e-global-color-cp_violet_dark, #241038);
  --cp-panel: var(--e-global-color-cp_panel, rgba(30, 16, 48, .7));
  --cp-line: var(--e-global-color-cp_line, rgba(227, 201, 138, .16));
  --cp-line-strong: var(--e-global-color-cp_line_strong, rgba(227, 201, 138, .45));
  --cp-gold-light: var(--e-global-color-cp_gold_light, #F4E3B8);
  --cp-gold-deep: var(--e-global-color-cp_gold_deep, #C9A45E);
  --cp-on-gold: var(--e-global-color-cp_on_gold, #1B0C2B);
  --cp-body: var(--e-global-color-cp_body, #EDE4F7);
  --cp-muted: var(--e-global-color-cp_muted, #B6A2CF);
  --cp-subtle: var(--e-global-color-cp_subtle, #A992C4);
  --cp-nav: var(--e-global-color-cp_nav, #CDBBE4);

  --cp-font-display: var(--e-global-typography-cp_display-font-family, "Cormorant Garamond"), Georgia, serif;
  --cp-font-heading: var(--e-global-typography-primary-font-family, "Cormorant Garamond"), Georgia, serif;
  --cp-font-body: var(--e-global-typography-text-font-family, "Karla"), system-ui, sans-serif;
  --cp-wrap: 1240px;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }

body.cp-theme {
  margin: 0;
  /* clip, not hidden: keeps the sticky header working while stopping the
     off-canvas menu panel from widening the document on phones. */
  overflow-x: clip;
  max-width: 100%;
  color: var(--cp-text);
  font-family: var(--cp-font-body);
  font-size: 17px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  background-color: var(--cp-night);
  background-image:
    radial-gradient(1200px 700px at 78% -10%, var(--cp-plum) 0%, transparent 60%),
    radial-gradient(900px 600px at 0% 30%, var(--cp-violet-dark) 0%, transparent 55%);
  background-repeat: no-repeat;
}

a { color: var(--cp-gold); text-decoration: none; }
a:hover, a:focus-visible { color: var(--cp-gold-light); }
:focus-visible { outline: 2px solid var(--cp-gold); outline-offset: 3px; }
::selection { background: var(--cp-violet); color: #fff; }
img { max-width: 100%; height: auto; }

.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }
.skip-link:focus { clip: auto; clip-path: none; height: auto; width: auto; left: 12px; top: 12px; z-index: 100; padding: 10px 16px; background: var(--cp-gold); color: var(--cp-on-gold); border-radius: 8px; }

.cp-wrap { max-width: var(--cp-wrap); margin: 0 auto; padding: 0 24px; }
.cp-eyebrow { margin: 0 0 14px; font-size: 12.5px; letter-spacing: .28em; text-transform: uppercase; color: var(--cp-gold); font-family: var(--cp-font-body); }
.cp-display { margin: 0; font-family: var(--cp-font-display); font-weight: 300; font-size: clamp(40px, 5vw, 70px); line-height: 1.05; color: var(--cp-heading); }
.cp-h2 { margin: 0 0 28px; font-family: var(--cp-font-heading); font-weight: 300; font-size: clamp(30px, 3.2vw, 44px); color: var(--cp-heading); }
.cp-lead { margin: 22px 0 0; max-width: 640px; font-size: 18px; line-height: 1.75; color: var(--cp-text); }
.cp-link-caps { font-size: 13.5px; letter-spacing: .08em; text-transform: uppercase; }

/* ---------------------------------------------------------------- top bar */
.cp-topbar { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; padding: 9px 24px; background: var(--cp-deep); border-bottom: 1px solid var(--cp-line); font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--cp-subtle); }
.cp-topbar__dot { color: var(--cp-violet); }
@media (max-width: 640px) { .cp-topbar__dot, .cp-topbar span:first-child { display: none; } }

/* ----------------------------------------------------------------- header */
.cp-header { position: sticky; top: 0; z-index: 50; background: color-mix(in srgb, var(--cp-night) 88%, transparent); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom: 1px solid var(--cp-line); }
.admin-bar .cp-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .cp-header { top: 46px; } }
.cp-header__inner { max-width: var(--cp-wrap); margin: 0 auto; padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.cp-logo { display: inline-flex; align-items: center; gap: 12px; color: var(--cp-body); }
.cp-logo:hover { color: var(--cp-heading); }
.cp-logo__mark { width: 34px; height: 34px; border: 1px solid var(--cp-gold); border-radius: 50%; display: grid; place-items: center; color: var(--cp-gold); font-family: var(--cp-font-heading); font-size: 19px; }
.cp-logo__text { font-family: var(--cp-font-heading); font-size: 23px; letter-spacing: .06em; }
.custom-logo { max-height: 52px; width: auto; }

.cp-nav { display: flex; align-items: center; gap: 18px; }
.cp-menu, .cp-menu ul { list-style: none; margin: 0; padding: 0; }
.cp-menu { display: flex; align-items: center; gap: 4px 18px; flex-wrap: wrap; justify-content: flex-end; }
.cp-menu > li { position: relative; }
.cp-menu a { display: block; padding: 6px 0; font-size: 13.5px; letter-spacing: .03em; color: var(--cp-nav); white-space: nowrap; }
.cp-menu a:hover, .cp-menu .current-menu-item > a, .cp-menu .current-menu-ancestor > a, .cp-menu .current_page_item > a { color: var(--cp-gold); }
.cp-menu .sub-menu { position: absolute; top: 100%; left: -16px; min-width: 250px; padding: 10px; background: var(--cp-deep); border: 1px solid var(--cp-line); border-radius: 14px; box-shadow: 0 24px 48px rgba(0, 0, 0, .45); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .18s ease, transform .18s ease, visibility .18s; }
.cp-menu .sub-menu a { padding: 8px 12px; border-radius: 8px; }
.cp-menu .sub-menu a:hover { background: var(--cp-violet-dark); }
.cp-menu > li:hover > .sub-menu, .cp-menu > li:focus-within > .sub-menu, .cp-menu > li.is-open > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.cp-sub-toggle { display: none; }
.cp-header__cta { padding: 10px 20px; border-radius: 999px; background: linear-gradient(180deg, var(--cp-gold), var(--cp-gold-deep)); color: var(--cp-on-gold); font-weight: 600; letter-spacing: .05em; font-size: 13.5px; white-space: nowrap; }
.cp-header__cta:hover { color: var(--cp-on-gold); background: var(--cp-gold-light); }

.cp-nav-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--cp-line-strong); border-radius: 12px; background: transparent; color: var(--cp-body); cursor: pointer; }
.cp-nav-toggle__bars, .cp-nav-toggle__bars::before, .cp-nav-toggle__bars::after { display: block; width: 20px; height: 1.5px; margin: 0 auto; background: currentColor; position: relative; transition: transform .2s ease, opacity .2s ease; }
.cp-nav-toggle__bars::before, .cp-nav-toggle__bars::after { content: ""; position: absolute; left: 0; }
.cp-nav-toggle__bars::before { top: -6px; }
.cp-nav-toggle__bars::after { top: 6px; }
.cp-nav-open .cp-nav-toggle__bars { background: transparent; }
.cp-nav-open .cp-nav-toggle__bars::before { transform: translateY(6px) rotate(45deg); }
.cp-nav-open .cp-nav-toggle__bars::after { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 1100px) {
  .cp-nav-toggle { display: block; }
  /* Closed: out of the layout entirely. A fixed panel parked off-screen with a
     transform still counts toward document scroll width (body overflow-x:clip
     cannot contain a fixed element), which gives phones a sideways scroll. */
  .cp-nav { display: none; position: fixed; inset: 0 0 0 auto; width: min(360px, 88vw); flex-direction: column; align-items: stretch; gap: 20px; padding: 88px 24px 32px; background: var(--cp-deep); border-left: 1px solid var(--cp-line); overflow-y: auto; z-index: 60; }
  .cp-nav-open .cp-nav { display: flex; animation: cp-nav-in .22s ease both; }
  @keyframes cp-nav-in { from { transform: translateX(100%); } to { transform: none; } }
  .cp-nav-toggle { position: relative; z-index: 70; }
  .cp-menu { flex-direction: column; align-items: stretch; gap: 0; }
  .cp-menu > li { border-bottom: 1px solid var(--cp-line); display: flex; flex-wrap: wrap; align-items: center; }
  .cp-menu > li > a { flex: 1; padding: 12px 0; font-size: 16px; }
  .cp-menu .sub-menu { position: static; flex-basis: 100%; min-width: 0; padding: 0 0 10px 12px; border: 0; box-shadow: none; background: transparent; opacity: 1; visibility: visible; transform: none; display: none; }
  .cp-menu > li.is-open > .sub-menu { display: block; }
  .cp-sub-toggle { display: block; width: 40px; height: 40px; border: 0; background: transparent; color: var(--cp-gold); cursor: pointer; position: relative; }
  .cp-sub-toggle::after { content: ""; position: absolute; top: 15px; left: 15px; width: 8px; height: 8px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform .2s ease; }
  .cp-sub-toggle[aria-expanded="true"]::after { transform: rotate(-135deg); top: 19px; }
  .cp-header__cta { text-align: center; padding: 14px 20px; font-size: 15px; }
  body.cp-nav-open { overflow: hidden; }
}

/* ----------------------------------------------------------------- footer */
.cp-footer { background: var(--cp-abyss); border-top: 1px solid var(--cp-line); color: var(--cp-muted); font-size: 15px; }
.cp-footer__grid { max-width: var(--cp-wrap); margin: 0 auto; padding: 64px 24px 30px; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 44px; }
.cp-footer__name { margin: 0 0 16px; font-family: var(--cp-font-heading); font-size: 25px; color: var(--cp-heading); }
.cp-footer p { margin: 0 0 14px; line-height: 1.8; }
.cp-footer__head { font-size: 12.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--cp-gold); margin-bottom: 16px !important; }
.cp-footer__menu, .cp-footer__social, .cp-footer__legal { list-style: none; margin: 0; padding: 0; }
.cp-footer__menu li { margin-bottom: 10px; }
.cp-footer__menu a { color: var(--cp-muted); }
.cp-footer__menu a:hover { color: var(--cp-gold); }
.cp-footer__social { display: flex; gap: 16px; flex-wrap: wrap; font-size: 14px; }
.cp-footer__bottom { max-width: var(--cp-wrap); margin: 0 auto; padding: 22px 24px 40px; border-top: 1px solid var(--cp-line); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 20px; font-size: 13px; color: var(--cp-subtle); }
.cp-footer__bottom p { margin: 0; }
.cp-footer__legal { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.cp-footer__legal a { color: var(--cp-subtle); }
.cp-footer__note { flex-basis: 100%; font-size: 12.5px; opacity: .85; }
@media (max-width: 900px) { .cp-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .cp-footer__grid { grid-template-columns: 1fr; gap: 28px; } }

/* -------------------------------------------------------- Elementor layer */
.cp-main { display: block; }
.cp-measure { max-width: 560px; }
.cp-center { margin-left: auto; margin-right: auto; }

/* arched portrait with offset outline */
/* Offset outline around the arched portrait. Sized explicitly rather than with
   `inset: -18px`: as a pseudo-element of a flex container the inset shorthand
   positioned it but did not stretch it, so the outline sat up-and-left of the
   image instead of surrounding it. The bottom radius is the image's radius plus
   the offset, which keeps the two curves concentric at every width. */
.cp-arch-frame { position: relative; }
.cp-arch-frame::before {
  content: "";
  position: absolute;
  top: -18px;
  left: -18px;
  width: calc(100% + 36px);
  height: calc(100% + 36px);
  border: 1px solid var(--cp-line-strong);
  border-radius: 999px 999px 42px 42px;
  pointer-events: none;
  opacity: .55;
}
.cp-arch-frame--sm::before { top: -12px; left: -12px; width: calc(100% + 24px); height: calc(100% + 24px); border-radius: 999px 999px 32px 32px; }
.cp-arch img { display: block; filter: saturate(1.05); }
.cp-float-badge { position: absolute !important; left: -24px; bottom: 44px; max-width: 260px; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); z-index: 2; }
@media (max-width: 767px) {
  .cp-arch-frame::before { top: -10px; left: -10px; width: calc(100% + 20px); height: calc(100% + 20px); border-radius: 999px 999px 34px 34px; }
  .cp-float-badge { left: 12px; bottom: 16px; max-width: calc(100% - 24px); }
}

.cp-card { transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.cp-lift:hover { transform: translateY(-3px); border-color: var(--cp-line-strong) !important; box-shadow: 0 18px 40px rgba(0, 0, 0, .35); }
.cp-card-foot { margin-top: auto !important; }
.cp-card .elementor-widget-image img { transition: opacity .25s ease; opacity: .92; }
.cp-lift:hover .elementor-widget-image img { opacity: 1; }

.cp-btn .elementor-button { transition: background .2s ease, color .2s ease, border-color .2s ease; }
.cp-btn--link .elementor-button { padding: 0 !important; }
.cp-town .elementor-button { width: 100%; }
.cp-service-actions .elementor-button { white-space: nowrap; }
.cp-inline-book { display: inline-block; padding: 7px 12px; border: 1px solid var(--cp-gold); border-radius: 999px; color: var(--cp-gold); font-size: 13px; line-height: 1.25; white-space: nowrap; }
.cp-inline-book:hover { background: var(--cp-gold); color: var(--cp-on-gold); }
.cp-prefilled { padding: 10px; border: 1px solid var(--cp-line-strong); border-radius: 12px; background: var(--cp-panel); }

/* long-form prose inside text-editor widgets and blog posts */
.cp-prose p { margin: 0 0 1.1em; }
.cp-prose h3 { margin: 1.6em 0 .5em; font-family: var(--e-global-typography-secondary-font-family, "Cormorant Garamond"), Georgia, serif; font-weight: 400; font-size: 26px; line-height: 1.2; color: var(--cp-heading); }
.cp-prose h4 { margin: 1.4em 0 .4em; font-family: var(--cp-font-heading); font-weight: 500; font-size: 21px; color: var(--cp-heading); }
.cp-prose ul, .cp-prose ol { margin: 0 0 1.2em; padding-left: 1.3em; }
.cp-prose li { margin: 0 0 .45em; }
.cp-prose li::marker { color: var(--cp-gold); }
.cp-prose strong { color: var(--cp-body); font-weight: 600; }
.cp-prose a { text-decoration: underline; text-decoration-color: var(--cp-line-strong); text-underline-offset: 3px; }
.cp-prose a:hover { text-decoration-color: currentColor; }
.cp-prose blockquote { margin: 1.5em 0; padding: 4px 0 4px 22px; border-left: 2px solid var(--cp-gold); font-family: var(--e-global-typography-cp_quote-font-family, "Cormorant Garamond"), Georgia, serif; font-style: italic; font-size: 23px; line-height: 1.45; color: var(--cp-body); }
.cp-prose > :last-child { margin-bottom: 0; }

.cp-table, .cp-prose table { width: 100%; border-collapse: collapse; margin: 0 0 1.4em; font-size: 15.5px; display: block; overflow-x: auto; }
.cp-table caption { caption-side: top; text-align: left; padding: 0 0 10px; font-size: 12.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--cp-gold); }
.cp-table th, .cp-table td, .cp-prose th, .cp-prose td { padding: 12px 14px; text-align: left; border-bottom: 1px solid var(--cp-line); vertical-align: top; }
.cp-table thead th, .cp-prose thead th { color: var(--cp-heading); font-weight: 600; background: var(--cp-panel); }
.cp-table td:last-child { color: var(--cp-gold); white-space: nowrap; }
.cp-table--compact th, .cp-table--compact td { padding: 7px 0; }
.cp-table--compact th { color: var(--cp-body); font-weight: 500; }
@media (min-width: 640px) { .cp-table, .cp-prose table { display: table; } }

.cp-answer-box { position: relative; }
.cp-answer p { margin: 0; }

.cp-faq .e-n-accordion-item { margin-bottom: 14px; background: var(--cp-panel); border: 1px solid var(--cp-line); border-radius: 14px; overflow: hidden; }
.cp-faq .e-n-accordion-item-title { padding: 20px 26px; cursor: pointer; }
.cp-faq .e-n-accordion-item-title-text { font-family: var(--e-global-typography-cp_h4-font-family, "Cormorant Garamond"), Georgia, serif; font-size: 20px; line-height: 1.35; color: var(--cp-heading); }
.cp-faq .e-n-accordion-item-title-icon { color: var(--cp-gold); }
.cp-faq .e-n-accordion-item-title-icon svg,
.cp-faq .e-n-accordion-item-title-icon svg path { fill: currentColor; }
.cp-faq .e-n-accordion-item-title-icon svg { width: 16px; height: 16px; }
/* The answer appeared as a jump-cut inside the item's rounded clip; fade it in. */
.cp-faq .e-n-accordion-item[open] > .e-con { animation: cp-faq-open .22s ease both; }
@keyframes cp-faq-open { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .cp-faq .e-n-accordion-item[open] > .e-con { animation: none; } }
.cp-faq .e-n-accordion-item[open] { border-color: var(--cp-line-strong); }

.cp-stars .e-rating-wrapper, .cp-stars i, .cp-stars svg { color: var(--cp-gold); fill: var(--cp-gold); }
.cp-sources { margin: 0; padding-left: 1.2em; }
.cp-sources li { margin-bottom: 6px; }
.cp-source-pub { opacity: .75; }
.cp-disclaimer p { font-size: 13.5px; opacity: .85; }

.cp-breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; font-size: 13px; letter-spacing: .04em; color: var(--cp-subtle); }
.cp-breadcrumbs li:not(:last-child)::after { content: "/"; margin-left: 6px; color: var(--cp-violet); }
.cp-breadcrumbs a { color: var(--cp-nav); }

.cp-map iframe { border-radius: 18px; filter: grayscale(.35) invert(.9) hue-rotate(200deg) saturate(.7); border: 1px solid var(--cp-line); }

/* --------------------------------------------------------------- WPForms */
.wpforms-container.wpforms-container-full {
  --wpforms-field-border-radius: 10px;
  --wpforms-field-background-color: rgba(14, 5, 23, .6);
  --wpforms-field-border-color: var(--cp-line-strong);
  --wpforms-field-border-color-spare: var(--cp-line-strong);
  --wpforms-field-text-color: var(--cp-body);
  --wpforms-field-menu-color: var(--cp-deep);
  --wpforms-label-color: var(--cp-nav);
  --wpforms-label-sublabel-color: var(--cp-subtle);
  --wpforms-label-error-color: #ff9a9a;
  --wpforms-button-border-radius: 999px;
  --wpforms-button-background-color: var(--cp-gold);
  --wpforms-button-text-color: var(--cp-on-gold);
  --wpforms-button-border-color: var(--cp-gold);
  --wpforms-page-break-color: var(--cp-gold);
  --wpforms-field-size-font-size: 16px;
  --wpforms-label-size-font-size: 14.5px;
  --wpforms-button-size-font-size: 15px;
  margin: 0 !important;
  font-family: var(--cp-font-body);
}
.wpforms-container .wpforms-field-label { font-family: var(--cp-font-body); font-weight: 500 !important; letter-spacing: .02em; }
.wpforms-container input::placeholder, .wpforms-container textarea::placeholder { color: var(--cp-subtle); opacity: .7; }
.wpforms-container button[type=submit] { font-family: var(--cp-font-body); font-weight: 600 !important; letter-spacing: .05em; padding: 14px 32px !important; height: auto !important; }
.wpforms-container button[type=submit]:hover { background: var(--cp-gold-light) !important; }
/* Success and error messages.
   WPForms shows the AJAX confirmation as .wpforms-confirmation-container (no
   "-full"), which carried no styling at all: muted lavender text on the page
   background, easy to miss after a submit. Both variants are styled here, and
   the stock error red (#d63637) is replaced with one readable on the dark
   panel. */
.wpforms-confirmation-container,
.wpforms-confirmation-container-full {
  background: var(--cp-panel) !important;
  border: 1px solid var(--cp-gold) !important;
  border-left-width: 4px !important;
  color: var(--cp-heading) !important;
  border-radius: 14px;
  padding: 20px 22px !important;
  margin-bottom: 22px !important;
}
.wpforms-confirmation-container p,
.wpforms-confirmation-container-full p { color: var(--cp-heading) !important; margin: 0 0 .6em; font-size: 16.5px; }
.wpforms-confirmation-container p:last-child,
.wpforms-confirmation-container-full p:last-child { margin-bottom: 0; }
.wpforms-confirmation-container a,
.wpforms-confirmation-container-full a { color: var(--cp-gold) !important; text-decoration: underline; }
.wpforms-container label.wpforms-error,
.wpforms-container em.wpforms-error,
.wpforms-container .wpforms-error-container { color: #ffb4a8 !important; font-size: 14px; letter-spacing: .01em; }
.wpforms-container .wpforms-error-container { background: rgba(255, 120, 100, .1); border: 1px solid rgba(255, 140, 120, .45); border-radius: 12px; padding: 14px 16px; }
.wpforms-container input.wpforms-error,
.wpforms-container textarea.wpforms-error,
.wpforms-container select.wpforms-error { border-color: #ffb4a8 !important; }

/* ------------------------------------------- shop cards (call to order) */
.cp-products { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.cp-product { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--cp-line); border-radius: 18px; background: linear-gradient(180deg, rgba(45, 22, 70, .72), rgba(26, 12, 42, .72)); transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.cp-product:hover { transform: translateY(-3px); border-color: var(--cp-line-strong); box-shadow: 0 18px 40px rgba(0, 0, 0, .35); }
.cp-product__image { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--cp-deep); }
.cp-product__image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease, opacity .25s ease; opacity: .93; }
.cp-product:hover .cp-product__image img { transform: scale(1.025); opacity: 1; }
.cp-product__body { display: flex; flex-direction: column; gap: 12px; flex: 1; padding: 24px; }
.cp-product__title { margin: 0; font-family: var(--cp-font-heading); font-size: 27px; font-weight: 400; line-height: 1.2; }
.cp-product__title a { color: var(--cp-heading); }
.cp-product__description { color: var(--cp-muted); font-size: 15px; line-height: 1.65; }
.cp-product__description p { margin: 0; }
.cp-product__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 15px; border-top: 1px solid var(--cp-line); }
.cp-product__price { color: var(--cp-gold); font-family: var(--cp-font-heading); font-size: 25px; }
@media (max-width: 900px) { .cp-products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .cp-products { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------------- blog */
.cp-blog-hero { padding: 56px 0 40px; }
.cp-blog-hero .cp-breadcrumbs { margin-bottom: 26px; }
.cp-chips { list-style: none; margin: 30px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.cp-chips a { display: inline-block; padding: 8px 16px; border: 1px solid var(--cp-line); border-radius: 999px; font-size: 13.5px; color: var(--cp-nav); }
.cp-chips a:hover, .cp-chips a[aria-current] { border-color: var(--cp-gold); color: var(--cp-gold); }
.cp-post-grid-wrap { padding-bottom: 96px; }
/* min() so the 300px track collapses instead of overflowing a 320px phone. */
.cp-post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: 22px; }
.cp-post-card { display: flex; flex-direction: column; overflow: hidden; background: linear-gradient(180deg, rgba(45, 22, 70, .7), rgba(26, 12, 42, .7)); border: 1px solid var(--cp-line); border-radius: 18px; transition: border-color .25s ease, transform .25s ease; }
.cp-post-card:hover { transform: translateY(-3px); border-color: var(--cp-line-strong); }
.cp-post-card__img img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; opacity: .92; }
.cp-post-card__body { padding: 24px 26px 28px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.cp-post-card__body .cp-eyebrow { margin: 0; font-size: 11.5px; }
.cp-post-card__title { margin: 0; font-family: var(--cp-font-heading); font-weight: 400; font-size: 26px; line-height: 1.2; }
.cp-post-card__title a { color: var(--cp-heading); }
.cp-post-card__title a:hover { color: var(--cp-gold); }
.cp-post-card__excerpt { margin: 0; font-size: 15px; line-height: 1.7; color: var(--cp-muted); flex: 1; }
.cp-pagination { margin-top: 40px; }
.cp-pagination .nav-links { display: flex; gap: 10px; flex-wrap: wrap; }
.cp-pagination .page-numbers { padding: 8px 14px; border: 1px solid var(--cp-line); border-radius: 10px; color: var(--cp-nav); }
.cp-pagination .current { border-color: var(--cp-gold); color: var(--cp-gold); }

.cp-article { max-width: 820px; margin: 0 auto; padding: 48px 24px 24px; }
.cp-article__head .cp-breadcrumbs { margin-bottom: 24px; }
.cp-article__title { margin: 0 0 16px; font-family: var(--cp-font-display); font-weight: 300; font-size: clamp(38px, 4.6vw, 60px); line-height: 1.06; color: var(--cp-heading); }
.cp-article__meta { margin: 0; font-size: 14px; color: var(--cp-subtle); }
.cp-article__image { margin: 34px 0; }
.cp-article__image img { width: 100%; border-radius: 20px; display: block; }
.cp-article__content { font-size: 18px; margin-top: 34px; }
.cp-article__content h2 { margin: 1.8em 0 .5em; font-family: var(--cp-font-heading); font-weight: 300; font-size: clamp(30px, 3vw, 40px); line-height: 1.15; color: var(--cp-heading); }
.cp-article__content .cp-answer-lead { padding: 22px 26px; background: var(--cp-panel); border: 1px solid var(--cp-line-strong); border-left-width: 3px; border-radius: 14px; color: var(--cp-body); font-size: 18.5px; }
.cp-article__content details { margin: 0 0 12px; padding: 18px 22px; background: var(--cp-panel); border: 1px solid var(--cp-line); border-radius: 14px; }
.cp-article__content summary { cursor: pointer; font-family: var(--cp-font-heading); font-size: 21px; color: var(--cp-heading); }
.cp-article__content details[open] summary { margin-bottom: 10px; }
.cp-article__content figure.wp-block-table { margin: 0 0 1.4em; overflow-x: auto; }
.cp-article__author { margin: 48px 0 0; padding: 26px 28px; border: 1px solid var(--cp-line); border-radius: 18px; background: var(--cp-panel); }
.cp-article__author p { margin: 0 0 8px; }
.cp-article__author-name { font-family: var(--cp-font-heading); font-size: 24px; }
.cp-post-cta { margin: 24px 0 0; padding: 40px 34px; text-align: center; border: 1px solid var(--cp-line-strong); border-radius: 24px; background: radial-gradient(600px 300px at 50% 0%, var(--cp-violet-dark), var(--cp-night)); }
.cp-post-cta h2 { margin: 0 0 12px; font-family: var(--cp-font-heading); font-weight: 300; font-size: clamp(28px, 3vw, 38px); color: var(--cp-heading); }
.cp-post-cta p { margin: 0 auto 20px; max-width: 520px; }
.cp-post-cta__buttons { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin: 0 !important; }
.cp-button { display: inline-block; padding: 14px 28px; border-radius: 999px; font-weight: 600; letter-spacing: .05em; font-size: 15px; }
.cp-button--gold { background: linear-gradient(180deg, var(--cp-gold), var(--cp-gold-deep)); color: var(--cp-on-gold); }
.cp-button--gold:hover { background: var(--cp-gold-light); color: var(--cp-on-gold); }
.cp-button--ghost { border: 1px solid var(--cp-line-strong); color: var(--cp-body); }
.cp-button--ghost:hover { border-color: var(--cp-gold); color: var(--cp-gold); }
.cp-related { padding: 64px 24px 96px; }

.search-form { display: flex; gap: 8px; margin-top: 26px; max-width: 480px; }
.search-form label { flex: 1; }
.search-field { width: 100%; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--cp-line-strong); background: rgba(14, 5, 23, .6); color: var(--cp-body); font: inherit; }
.search-submit { padding: 12px 20px; border-radius: 10px; border: 0; background: var(--cp-gold); color: var(--cp-on-gold); font-weight: 600; cursor: pointer; }

.cp-article--page { max-width: 860px; }

/* ==========================================================================
   Elementor header / footer templates and the "Site Menu" widget.

   Defaults only: every colour, size and spacing below is overridden by the
   widget's own Style tab (Elementor's selectors are more specific), so the
   client can restyle the menu in "Edit Header" without touching CSS. The
   values here read Kit globals, so Site Settings drives them until then.
   ========================================================================== */

/* The template lives inside the theme's <header>; only the container marked
   cp-sticky sticks, so the top bar still scrolls away as it did before. */
.cp-header--el { position: relative; background: none; border-bottom: 0; -webkit-backdrop-filter: none; backdrop-filter: none; }
.cp-sticky { position: sticky; top: 0; z-index: 50; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.admin-bar .cp-sticky { top: 32px; }
@media (max-width: 782px) { .admin-bar .cp-sticky { top: 46px; } }
/* Heading widgets used as <span> in a header row inherit body line-height. */
.cp-header--el .elementor-heading-title { display: block; }

.cpm-navw { display: flex; align-items: center; justify-content: var(--cpm-nav-align, flex-end); gap: 18px; width: 100%; }
.cpm-navw .cpm-menu, .cpm-navw .cpm-menu ul { list-style: none; margin: 0; padding: 0; }
.cpm-nav > .cpm-menu { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; justify-content: inherit; }
.cpm-navw nav > ul > li { position: relative; }
.cpm-navw nav > ul > li > a { display: block; padding: 6px 0; font-family: var(--cp-font-body); font-size: 13.5px; letter-spacing: .03em; color: var(--cp-nav); white-space: nowrap; }
.cpm-navw nav > ul > li > a:hover, .cpm-navw nav > ul > li > a:focus-visible { color: var(--cp-gold); }
.cpm-navw nav .current-menu-item > a, .cpm-navw nav .current-menu-ancestor > a, .cpm-navw nav .current_page_item > a { color: var(--cp-gold); }

/* Dropdowns */
.cpm-nav .sub-menu { position: absolute; top: 100%; left: -16px; min-width: 250px; padding: 10px; background: var(--cp-deep); border: 1px solid var(--cp-line); border-radius: 14px; box-shadow: 0 24px 48px rgba(0, 0, 0, .45); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .18s ease, transform .18s ease, visibility .18s; z-index: 60; }
.cpm-nav .sub-menu a { display: block; padding: 8px 12px; border-radius: 8px; font-size: 14px; color: var(--cp-nav); white-space: nowrap; }
.cpm-nav .sub-menu a:hover { background: var(--cp-violet-dark); color: var(--cp-gold); }
.cpm-nav > ul > li:hover > .sub-menu, .cpm-nav > ul > li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }

/* Phone menu: the button is hidden until the widget's breakpoint rule shows it. */
.cpm-burger { display: none; width: 44px; height: 44px; flex-direction: column; align-items: center; justify-content: center; gap: 5px; border: 1px solid var(--cp-line-strong); border-radius: 12px; background: transparent; cursor: pointer; }
.cpm-burger span { display: block; width: 20px; height: 1.5px; background: var(--cp-body); transition: transform .2s ease, opacity .2s ease; }
.cpm-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.cpm-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.cpm-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
.cpm-mobnav { width: 100%; background: var(--cp-deep); border-top: 1px solid var(--cp-line); padding: 8px 24px 18px; }
.cpm-mobnav .cpm-menu { display: flex; flex-direction: column; }
.cpm-mobnav .cpm-menu li { border-bottom: 1px solid var(--cp-line); }
.cpm-mobnav .cpm-menu a { display: block; padding: 12px 0; font-size: 16px; color: var(--cp-nav); }
.cpm-mobnav .sub-menu { padding-left: 14px; }
.cpm-mobnav .sub-menu a { font-size: 14.5px; opacity: .85; }
.cpm-navw-empty { color: var(--cp-muted); font-size: 14px; }

/* Footer column layout of the same widget. */
.cpm-navw--list { display: block; }
.cpm-navw--list .cpm-menu { display: flex; flex-direction: column; gap: 10px; }
.cpm-navw--list .cpm-menu a { font-size: 15px; color: var(--cp-muted); }
.cpm-navw--list .cpm-menu a:hover { color: var(--cp-gold); }

/* ------------------------------------------------- phone touch targets */
@media (max-width: 767px) {
  .cp-topbar-line a,
  .cp-btn--link .elementor-button,
  .cp-card a { min-height: 44px; display: inline-flex; align-items: center; }
}

/* Long unbreakable strings - an email address, a hyphen-free URL - pushed the
   document a few pixels wider than a 320px screen. Wrapping them is the fix;
   overflow-x: hidden on the body would only have hidden it. */
.cp-prose, .cp-card, .cp-answer, .elementor-widget-text-editor,
.elementor-widget-heading, .cp-post-card__body, .wpforms-container {
  overflow-wrap: anywhere;
}
.cp-prose a, .cp-card a, .cp-answer a { word-break: break-word; }


/* ------------------------------------- booking request: form + call */
.cp-booking-request__call { margin: 22px 0 0; }
.cp-booking-request__call .cp-button { display: inline-flex; min-height: 48px; align-items: center; }
.cp-booking-request__note { margin: 12px 0 0; color: var(--cp-muted); font-size: 14.5px; }
.cp-booking-request__fallback { padding: 18px 20px; border: 1px solid var(--cp-line); border-radius: 14px; background: var(--cp-panel); }
.cp-form-call { margin-top: 18px; }