/* ==========================================================================
   Cabinet Josselin — theme styles (on top of Bootstrap 5.3)
   ========================================================================== */

:root {
	--cj-navy: #0f1f3d;
	--cj-navy-2: #172b52;
	--cj-gold: #b8935a;
	--cj-gold-dark: #9c7843;
	--cj-cream: #f7f3ec;
	--cj-ink: #1d2433;
	--cj-muted: #5f6878;
	--cj-border: #e6e1d8;
	--cj-serif: "Crimson Pro", Georgia, "Times New Roman", serif;
	--cj-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

	--bs-body-font-family: var(--cj-sans);
	--bs-body-color: var(--cj-ink);
	--bs-secondary-color: var(--cj-muted);
	--bs-link-color: var(--cj-navy);
	--bs-link-color-rgb: 15, 31, 61;
	--bs-link-hover-color: var(--cj-gold-dark);
	--bs-link-hover-color-rgb: 156, 120, 67;
	--bs-border-radius: .25rem;
	--bs-border-color: var(--cj-border);
}

body {
	font-size: 1rem;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
	font-family: var(--cj-serif);
	font-weight: 600;
	color: var(--cj-navy);
	line-height: 1.15;
}

a { text-decoration: none; transition: color .2s ease; }

.text-gold { color: var(--cj-gold) !important; }
.bg-navy { background: var(--cj-navy); }
.bg-cream { background: var(--cj-cream); }

/* Buttons ----------------------------------------------------------------- */
.btn { font-weight: 500; letter-spacing: .02em; border-radius: 2px; padding: .7rem 1.5rem; }
.btn-lg { padding: .9rem 2rem; font-size: 1rem; }
.btn-gold {
	--bs-btn-color: #fff; --bs-btn-bg: var(--cj-gold); --bs-btn-border-color: var(--cj-gold);
	--bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--cj-gold-dark); --bs-btn-hover-border-color: var(--cj-gold-dark);
	--bs-btn-active-bg: var(--cj-gold-dark); --bs-btn-active-color: #fff;
	--bs-btn-focus-shadow-rgb: 184, 147, 90;
}
.btn-navy {
	--bs-btn-color: #fff; --bs-btn-bg: var(--cj-navy); --bs-btn-border-color: var(--cj-navy);
	--bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--cj-navy-2); --bs-btn-hover-border-color: var(--cj-navy-2);
	--bs-btn-active-bg: var(--cj-navy-2); --bs-btn-active-color: #fff;
}

.kicker {
	display: inline-block;
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--cj-gold);
	margin-bottom: .9rem;
}
.kicker::before {
	content: "";
	display: inline-block;
	width: 28px;
	height: 1px;
	background: currentColor;
	vertical-align: middle;
	margin-right: .75rem;
}

.link-arrow { font-weight: 600; color: var(--cj-gold-dark); display: inline-flex; align-items: center; gap: .4rem; }
.link-arrow i { transition: transform .2s ease; }
.link-arrow:hover i, .expertise-card:hover .link-arrow i { transform: translateX(4px); }

/* Top bar & navbar -------------------------------------------------------- */
.topbar { background: var(--cj-navy); color: rgba(255,255,255,.75); font-size: .85rem; padding: .5rem 0; }
.topbar a { color: rgba(255,255,255,.75); }
.topbar a:hover { color: var(--cj-gold); }

.site-navbar { background: #fff; box-shadow: 0 1px 0 var(--cj-border); padding: 1rem 0; transition: padding .2s ease, box-shadow .2s ease; }
.site-navbar.is-scrolled { padding: .5rem 0; box-shadow: 0 6px 24px rgba(15,31,61,.08); }
.brand-text { font-family: var(--cj-serif); font-size: 1.6rem; font-weight: 700; color: var(--cj-navy) !important; display: flex; align-items: center; gap: .6rem; }
.brand-mark { display: inline-grid; place-items: center; width: 40px; height: 40px; background: var(--cj-navy); color: var(--cj-gold); border-radius: 2px; font-size: 1.1rem; }
.custom-logo { max-height: 56px; width: auto; }
.site-navbar .nav-link { font-weight: 500; color: var(--cj-ink); position: relative; }
.site-navbar .nav-link:hover, .site-navbar .nav-link.active { color: var(--cj-gold-dark); }
@media (min-width: 992px) {
	.site-navbar .nav-link::after {
		content: ""; position: absolute; left: .5rem; right: .5rem; bottom: .2rem; height: 2px;
		background: var(--cj-gold); transform: scaleX(0); transition: transform .25s ease;
	}
	.site-navbar .nav-link:hover::after, .site-navbar .nav-link.active::after { transform: scaleX(1); }
	.site-navbar .dropdown-toggle::after { display: none; }
}
.dropdown-item:active { background: var(--cj-gold); }

/* Hero -------------------------------------------------------------------- */
.hero {
	position: relative;
	padding: 9rem 0 8rem;
	color: #fff;
	background:
		linear-gradient(100deg, rgba(15,31,61,.96) 0%, rgba(15,31,61,.85) 55%, rgba(15,31,61,.55) 100%),
		var(--hero-image, radial-gradient(circle at 85% 30%, #2a4275 0%, #0f1f3d 60%));
	background-size: cover;
	background-position: center;
	overflow: hidden;
}
.hero::after {
	content: "";
	position: absolute;
	right: -120px;
	top: 50%;
	width: 520px;
	height: 520px;
	transform: translateY(-50%);
	border: 1px solid rgba(184,147,90,.25);
	border-radius: 50%;
	box-shadow: 0 0 0 60px rgba(184,147,90,.04), 0 0 0 120px rgba(184,147,90,.03);
	pointer-events: none;
}

/* Hero with photo: navy fades in from the left, subject stays visible on the right */
.hero.has-image {
	min-height: 680px;
	display: flex;
	align-items: center;
	background:
		linear-gradient(90deg, rgba(10,21,48,1) 0%, rgba(15,31,61,.96) 38%, rgba(15,31,61,.6) 55%, rgba(15,31,61,.1) 78%, rgba(15,31,61,0) 100%),
		linear-gradient(0deg, rgba(10,21,48,.6) 0%, rgba(10,21,48,0) 30%),
		var(--hero-image) right center / auto 100% no-repeat,
		linear-gradient(90deg, #0a1530 0%, #1a1414 100%);
}
.hero.has-image::after { display: none; }
.hero.has-image::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 4px;
	background: linear-gradient(180deg, transparent, var(--cj-gold) 30%, var(--cj-gold) 70%, transparent);
}
.hero.has-image .hero-title { text-shadow: 0 2px 24px rgba(0,0,0,.25); }
.hero.has-image .hero-title::after {
	content: "";
	display: block;
	width: 72px;
	height: 3px;
	margin-top: 1.5rem;
	background: var(--cj-gold);
}
@media (max-width: 991.98px) {
	.hero.has-image {
		min-height: 0;
		background:
			linear-gradient(180deg, rgba(15,31,61,.82) 0%, rgba(10,21,48,.95) 100%),
			var(--hero-image) 70% 30% / cover no-repeat,
			var(--cj-navy);
	}
}
.hero-title { color: #fff; font-weight: 600; margin-bottom: 1.5rem; }
.hero-lead { color: rgba(255,255,255,.8); max-width: 38rem; }

.stats-strip { background: var(--cj-navy-2); color: #fff; padding: 2.5rem 0; border-top: 1px solid rgba(255,255,255,.06); }
.stat-value { font-family: var(--cj-serif); font-size: 2.6rem; font-weight: 700; color: var(--cj-gold); line-height: 1; }
.stat-label { font-size: .85rem; text-transform: uppercase; letter-spacing: .12em; color: rgba(255,255,255,.7); margin-top: .5rem; }

/* Sections ---------------------------------------------------------------- */
.section { padding: 6rem 0; }
.section-heading { margin-bottom: 3.5rem; }
.section-heading.text-center .kicker::after {
	content: ""; display: inline-block; width: 28px; height: 1px; background: currentColor; vertical-align: middle; margin-left: .75rem;
}

/* Practice area cards */
.expertise-card {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 2.25rem;
	background: #fff;
	border: 1px solid var(--cj-border);
	border-radius: 2px;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.expertise-card::before {
	content: ""; position: absolute; left: 0; top: 0; height: 3px; width: 0; background: var(--cj-gold); transition: width .3s ease;
}
.expertise-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(15,31,61,.08); border-color: transparent; }
.expertise-card:hover::before { width: 100%; }
.expertise-card h3 a { color: var(--cj-navy); }
.expertise-card .link-arrow { margin-top: auto !important; padding-top: 1rem; }
.expertise-icon {
	display: grid; place-items: center; width: 60px; height: 60px; margin-bottom: 1.5rem;
	background: var(--cj-cream); color: var(--cj-gold-dark); font-size: 1.6rem; border-radius: 2px;
}

/* About */
.about-visual { position: relative; padding: 0 2rem 2rem 0; max-width: 400px; margin-inline: auto; }
.about-visual img { width: 100%; }
.about-placeholder {
	aspect-ratio: 4 / 3.4; display: grid; place-items: center; font-size: 6rem;
	color: rgba(184,147,90,.6); background: linear-gradient(135deg, var(--cj-navy), var(--cj-navy-2)); border-radius: 2px;
}
.about-badge {
	position: absolute; right: 0; bottom: 0; background: var(--cj-gold); color: #fff; padding: 1.5rem 1.75rem; text-align: center; box-shadow: 0 14px 30px rgba(15,31,61,.18);
}
.about-badge strong { display: block; font-family: var(--cj-serif); font-size: 2.6rem; line-height: 1; }
.about-badge span { font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; }
.check-list { list-style: none; padding: 0; }
.check-list li { position: relative; padding-left: 2rem; margin-bottom: .7rem; font-weight: 500; }
.check-list li::before {
	content: "\F26A"; font-family: "bootstrap-icons"; position: absolute; left: 0; top: 0; color: var(--cj-gold);
}

/* Team */
.team-card { position: relative; background: #fff; }
.team-photo { position: relative; overflow: hidden; aspect-ratio: 4 / 5; background: var(--cj-cream); }
.team-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.team-card:hover .team-photo img { transform: scale(1.04); }
.team-initials {
	width: 100%; height: 100%; display: grid; place-items: center;
	font-family: var(--cj-serif); font-size: 4rem; font-weight: 600; color: var(--cj-gold);
	background: linear-gradient(160deg, var(--cj-navy-2), var(--cj-navy));
}
.team-body { padding: 1.25rem 0 0; }
.team-body h3 a { color: var(--cj-navy); }
.team-card:hover .team-body h3 a { color: var(--cj-gold-dark); }
.team-role { color: var(--cj-gold-dark); font-size: .85rem; font-weight: 500; text-transform: uppercase; letter-spacing: .08em; }

/* Testimonials */
.testimonials figure { max-width: 46rem; }
.quote-icon { font-size: 3.5rem; color: var(--cj-gold); line-height: 1; }
.testimonial-text { font-family: var(--cj-serif); font-size: 1.6rem; font-style: italic; line-height: 1.5; color: rgba(255,255,255,.92); margin: 1rem 0 2rem; }
.testimonial-text p { margin: 0; }
.testimonials figcaption strong { display: block; color: #fff; font-size: 1.05rem; }
.testimonials figcaption span { color: var(--cj-gold); font-size: .85rem; }
.testimonials .carousel-indicators [data-bs-target] { width: 10px; height: 10px; border-radius: 50%; border: 0; background: var(--cj-gold); }

/* Posts */
.post-card { background: #fff; border: 1px solid var(--cj-border); border-radius: 2px; overflow: hidden; transition: box-shadow .25s ease, transform .25s ease; }
.post-card:hover { box-shadow: 0 18px 40px rgba(15,31,61,.08); transform: translateY(-3px); }
.post-card-thumb { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--cj-cream); }
.post-card-thumb img { width: 100%; height: 100%; object-fit: cover; }
.post-card-placeholder { width: 100%; height: 100%; display: grid; place-items: center; font-size: 3rem; color: var(--cj-gold); }
.post-card h3 a { color: var(--cj-navy); }
.post-card h3 a:hover { color: var(--cj-gold-dark); }
.post-meta a { color: var(--cj-gold-dark); }

/* CTA band */
.cta-band { background: linear-gradient(110deg, var(--cj-navy) 0%, var(--cj-navy-2) 100%); color: #fff; padding: 4.5rem 0; border-top: 3px solid var(--cj-gold); }

/* Inner pages ------------------------------------------------------------- */
.page-banner {
	background: linear-gradient(110deg, var(--cj-navy) 0%, var(--cj-navy-2) 100%);
	color: #fff;
	padding: 4.5rem 0;
	position: relative;
	overflow: hidden;
}
.page-banner h1 { color: #fff; }
.page-banner .breadcrumb { --bs-breadcrumb-divider-color: rgba(255,255,255,.4); --bs-breadcrumb-item-active-color: #fff; font-size: .85rem; }
.page-banner .breadcrumb a { color: var(--cj-gold); }

.entry-content { font-size: 1.05rem; }
.entry-content h2 { margin: 2.5rem 0 1rem; }
.entry-content h3 { margin: 2rem 0 .75rem; }
.entry-content img { max-width: 100%; height: auto; }
.entry-content blockquote {
	border-left: 3px solid var(--cj-gold); padding: .5rem 0 .5rem 1.5rem; margin: 2rem 0;
	font-family: var(--cj-serif); font-size: 1.4rem; font-style: italic; color: var(--cj-navy);
}
.entry-content ul li::marker { color: var(--cj-gold); }
.entry-content .profile-block { margin: 2.5rem 0; background: var(--cj-cream); align-items: center; }
.entry-content .profile-block .wp-block-media-text__media img { width: 100%; height: auto; display: block; }
.entry-content .profile-block .wp-block-media-text__content { padding: 2rem 2.5rem; }
.entry-content .profile-block h2 { margin-top: 0; }
@media (max-width: 600px) { .entry-content .profile-block .wp-block-media-text__content { padding: 1.5rem; } }

.side-nav { border: 1px solid var(--cj-border); padding: 1.75rem; }
.side-nav li a { display: flex; gap: .75rem; align-items: center; padding: .65rem 0; border-bottom: 1px solid var(--cj-border); color: var(--cj-ink); }
.side-nav li:last-child a { border-bottom: 0; }
.side-nav li a i { color: var(--cj-gold); }
.side-nav li a:hover, .side-nav li a.active { color: var(--cj-gold-dark); font-weight: 600; }

.contact-panel { background: var(--cj-navy); color: rgba(255,255,255,.85); padding: 2rem; border-top: 3px solid var(--cj-gold); }
.contact-list li, .profile-contact li, .footer-contact li { display: flex; gap: 1rem; margin-bottom: 1.25rem; }
.contact-list i { color: var(--cj-gold); font-size: 1.25rem; }
.contact-list strong { display: block; color: #fff; font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; margin-bottom: .2rem; }
.contact-list a { color: rgba(255,255,255,.85); }
.contact-list a:hover { color: var(--cj-gold); }
.profile-contact i { color: var(--cj-gold); }

.contact-form .form-control, .contact-form .form-select { border-radius: 2px; padding: .75rem 1rem; }
.form-control:focus, .form-select:focus { border-color: var(--cj-gold); box-shadow: 0 0 0 .2rem rgba(184,147,90,.2); }
.form-check-input:checked { background-color: var(--cj-gold); border-color: var(--cj-gold); }

.pagination { --bs-pagination-color: var(--cj-navy); --bs-pagination-active-bg: var(--cj-navy); --bs-pagination-active-border-color: var(--cj-navy); --bs-pagination-hover-color: var(--cj-gold-dark); }
.tag-list a { font-size: .8rem; padding: .3rem .8rem; border: 1px solid var(--cj-border); color: var(--cj-muted); }
.widget-title { margin-bottom: 1rem; }
.widget ul li { padding: .3rem 0; }

/* WordPress core classes */
.alignleft { float: left; margin: 0 1.5rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1.5rem; }
.aligncenter { display: block; margin: 0 auto 1rem; }
.wp-caption-text, figcaption.wp-element-caption { font-size: .85rem; color: var(--cj-muted); }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); }
.comment-list .comment { margin-bottom: 1.5rem; }
.comment-form p { margin-bottom: 1rem; }
.comment-form label { display: block; font-weight: 500; margin-bottom: .35rem; }
.comment-form .comment-form-cookies-consent { display: flex; gap: .5rem; align-items: flex-start; font-size: .875rem; color: var(--cj-muted); }
.comment-form .comment-form-cookies-consent label { display: inline; font-weight: 400; margin: 0; }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea,
.wp-block-search__input {
	width: 100%; padding: .7rem 1rem; border: 1px solid var(--cj-border); border-radius: 2px; background: #fff; color: var(--cj-ink);
}
.comment-form input:focus, .comment-form textarea:focus, .wp-block-search__input:focus { outline: 0; border-color: var(--cj-gold); box-shadow: 0 0 0 .2rem rgba(184,147,90,.2); }
.comment-notes, .logged-in-as { font-size: .875rem; color: var(--cj-muted); }
.wp-block-search__label { font-weight: 600; margin-bottom: .5rem; }
.wp-block-search__inside-wrapper { display: flex; gap: .5rem; }
.wp-block-search__button { background: var(--cj-navy); color: #fff; border: 0; border-radius: 2px; padding: .6rem 1rem; font-weight: 500; }
.wp-block-search__button:hover { background: var(--cj-navy-2); }
.widget h2, .widget .wp-block-heading { font-size: 1.25rem; margin-bottom: .75rem; }
.widget .wp-block-latest-posts, .widget .wp-block-archives, .widget .wp-block-categories { list-style: none; padding: 0; margin: 0; }
.comment-list .children { list-style: none; padding-left: 2rem; }

/* WhatsApp ---------------------------------------------------------------- */
.btn-whatsapp {
	--bs-btn-color: #fff; --bs-btn-bg: #25d366; --bs-btn-border-color: #25d366;
	--bs-btn-hover-color: #fff; --bs-btn-hover-bg: #1ebe5b; --bs-btn-hover-border-color: #1ebe5b;
	--bs-btn-active-bg: #1ebe5b; --bs-btn-active-color: #fff;
}
.whatsapp-float {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 1040;
	display: flex;
	align-items: center;
	gap: .6rem;
	height: 60px;
	min-width: 60px;
	padding: 0 18px;
	border-radius: 30px;
	background: #25d366;
	color: #fff;
	font-size: 1.75rem;
	box-shadow: 0 10px 30px rgba(10,21,48,.25);
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.whatsapp-float::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	border: 2px solid #25d366;
	animation: whatsapp-pulse 2.4s ease-out infinite;
	pointer-events: none;
}
.whatsapp-float:hover { color: #fff; background: #1ebe5b; transform: translateY(-3px); box-shadow: 0 14px 34px rgba(10,21,48,.3); }
.whatsapp-float-label {
	max-width: 0;
	overflow: hidden;
	white-space: nowrap;
	font-size: .95rem;
	font-weight: 600;
	transition: max-width .3s ease;
}
.whatsapp-float:hover .whatsapp-float-label, .whatsapp-float:focus-visible .whatsapp-float-label { max-width: 240px; }
@keyframes whatsapp-pulse {
	0% { transform: scale(1); opacity: .7; }
	70%, 100% { transform: scale(1.35); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .whatsapp-float::before { animation: none; } }
@media (max-width: 575.98px) { .whatsapp-float { right: 16px; bottom: 16px; height: 56px; min-width: 56px; padding: 0 16px; } }

/* Footer ------------------------------------------------------------------ */
.site-footer { background: #0a1530; color: rgba(255,255,255,.65); padding: 5rem 0 0; font-size: .95rem; }
.footer-brand { font-family: var(--cj-serif); font-size: 1.8rem; font-weight: 700; color: #fff; }
.footer-brand i { color: var(--cj-gold); }
.footer-title { font-family: var(--cj-sans); font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .15em; color: #fff; margin-bottom: 1.25rem; }
.footer-links li { margin-bottom: .55rem; }
.site-footer a { color: rgba(255,255,255,.65); }
.site-footer a:hover { color: var(--cj-gold); }
.footer-contact i { color: var(--cj-gold); }
.social { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; }
.social:hover { border-color: var(--cj-gold); }
.footer-bottom { margin-top: 4rem; padding: 1.5rem 0; border-top: 1px solid rgba(255,255,255,.08); font-size: .8rem; }

/* Responsive -------------------------------------------------------------- */
@media (max-width: 991.98px) {
	.hero { padding: 6rem 0 5rem; }
	.hero::after { display: none; }
	.section { padding: 4rem 0; }
	.site-navbar .offcanvas { max-width: 320px; }
	.site-navbar .nav-link { padding: .75rem 0; border-bottom: 1px solid var(--cj-border); }
}
@media (max-width: 575.98px) {
	.testimonial-text { font-size: 1.3rem; }
	.about-visual { padding: 0 1rem 1rem 0; }
}