/*
Theme Name: Kadence Child – NTC Côte d'Azur
Theme URI: https://www.beeseen.nl/
Description: Child theme of Kadence, styled to match the NOB brand identity.
Author: BeeSeen
Template: kadence
Version: 1.0.0
License: GNU General Public License v3.0 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: kadence-child
*/

/* =========================================================
   Design tokens — NOB brand palette
   ========================================================= */
:root {
	--ntc-purple:      #361b4e;
	--ntc-purple-mid:  #9b8da7;
	--ntc-purple-soft: #f1eff2;
	--ntc-blue:        #3d6af5;
	--ntc-green:       #7edb95;
	--ntc-orange:      #ff6f3b;
	--ntc-yellow:      #f1c530;
	--ntc-pink:        #d534f7;
	--ntc-grey:        #e7e7e7;
	--ntc-light-grey:  #f7f7f7;
	--ntc-dark-text:   #484848;
	--ntc-white:       #ffffff;

	/* Kadence custom property overrides */
	--global-palette1: var(--ntc-purple);
	--global-palette2: var(--ntc-blue);
	--global-palette3: var(--ntc-purple);
	--global-palette4: var(--ntc-purple-mid);
	--global-palette5: var(--ntc-dark-text);
	--global-palette6: #333333;
	--global-palette7: var(--ntc-grey);
	--global-palette8: var(--ntc-white);
	--global-palette9: var(--ntc-light-grey);
}

/* =========================================================
   Typography — DM Sans (loaded via functions.php)
   ========================================================= */
body,
.wp-block-kadence-richtext,
p,
li,
td,
th {
	font-family: 'DM Sans', sans-serif;
	color: var(--ntc-dark-text);
	line-height: 1.6;
}

h1, h2, h3, h4, h5, h6,
.site-title,
.wp-block-heading {
	font-family: 'DM Sans', sans-serif;
	font-weight: 700;
	color: var(--ntc-purple);
	line-height: 1.2;
}

h1 { font-size: clamp(2rem, 5vw, 3.75rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2.25rem); }
h3 { font-size: clamp(1.25rem, 2.5vw, 1.75rem); }
h4 { font-size: 1.25rem; }

a {
	color: var(--ntc-purple);
	text-decoration: none;
	transition: color 0.2s ease;
}

a:hover {
	color: var(--ntc-blue);
}

/* =========================================================
   Header & navigation
   ========================================================= */
#masthead,
.site-header,
.kadence-header {
	background-color: var(--ntc-white);
	border-bottom: 1px solid var(--ntc-grey);
}

/* Logo */
.site-branding .site-title a,
.custom-logo-link {
	color: var(--ntc-purple);
}

/* Nav links */
.primary-menu > li > a,
.main-navigation a,
.kadence-navigation a {
	font-family: 'DM Sans', sans-serif;
	font-size: 1rem;
	font-weight: 600;
	color: var(--ntc-dark-text);
	padding: 0.25rem 0;
	position: relative;
	text-decoration: none;
}

/* Hover underline animation */
.primary-menu > li > a::after,
.main-navigation > div > ul > li > a::after,
.kadence-navigation .menu > li > a::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 0;
	height: 2px;
	background-color: currentColor;
	transition: width 0.25s ease;
}

.primary-menu > li > a:hover::after,
.primary-menu > li.current-menu-item > a::after,
.kadence-navigation .menu > li > a:hover::after,
.kadence-navigation .menu > li.current-menu-item > a::after {
	width: 100%;
}

/* Dropdown menus */
.primary-menu .sub-menu,
.kadence-navigation .sub-menu {
	background-color: var(--ntc-white);
	border-radius: 0.5rem;
	box-shadow: 0 8px 24px rgba(54, 27, 78, 0.12);
	border: none;
	padding: 1.25rem;
}

.primary-menu .sub-menu a,
.kadence-navigation .sub-menu a {
	color: var(--ntc-dark-text);
	font-weight: 400;
	font-size: 0.9375rem;
	padding: 0.35rem 0;
}

.primary-menu .sub-menu a:hover,
.kadence-navigation .sub-menu a:hover {
	color: var(--ntc-purple);
}

/* =========================================================
   Buttons
   ========================================================= */
.wp-block-button__link,
.button,
.btn,
a.button,
input[type="submit"],
button[type="submit"] {
	background-color: var(--ntc-purple);
	color: var(--ntc-white) !important;
	font-family: 'DM Sans', sans-serif;
	font-weight: 600;
	font-size: 1rem;
	border-radius: 0.375rem;
	padding: 0.75rem 1.75rem;
	border: 2px solid var(--ntc-purple);
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
	text-decoration: none;
	display: inline-block;
}

.wp-block-button__link:hover,
.button:hover,
.btn:hover,
a.button:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
	background-color: var(--ntc-white);
	color: var(--ntc-purple) !important;
}

/* Outline / ghost button */
.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	color: var(--ntc-purple) !important;
	border-color: var(--ntc-purple);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background-color: var(--ntc-purple);
	color: var(--ntc-white) !important;
}

/* =========================================================
   Hero / banner sections
   ========================================================= */
.wp-block-cover,
.hero-section {
	position: relative;
}

/* =========================================================
   Content sections
   ========================================================= */
.entry-content,
.wp-block-group {
	color: var(--ntc-dark-text);
}

/* Purple background sections */
.has-ntc-purple-background-color,
.wp-block-group.has-purple-background {
	background-color: var(--ntc-purple);
	color: var(--ntc-white);
}

.has-ntc-purple-background-color h1,
.has-ntc-purple-background-color h2,
.has-ntc-purple-background-color h3,
.has-ntc-purple-background-color p,
.wp-block-group.has-purple-background h1,
.wp-block-group.has-purple-background h2,
.wp-block-group.has-purple-background p {
	color: var(--ntc-white);
}

/* Off-white sections */
.wp-block-group.has-background:not([class*="has-ntc-purple"]) {
	background-color: var(--ntc-purple-soft);
}

/* Stats / number cards */
.wp-block-column.stat-card {
	background-color: var(--ntc-purple-soft);
	border-radius: 0.75rem;
	padding: 2rem;
	text-align: center;
}

/* =========================================================
   Footer
   ========================================================= */
#colophon,
.site-footer,
.kadence-footer {
	background-color: var(--ntc-purple);
	color: rgba(255, 255, 255, 0.85);
	font-family: 'DM Sans', sans-serif;
}

#colophon a,
.site-footer a,
.kadence-footer a {
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
}

#colophon a:hover,
.site-footer a:hover,
.kadence-footer a:hover {
	color: var(--ntc-white);
	text-decoration: underline;
}

#colophon h2,
#colophon h3,
#colophon h4,
.site-footer h2,
.site-footer h3,
.site-footer h4 {
	color: var(--ntc-white);
	font-size: 1rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-bottom: 1rem;
}

/* Footer bottom bar */
.site-footer .footer-bottom,
.kadence-footer .footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	padding-top: 1.25rem;
	margin-top: 2rem;
	font-size: 0.875rem;
	color: rgba(255, 255, 255, 0.6);
}

/* =========================================================
   Forms (WPForms)
   ========================================================= */
.wpforms-form input[type="text"],
.wpforms-form input[type="email"],
.wpforms-form input[type="tel"],
.wpforms-form textarea,
.wpforms-form select {
	border: 1px solid var(--ntc-grey);
	border-radius: 0.375rem;
	padding: 0.625rem 0.875rem;
	font-family: 'DM Sans', sans-serif;
	font-size: 1rem;
	color: var(--ntc-dark-text);
	background-color: var(--ntc-white);
	transition: border-color 0.2s ease;
	width: 100%;
}

.wpforms-form input:focus,
.wpforms-form textarea:focus,
.wpforms-form select:focus {
	outline: none;
	border-color: var(--ntc-purple);
	box-shadow: 0 0 0 3px rgba(54, 27, 78, 0.15);
}

.wpforms-submit-container .wpforms-submit {
	background-color: var(--ntc-purple);
	border-color: var(--ntc-purple);
	color: var(--ntc-white);
	font-family: 'DM Sans', sans-serif;
	font-weight: 600;
	border-radius: 0.375rem;
	padding: 0.75rem 2rem;
}

.wpforms-submit-container .wpforms-submit:hover {
	background-color: transparent;
	color: var(--ntc-purple);
}

/* =========================================================
   Utility classes for blocks
   ========================================================= */
.ntc-bg-purple      { background-color: var(--ntc-purple); }
.ntc-bg-blue        { background-color: var(--ntc-blue); }
.ntc-bg-green       { background-color: var(--ntc-green); }
.ntc-bg-orange      { background-color: var(--ntc-orange); }
.ntc-bg-yellow      { background-color: var(--ntc-yellow); }
.ntc-bg-soft        { background-color: var(--ntc-purple-soft); }
.ntc-text-purple    { color: var(--ntc-purple); }
.ntc-text-white     { color: var(--ntc-white); }