/* Coach Site Kit — palette + pattern styles
   Add the same five colours to Kadence › Customize › Colors › Global Palette
   so Kadence's own blocks and buttons match. */

:root {
	--ck-teal:   #0E4A4F;  /* main: headings, dark bands, primary buttons */
	--ck-papaya: #FF8A4C;  /* accent: key buttons, highlights, rules */
	--ck-mist:   #EEF3F1;  /* light section backgrounds */
	--ck-ink:    #182A2D;  /* body text */
	--ck-sage:   #8FB5A8;  /* secondary: icons, tags, soft borders */
	--ck-white:  #FFFFFF;
	--ck-radius: 6px;
}

/* ---------- section wrappers ---------- */
.ck-section { padding: clamp(3rem, 7vw, 6rem) 0; }
.ck-section--mist  { background: var(--ck-mist); }
.ck-section--teal  { background: var(--ck-teal); color: var(--ck-white); }
.ck-section--teal h1, .ck-section--teal h2, .ck-section--teal h3,
.ck-section--teal p { color: var(--ck-white); }
.ck-section--teal a:not(.wp-block-button__link) { color: var(--ck-papaya); }

.ck-inner { max-width: 1180px; margin: 0 auto; padding: 0 1.25rem; }
.ck-narrow { max-width: 720px; }

.ck-lede { font-size: 1.2rem; line-height: 1.6; max-width: 40ch; }
.ck-muted { color: color-mix(in srgb, var(--ck-ink) 65%, transparent); }
.ck-section--teal .ck-muted { color: color-mix(in srgb, var(--ck-white) 75%, transparent); }

/* short papaya rule that sits under a heading */
.ck-rule::after {
	content: "";
	display: block;
	width: 3rem;
	height: 3px;
	background: var(--ck-papaya);
	margin-top: 0.9rem;
}
.has-text-align-center.ck-rule::after { margin-left: auto; margin-right: auto; }

/* ---------- hero ---------- */
.ck-hero { min-height: 82vh; display: flex; align-items: center; }
.ck-hero .wp-block-cover__inner-container { width: 100%; }
.ck-hero h1 { font-size: clamp(2.4rem, 5.5vw, 4.25rem); line-height: 1.05; max-width: 16ch; margin: 0 0 1rem; }

/* ---------- buttons ---------- */
.ck-btn-papaya .wp-block-button__link,
.coach-kit-checkout .wp-block-button__link { background: var(--ck-papaya); color: var(--ck-teal); border: 2px solid var(--ck-papaya); }
.ck-btn-papaya .wp-block-button__link:hover,
.coach-kit-checkout .wp-block-button__link:hover { background: #ff9d68; border-color: #ff9d68; }
.ck-btn-teal .wp-block-button__link { background: var(--ck-teal); color: var(--ck-white); border: 2px solid var(--ck-teal); }
.ck-btn-ghost .wp-block-button__link { background: transparent; color: currentColor; border: 2px solid currentColor; }
.wp-block-button__link { border-radius: var(--ck-radius); padding: 0.85em 1.6em; font-weight: 600; }
.coach-kit-checkout { margin: 0; }
.coach-kit-checkout button { cursor: pointer; font: inherit; }
.coach-kit-checkout.is-style-outline .wp-block-button__link { background: transparent; color: var(--ck-teal); }

/* ---------- offer cards (was: destinations) ---------- */
.ck-card {
	background: var(--ck-white);
	border-radius: var(--ck-radius);
	overflow: hidden;
	border: 1px solid color-mix(in srgb, var(--ck-sage) 45%, transparent);
	height: 100%;
}
.ck-card > figure { margin: 0; aspect-ratio: 4 / 3; }
.ck-card > figure img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ck-card__body { padding: 1.5rem; }
.ck-card h3 { margin: 0 0 0.5rem; color: var(--ck-teal); }
.ck-card .ck-tag {
	display: inline-block;
	font-size: 0.85rem;
	color: var(--ck-teal);
	background: var(--ck-mist);
	padding: 0.2em 0.7em;
	border-radius: 999px;
	margin-bottom: 0.75rem;
}

/* ---------- process steps (was: itinerary) ---------- */
.ck-steps { counter-reset: step; }
.ck-step {
	position: relative;
	padding: 0 0 2.25rem 3.75rem;
	border-left: 2px solid color-mix(in srgb, var(--ck-sage) 60%, transparent);
	margin-left: 1.1rem;
}
.ck-step:last-child { padding-bottom: 0; border-left-color: transparent; }
.ck-step::before {
	counter-increment: step;
	content: counter(step);
	position: absolute;
	left: -1.2rem;
	top: -0.1rem;
	width: 2.3rem; height: 2.3rem;
	border-radius: 50%;
	background: var(--ck-papaya);
	color: var(--ck-teal);
	font-weight: 700;
	display: grid; place-items: center;
}
.ck-step h3 { margin: 0 0 0.35rem; color: var(--ck-teal); }
.ck-step p { margin: 0; }

/* ---------- pricing (was: tour prices) ---------- */
.ck-price {
	background: var(--ck-white);
	border-radius: var(--ck-radius);
	padding: 2rem;
	border: 1px solid color-mix(in srgb, var(--ck-sage) 45%, transparent);
	height: 100%;
	display: flex; flex-direction: column;
}
.ck-price--featured { border: 2px solid var(--ck-papaya); }
.ck-price h3 { margin: 0 0 0.25rem; color: var(--ck-teal); }
.ck-price__amount { font-size: 2.6rem; font-weight: 700; color: var(--ck-teal); line-height: 1; margin: 1rem 0 0.25rem; }
.ck-price__per { font-size: 0.95rem; }
.ck-price ul { padding-left: 1.2rem; margin: 1.25rem 0 1.75rem; flex: 1; }
.ck-price li { margin-bottom: 0.4rem; }
.ck-price li::marker { color: var(--ck-papaya); }

/* ---------- testimonials ---------- */
.ck-quote {
	background: var(--ck-white);
	border-radius: var(--ck-radius);
	padding: 1.75rem;
	border-left: 4px solid var(--ck-papaya);
	height: 100%;
}
.ck-quote p:first-child { font-size: 1.05rem; line-height: 1.6; margin-top: 0; }
.ck-quote p:last-child strong { color: var(--ck-teal); }

/* ---------- about ---------- */
.ck-about img { border-radius: var(--ck-radius); }
.ck-facts { display: flex; gap: 2rem; flex-wrap: wrap; margin-top: 1.5rem; }
.ck-facts strong { display: block; font-size: 1.6rem; color: var(--ck-teal); line-height: 1.1; }
.ck-facts span { font-size: 0.9rem; }

/* ---------- FAQ ---------- */
.ck-faq details { border-bottom: 1px solid color-mix(in srgb, var(--ck-sage) 55%, transparent); padding: 1rem 0; }
.ck-faq summary { cursor: pointer; font-weight: 600; color: var(--ck-teal); list-style: none; display: flex; justify-content: space-between; }
.ck-faq summary::after { content: "+"; color: var(--ck-papaya); font-size: 1.4rem; line-height: 1; }
.ck-faq details[open] summary::after { content: "–"; }
.ck-faq summary::-webkit-details-marker { display: none; }

/* ---------- blog ---------- */
.ck-posts .wp-block-post-featured-image img { border-radius: var(--ck-radius); aspect-ratio: 3/2; object-fit: cover; }
.ck-posts .wp-block-post-title a { color: var(--ck-teal); text-decoration: none; }

/* ---------- contact ---------- */
.ck-contact-panel {
	background: var(--ck-white);
	border-radius: var(--ck-radius);
	padding: 2rem;
	border: 1px solid color-mix(in srgb, var(--ck-sage) 45%, transparent);
}

/* ---------- mobile ---------- */
@media (max-width: 781px) {
	.ck-hero { min-height: 70vh; }
	.ck-step { padding-left: 3rem; }
}

@media (prefers-reduced-motion: no-preference) {
	.ck-faq details summary { transition: color .15s; }
}
