/* ==========================================================================
   Key To Change Ripple: brand styles for Divi
   Palette: Ripple Keyhole, bright blues. Fonts: DM Serif Display + Inter.
   ========================================================================== */

:root {
	--ktc-electric: #1463FF;  /* primary buttons, accents (white text 4.9:1) */
	--ktc-cobalt:   #0F52D9;  /* links, hover, keyhole disc */
	--ktc-azure:    #1FA2FF;  /* shapes, icons; not for small text on white */
	--ktc-sky:      #5CC8FF;  /* outer ripple, highlights on navy */
	--ktc-ice:      #EEF6FF;  /* soft section wash */
	--ktc-ink:      #0A2A6B;  /* headings + body text */
	--ktc-muted:    #41587E;  /* secondary text */
	--ktc-navy:     #06163A;  /* dark bands, footer */
	--ktc-navy-2:   #0C2456;  /* cards on navy */
	--ktc-hairline: #CFE3FF;  /* borders, dividers */
	--ktc-white:    #FFFFFF;

	--ktc-font-display: "DM Serif Display", Georgia, "Times New Roman", serif;
	--ktc-font-sans: "Inter", "Helvetica Neue", Arial, sans-serif;

	--ktc-radius-sm: 6px;
	--ktc-radius-md: 12px;
	--ktc-radius-pill: 999px;
}

/* ---------- Base ---------- */

body.ktc-ripple,
body.ktc-ripple #page-container {
	font-family: var(--ktc-font-sans);
	color: var(--ktc-ink);
	font-size: 17px;
	line-height: 1.7;
	background: var(--ktc-white);
}

body.ktc-ripple p { color: var(--ktc-ink); }

body.ktc-ripple h1, body.ktc-ripple h2, body.ktc-ripple h3,
body.ktc-ripple h4, body.ktc-ripple h5, body.ktc-ripple h6,
body.ktc-ripple .et_pb_module_header {
	font-family: var(--ktc-font-display);
	font-weight: 400;
	color: var(--ktc-ink);
	line-height: 1.15;
	padding-bottom: 14px;
	letter-spacing: 0;
}
body.ktc-ripple h1 { font-size: 54px; }
body.ktc-ripple h2 { font-size: 40px; }
body.ktc-ripple h3 { font-size: 27px; }
body.ktc-ripple h4 { font-family: var(--ktc-font-sans); font-weight: 600; font-size: 19px; }

body.ktc-ripple a { color: var(--ktc-cobalt); }
body.ktc-ripple a:hover { color: var(--ktc-electric); text-decoration: underline; }

body.ktc-ripple ::selection { background: var(--ktc-sky); color: var(--ktc-navy); }

body.ktc-ripple :focus-visible {
	outline: 3px solid var(--ktc-azure);
	outline-offset: 3px;
}

@media (max-width: 980px) {
	body.ktc-ripple h1 { font-size: 40px; }
	body.ktc-ripple h2 { font-size: 32px; }
	body.ktc-ripple h3 { font-size: 24px; }
}

/* ---------- Header + navigation ---------- */

body.ktc-ripple #main-header {
	background: var(--ktc-white);
	box-shadow: 0 1px 0 var(--ktc-hairline);
}
body.ktc-ripple #top-menu a,
body.ktc-ripple .et_mobile_menu a {
	font-family: var(--ktc-font-sans);
	font-weight: 500;
	font-size: 15px;
	color: var(--ktc-ink);
}
body.ktc-ripple #top-menu li.current-menu-item > a,
body.ktc-ripple #top-menu a:hover { color: var(--ktc-cobalt); opacity: 1; }
body.ktc-ripple .et_mobile_menu { border-top-color: var(--ktc-electric); }
body.ktc-ripple .mobile_menu_bar:before { color: var(--ktc-electric); }

/* Last menu item as a pill button: give a menu item the CSS class "ktc-menu-cta" */
body.ktc-ripple #top-menu li.ktc-menu-cta > a {
	background: var(--ktc-electric);
	color: var(--ktc-white) !important;
	padding: 10px 20px !important;
	border-radius: var(--ktc-radius-pill);
}
body.ktc-ripple #top-menu li.ktc-menu-cta > a:hover { background: var(--ktc-cobalt); }

/* ---------- Buttons ---------- */

body.ktc-ripple .et_pb_button,
body.ktc-ripple .et_pb_contact_submit,
body.ktc-ripple .et_pb_more_button {
	font-family: var(--ktc-font-sans) !important;
	font-weight: 600 !important;
	font-size: 16px !important;
	letter-spacing: 0.01em;
	color: var(--ktc-white) !important;
	background-color: var(--ktc-electric) !important;
	border: 2px solid var(--ktc-electric) !important;
	border-radius: var(--ktc-radius-pill) !important;
	padding: 12px 28px !important;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
body.ktc-ripple .et_pb_button:hover,
body.ktc-ripple .et_pb_contact_submit:hover {
	background-color: var(--ktc-cobalt) !important;
	border-color: var(--ktc-cobalt) !important;
	padding: 12px 28px !important;
}
body.ktc-ripple .et_pb_button:after { display: none !important; }

/* Secondary (outline) button: module class "ktc-btn-outline" */
body.ktc-ripple .ktc-btn-outline .et_pb_button,
body.ktc-ripple .et_pb_button.ktc-btn-outline {
	background-color: transparent !important;
	color: var(--ktc-cobalt) !important;
	border-color: var(--ktc-cobalt) !important;
}
body.ktc-ripple .ktc-btn-outline .et_pb_button:hover,
body.ktc-ripple .et_pb_button.ktc-btn-outline:hover {
	background-color: var(--ktc-ice) !important;
}
/* On dark sections the outline button turns light */
body.ktc-ripple .ktc-dark .et_pb_button.ktc-btn-outline {
	color: var(--ktc-white) !important;
	border-color: var(--ktc-sky) !important;
}
body.ktc-ripple .ktc-dark .et_pb_button.ktc-btn-outline:hover {
	background-color: rgba(92, 200, 255, .15) !important;
}

/* Buttons side by side: give the row the class "ktc-btn-row" */
body.ktc-ripple .ktc-btn-row .et_pb_button_module_wrapper {
	display: inline-block;
	margin-right: 14px;
	margin-bottom: 12px;
}

/* ---------- Section types ---------- */

/* Dark navy section */
body.ktc-ripple .et_pb_section.ktc-dark {
	background-color: var(--ktc-navy);
}
body.ktc-ripple .ktc-dark,
body.ktc-ripple .ktc-dark p,
body.ktc-ripple .ktc-dark li { color: #DCEBFF; }
body.ktc-ripple .ktc-dark h1, body.ktc-ripple .ktc-dark h2,
body.ktc-ripple .ktc-dark h3, body.ktc-ripple .ktc-dark h4 { color: var(--ktc-white); }
body.ktc-ripple .ktc-dark a { color: var(--ktc-sky); }

/* Ice-wash section */
body.ktc-ripple .et_pb_section.ktc-ice { background-color: var(--ktc-ice); }

/* Hero with the ripple rings */
body.ktc-ripple .et_pb_section.ktc-hero {
	background-color: var(--ktc-navy);
	background-image:
		radial-gradient(circle at 82% 50%, var(--ktc-cobalt) 0 70px, transparent 71px),
		repeating-radial-gradient(circle at 82% 50%, transparent 0 104px, rgba(92, 200, 255, .30) 104px 107px, transparent 107px 140px);
	padding: 120px 0;
	overflow: hidden;
}
body.ktc-ripple .ktc-hero h1 { font-size: 64px; color: var(--ktc-white); max-width: 640px; }
body.ktc-ripple .ktc-hero p { color: #DCEBFF; }
body.ktc-ripple .et_pb_section.ktc-hero-small { padding: 80px 0 72px; }
body.ktc-ripple .ktc-hero-small h1 { font-size: 52px; }
@media (max-width: 980px) {
	body.ktc-ripple .et_pb_section.ktc-hero {
		background-image: repeating-radial-gradient(circle at 100% 0%, transparent 0 60px, rgba(92, 200, 255, .22) 60px 62px, transparent 62px 84px);
		padding: 72px 0;
	}
	body.ktc-ripple .ktc-hero h1 { font-size: 42px; }
}

/* Call-to-action band */
body.ktc-ripple .et_pb_section.ktc-cta {
	background-color: var(--ktc-electric);
	background-image: repeating-radial-gradient(circle at 0% 100%, transparent 0 46px, rgba(255, 255, 255, .14) 46px 48px, transparent 48px 64px);
	text-align: center;
}
body.ktc-ripple .ktc-cta h2, body.ktc-ripple .ktc-cta p { color: var(--ktc-white); }
body.ktc-ripple .ktc-cta .et_pb_button {
	background-color: var(--ktc-white) !important;
	border-color: var(--ktc-white) !important;
	color: var(--ktc-cobalt) !important;
}
body.ktc-ripple .ktc-cta .et_pb_button:hover {
	background-color: var(--ktc-ice) !important;
	border-color: var(--ktc-ice) !important;
}

/* ---------- Text helpers ---------- */

body.ktc-ripple .ktc-eyebrow,
body.ktc-ripple p.ktc-eyebrow {
	font-family: var(--ktc-font-sans);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--ktc-cobalt);
	padding-bottom: 10px;
}
body.ktc-ripple .ktc-dark .ktc-eyebrow,
body.ktc-ripple .ktc-hero .ktc-eyebrow { color: var(--ktc-sky); }

body.ktc-ripple .ktc-lead,
body.ktc-ripple .ktc-lead p { font-size: 20px; line-height: 1.6; color: var(--ktc-muted); }
body.ktc-ripple .ktc-dark .ktc-lead p,
body.ktc-ripple .ktc-hero .ktc-lead p { color: #DCEBFF; }

body.ktc-ripple .ktc-center { text-align: center; }
body.ktc-ripple .ktc-center .ktc-lead p { max-width: 720px; margin: 0 auto; }

/* Placeholder text you still need to replace: [LIKE THIS] */
body.ktc-ripple .ktc-todo {
	background: #FFF4C2;
	color: #5A4300;
	padding: 0 4px;
	border-radius: 3px;
}

/* ---------- Cards ---------- */

body.ktc-ripple .ktc-card {
	background: var(--ktc-white);
	border: 1px solid var(--ktc-hairline);
	border-radius: var(--ktc-radius-md);
	padding: 32px 28px;
	height: 100%;
}
body.ktc-ripple .ktc-card h3 { font-size: 24px; }
body.ktc-ripple .ktc-card p:last-child { padding-bottom: 0; }

/* Small ripple icon above a card title */
body.ktc-ripple .ktc-card h3::before {
	content: "";
	display: block;
	width: 44px;
	height: 44px;
	margin-bottom: 18px;
	border-radius: 50%;
	background:
		radial-gradient(circle, var(--ktc-cobalt) 0 8px, transparent 9px),
		radial-gradient(circle, transparent 0 13px, var(--ktc-azure) 13px 15px, transparent 16px),
		radial-gradient(circle, transparent 0 19px, var(--ktc-sky) 19px 21px, transparent 22px);
}
body.ktc-ripple .ktc-card.ktc-no-icon h3::before { display: none; }

body.ktc-ripple .ktc-dark .ktc-card {
	background: var(--ktc-navy-2);
	border-color: #1E3A70;
}

/* Equal-height columns for card rows */
body.ktc-ripple .et_pb_row.ktc-equal { display: flex; flex-wrap: wrap; }
body.ktc-ripple .et_pb_row.ktc-equal > .et_pb_column { display: flex; flex-direction: column; }
body.ktc-ripple .et_pb_row.ktc-equal > .et_pb_column > .et_pb_module { flex: 1; }

/* Numbered steps */
/* The number sits in the normal flow above the heading, so it can never overlap the text */
body.ktc-ripple .ktc-step .ktc-step-num {
	display: block;
	position: static;
	margin: 10px 0 28px 10px; /* room for the ring shadow */
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--ktc-electric);
	color: var(--ktc-white);
	font-family: var(--ktc-font-display);
	font-size: 26px;
	line-height: 52px;
	text-align: center;
	box-shadow: 0 0 0 8px var(--ktc-ice), 0 0 0 10px var(--ktc-sky);
}

/* Price cards */
body.ktc-ripple .ktc-price .ktc-amount {
	font-family: var(--ktc-font-display);
	font-size: 44px;
	line-height: 1;
	color: var(--ktc-cobalt);
	padding: 6px 0 14px;
}
body.ktc-ripple .ktc-price.ktc-featured {
	border: 2px solid var(--ktc-electric);
	box-shadow: 0 0 0 6px var(--ktc-ice);
}

/* Tick lists */
body.ktc-ripple .ktc-ticks ul { list-style: none; padding-left: 0; }
body.ktc-ripple .ktc-ticks li {
	position: relative;
	padding: 0 0 10px 30px;
}
body.ktc-ripple .ktc-ticks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 7px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 3px solid var(--ktc-azure);
	box-shadow: inset 0 0 0 3px var(--ktc-white), inset 0 0 0 10px var(--ktc-cobalt);
}

/* Testimonial cards */
body.ktc-ripple .ktc-quote blockquote {
	border: 0;
	margin: 0;
	padding: 0;
	font-family: var(--ktc-font-display);
	font-size: 23px;
	line-height: 1.45;
	color: var(--ktc-ink);
}
body.ktc-ripple .ktc-quote .ktc-quote-name {
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ktc-muted);
	padding-top: 14px;
}

/* Legal / long-form pages */
body.ktc-ripple .ktc-legal { max-width: 820px; margin: 0 auto; }
body.ktc-ripple .ktc-legal h2 { font-size: 30px; padding-top: 18px; }
body.ktc-ripple .ktc-legal h3 { font-size: 22px; }
body.ktc-ripple .ktc-legal ul { padding-left: 1.2em; }
body.ktc-ripple .ktc-legal li { padding-bottom: 6px; }

/* ---------- Toggles (FAQs) ---------- */

body.ktc-ripple .et_pb_toggle {
	border: 1px solid var(--ktc-hairline);
	border-radius: var(--ktc-radius-md);
	background: var(--ktc-white);
	margin-bottom: 12px !important;
	padding: 22px 26px;
}
body.ktc-ripple .et_pb_toggle_title,
body.ktc-ripple .et_pb_toggle h5.et_pb_toggle_title {
	font-family: var(--ktc-font-sans);
	font-weight: 600;
	font-size: 18px;
	color: var(--ktc-ink);
	padding-bottom: 0;
}
body.ktc-ripple .et_pb_toggle_title:before { color: var(--ktc-electric); }
body.ktc-ripple .et_pb_toggle_open { border-color: var(--ktc-electric); }

/* ---------- Forms ---------- */

body.ktc-ripple .et_pb_contact_form input,
body.ktc-ripple .et_pb_contact_form textarea,
body.ktc-ripple .et_pb_contact_form select {
	background: var(--ktc-white) !important;
	border: 1px solid #9DB8E0 !important;
	border-radius: var(--ktc-radius-sm) !important;
	color: var(--ktc-ink) !important;
	font-family: var(--ktc-font-sans);
	font-size: 16px !important;
	padding: 14px 16px !important;
}
body.ktc-ripple .et_pb_contact_form input:focus,
body.ktc-ripple .et_pb_contact_form textarea:focus {
	border-color: var(--ktc-electric) !important;
	box-shadow: 0 0 0 3px rgba(20, 99, 255, .2);
}
body.ktc-ripple .et_pb_contact_form ::placeholder { color: #5F7397; opacity: 1; }
body.ktc-ripple .et_pb_contact_main_title { font-family: var(--ktc-font-display); }

/* ---------- Blog ---------- */

body.ktc-ripple .et_pb_blog_grid .et_pb_post {
	border: 1px solid var(--ktc-hairline);
	border-radius: var(--ktc-radius-md);
	overflow: hidden;
	padding: 0 0 22px;
}
body.ktc-ripple .et_pb_blog_grid .et_pb_post .entry-title,
body.ktc-ripple .et_pb_blog_grid .et_pb_post .post-meta,
body.ktc-ripple .et_pb_blog_grid .et_pb_post .post-content { padding: 0 22px; }
body.ktc-ripple .et_pb_blog_grid .et_pb_post .entry-title { padding-top: 20px; font-size: 22px; }
body.ktc-ripple .et_pb_post .entry-title a { color: var(--ktc-ink); }
body.ktc-ripple .et_pb_post .post-meta,
body.ktc-ripple .et_pb_post .post-meta a { color: var(--ktc-muted); font-size: 14px; }
body.ktc-ripple.single-post .entry-content { font-size: 18px; }

/* ---------- Footer ---------- */

body.ktc-ripple #main-footer {
	background-color: var(--ktc-navy);
	background-image: repeating-radial-gradient(circle at 100% 100%, transparent 0 60px, rgba(92, 200, 255, .10) 60px 62px, transparent 62px 84px);
}
body.ktc-ripple #main-footer,
body.ktc-ripple #main-footer p,
body.ktc-ripple #footer-widgets .footer-widget li,
body.ktc-ripple #footer-widgets .footer-widget a { color: #C9DCF6; }
body.ktc-ripple #footer-widgets .footer-widget h4 { color: var(--ktc-white); font-family: var(--ktc-font-display); }
body.ktc-ripple #footer-bottom { background: rgba(0, 0, 0, .25); }
body.ktc-ripple #footer-info,
body.ktc-ripple #footer-info a { color: #A9C2E6; font-size: 14px; }
body.ktc-ripple #et-footer-nav { background: var(--ktc-navy-2); }
body.ktc-ripple .bottom-nav a { color: #DCEBFF; font-weight: 500; }
body.ktc-ripple .bottom-nav a:hover { color: var(--ktc-sky); opacity: 1; }

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
	body.ktc-ripple * { transition: none !important; animation: none !important; }
}

/* Small trust line under the home hero buttons */
body.ktc-ripple .ktc-trust { margin-top: 18px; }
body.ktc-ripple .ktc-hero .ktc-trust p {
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: var(--ktc-sky);
}