/*
 * Creditor Single Page — creditor-single.css
 * Scoped under .creditor-single to avoid Elementor / Hello theme conflicts.
 */

:root {
	--cd-max-width: 860px;
	--cd-primary:   #1a56db;
	--cd-heading:   #111827;
	--cd-body:      #374151;
	--cd-muted:     #6b7280;
	--cd-border:    #e5e7eb;
	--cd-bg-light:  #f9fafb;
	--cd-star:      #EF9F27;
	--cd-cta-bg:    #eff6ff;
	--cd-radius:    8px;
}

.creditor-single {
	max-width: var(--cd-max-width);
	margin:    0 auto;
	padding:   24px 16px 48px;
	color:     var(--cd-body);
	font-size: 16px;
	line-height: 1.7;
}

/* --- Breadcrumb --- */
.creditor-single__breadcrumb ol {
	list-style: none;
	padding:    0;
	margin:     0 0 20px;
	display:    flex;
	flex-wrap:  wrap;
	gap:        4px;
	font-size:  13px;
	color:      var(--cd-muted);
}
.creditor-single__breadcrumb li {
	display:     flex;
	align-items: center;
	gap:         4px;
}
.creditor-single__breadcrumb li + li::before {
	content: '›';
}
.creditor-single__breadcrumb a {
	color:           var(--cd-primary);
	text-decoration: none;
}
.creditor-single__breadcrumb a:hover {
	text-decoration: underline;
}

/* --- Hero --- */
.creditor-single__hero {
	margin-bottom: 40px;
}
.creditor-single__h1 {
	font-size:   clamp(24px, 4vw, 36px);
	font-weight: 700;
	color:       var(--cd-heading);
	line-height: 1.3;
	margin:      0 0 16px;
}
.creditor-single__hero-intro { font-size: 17px; }
.creditor-single__hero-intro p { margin: 0 0 16px; }
.creditor-single__hero-intro p:last-child { margin-bottom: 0; }

/* --- Body sections --- */
.creditor-single__section {
	margin-bottom: 40px;
}
.creditor-single__section-heading {
	font-size:   clamp(18px, 3vw, 24px);
	font-weight: 700;
	color:       var(--cd-heading);
	margin:      0 0 16px;
	line-height: 1.3;
}
.creditor-single__section-content p        { margin: 0 0 16px; }
.creditor-single__section-content p:last-child { margin-bottom: 0; }
.creditor-single__section-content ul,
.creditor-single__section-content ol      { padding-left: 24px; margin: 0 0 16px; }
.creditor-single__section-content li      { margin-bottom: 6px; }

/* Logo in who_collect_for */
.creditor-single__logo { margin-bottom: 16px; }
.creditor-single__logo img {
	max-width:     200px;
	height:        auto;
	border:        1px solid var(--cd-border);
	border-radius: 4px;
	padding:       8px;
	background:    #fff;
}

/* --- Feefo reviews --- */
.creditor-single__feefo {
	margin-bottom: 40px;
	padding:       24px;
	background:    var(--cd-bg-light);
	border-radius: var(--cd-radius);
	border:        1px solid var(--cd-border);
}
.creditor-single__review-grid {
	display:               grid;
	grid-template-columns: repeat(3, 1fr);
	gap:                   16px;
	margin-top:            20px;
}
@media (max-width: 640px) {
	.creditor-single__review-grid { grid-template-columns: 1fr; }
}
.creditor-single__review-card {
	background:    #fff;
	border-radius: var(--cd-radius);
	padding:       16px;
	border:        1px solid var(--cd-border);
}
.creditor-single__review-stars {
	color:         var(--cd-star);
	font-size:     16px;
	margin-bottom: 8px;
}
.creditor-single__review-quote {
	font-size:  14px;
	color:      var(--cd-body);
	line-height: 1.6;
	margin:     0 0 8px;
	font-style: italic;
}
.creditor-single__review-author {
	font-size:  12px;
	color:      var(--cd-muted);
	font-style: normal;
}

/* --- FAQ accordion --- */
.creditor-single__faq {
	margin-bottom: 40px;
}
.creditor-single__faq-list {
	border:        1px solid var(--cd-border);
	border-radius: var(--cd-radius);
	overflow:      hidden;
}
.creditor-single__faq-item {
	border-bottom: 1px solid var(--cd-border);
}
.creditor-single__faq-item:last-child { border-bottom: none; }
.creditor-single__faq-question {
	margin:      0;
	font-size:   inherit;
	font-weight: inherit;
}
.creditor-single__faq-btn {
	display:         flex;
	justify-content: space-between;
	align-items:     center;
	width:           100%;
	padding:         16px 20px;
	background:      none;
	border:          none;
	cursor:          pointer;
	font-size:       15px;
	font-weight:     500;
	color:           var(--cd-heading);
	text-align:      left;
	gap:             12px;
	line-height:     1.4;
}
.creditor-single__faq-btn:hover         { background: var(--cd-bg-light); }
.creditor-single__faq-btn:focus-visible {
	outline:        2px solid var(--cd-primary);
	outline-offset: -2px;
}
.creditor-single__faq-icon {
	flex-shrink: 0;
	transition:  transform 0.2s ease;
	color:       var(--cd-muted);
}
.creditor-single__faq-btn[aria-expanded="true"] .creditor-single__faq-icon {
	transform: rotate(180deg);
}
.creditor-single__faq-answer {
	padding:    0 20px 16px;
	font-size:  15px;
	color:      var(--cd-body);
	line-height: 1.7;
}
.creditor-single__faq-answer p      { margin: 0 0 12px; }
.creditor-single__faq-answer p:last-child { margin-bottom: 0; }
.creditor-single__faq-answer ul     { padding-left: 20px; margin: 0 0 12px; }
.creditor-single__faq-answer li     { margin-bottom: 4px; }

/* --- Other creditors --- */
.creditor-single__related-creditors { margin-bottom: 40px; }
.creditor-single__creditor-grid {
	display:               grid;
	grid-template-columns: repeat(3, 1fr);
	gap:                   16px;
	margin-top:            16px;
}
@media (min-width: 480px) and (max-width: 760px) {
	.creditor-single__creditor-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 479px) {
	.creditor-single__creditor-grid { grid-template-columns: 1fr; }
}
.creditor-single__creditor-card {
	border:        1px solid var(--cd-border);
	border-radius: var(--cd-radius);
	padding:       16px;
	background:    #fff;
	display:       flex;
	flex-direction: column;
	gap:           8px;
}
.creditor-single__creditor-card-logo img {
	height:      32px;
	width:       auto;
	max-width:   120px;
	object-fit:  contain;
}
.creditor-single__creditor-card-title {
	font-size:   15px;
	font-weight: 600;
	margin:      0;
}
.creditor-single__creditor-card-title a {
	color:           var(--cd-heading);
	text-decoration: none;
}
.creditor-single__creditor-card-title a:hover { color: var(--cd-primary); }
.creditor-single__creditor-card-excerpt {
	font-size:  13px;
	color:      var(--cd-muted);
	margin:     0;
	line-height: 1.5;
	flex:       1;
}
.creditor-single__creditor-card-link {
	font-size:       13px;
	color:           var(--cd-primary);
	text-decoration: none;
	font-weight:     500;
}
.creditor-single__creditor-card-link:hover { text-decoration: underline; }

/* --- Related guides --- */
.creditor-single__guides { margin-bottom: 40px; }
.creditor-single__guide-grid {
	display:               grid;
	grid-template-columns: repeat(2, 1fr);
	gap:                   16px;
	margin-top:            16px;
}
@media (max-width: 560px) {
	.creditor-single__guide-grid { grid-template-columns: 1fr; }
}
.creditor-single__guide-card {
	background:    var(--cd-bg-light);
	border-radius: var(--cd-radius);
	padding:       16px;
	border:        1px solid var(--cd-border);
}
.creditor-single__guide-title {
	font-size:   15px;
	font-weight: 500;
	margin:      0 0 8px;
}
.creditor-single__guide-title a {
	color:           var(--cd-heading);
	text-decoration: none;
}
.creditor-single__guide-title a:hover { color: var(--cd-primary); }
.creditor-single__guide-link {
	font-size:       13px;
	color:           var(--cd-primary);
	text-decoration: none;
	font-weight:     500;
}
.creditor-single__guide-link:hover { text-decoration: underline; }

/* --- CTA --- */
.creditor-single__cta {
	background:    var(--cd-cta-bg);
	border:        1px solid #bfdbfe;
	border-radius: var(--cd-radius);
	padding:       48px 24px;
	text-align:    center;
	margin-bottom: 48px;
}
.creditor-single__cta-heading {
	font-size:   clamp(20px, 3vw, 26px);
	font-weight: 700;
	color:       var(--cd-heading);
	margin:      0 0 12px;
}
.creditor-single__cta-body {
	color:      var(--cd-muted);
	margin:     0 auto 24px;
	font-size:  15px;
	max-width:  540px;
	line-height: 1.6;
}
.creditor-single__cta-actions {
	display:   flex;
	gap:       12px;
	flex-wrap: wrap;
	justify-content: center;
}
.creditor-single__cta-phone,
.creditor-single__cta-btn {
	display:       inline-block;
	padding:       12px 28px;
	border-radius: 6px;
	font-weight:   600;
	font-size:     15px;
	text-decoration: none;
	transition:    background 0.15s ease, color 0.15s ease;
	line-height:   1;
}
.creditor-single__cta-phone {
	background:  #fff;
	color:       var(--cd-primary);
	border:      2px solid var(--cd-primary);
}
.creditor-single__cta-phone:hover {
	background: var(--cd-primary);
	color:      #fff;
}
.creditor-single__cta-btn {
	background: var(--cd-primary);
	color:      #fff;
	border:     2px solid var(--cd-primary);
}
.creditor-single__cta-btn:hover {
	background:   #1e40af;
	border-color: #1e40af;
}
@media (max-width: 440px) {
	.creditor-single__cta-actions  { flex-direction: column; align-items: center; }
	.creditor-single__cta-phone,
	.creditor-single__cta-btn      { width: 100%; max-width: 280px; text-align: center; }
}
