/* ===== BEDRIJF DETAIL PAGE ===== */

/* Breadcrumb */
.breadcrumb { padding: 16px 0; font-size: 0.8125rem; color: #9CA3AF; }
.breadcrumb a { color: #2563EB; font-weight: 500; }
.breadcrumb a:hover { color: #1e40af; }
.breadcrumb .sep { margin: 0 8px; color: #D1D5DB; }

/* Header */
.bedrijf-header { padding: 24px 0 32px; margin-bottom: 8px; }
.bedrijf-header h1 { font-size: 1.75rem; margin-bottom: 12px; letter-spacing: -0.01em; }
@media (min-width: 768px) { .bedrijf-header h1 { font-size: 2.25rem; } }

/* Header grid: tekst links, fotos + CTA rechts */
.header-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 768px) { .header-grid { grid-template-columns: 1fr 380px; gap: 36px; align-items: start; } }
@media (min-width: 1024px) { .header-grid { grid-template-columns: 1fr 440px; gap: 40px; } }

.header-rechts .foto-grid { border-radius: 12px; overflow: hidden; box-shadow: 0 2px 12px rgba(0,0,0,0.06); margin-bottom: 16px; }
.header-rechts .contact-block { position: static; }

/* Content onder header (volle breedte) */
.content-full { padding-bottom: 48px; }

.rating-badge { display: inline-flex; align-items: center; gap: 10px; background: #EFF6FF; border: 1px solid #BFDBFE; padding: 8px 16px; border-radius: 10px; margin-bottom: 16px; }
.rating-badge .stars { font-size: 1rem; letter-spacing: 2px; }
.rating-badge .score { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 1.125rem; color: #1e40af; }
.rating-badge .review-count { font-size: 0.8125rem; color: #6B7280; }

.bedrijf-beschrijving { color: #4B5563; font-size: 1rem; line-height: 1.7; margin-top: 8px; max-width: 640px; }
.bedrijf-beschrijving p { margin-bottom: 12px; }
.bedrijf-beschrijving p:last-child { margin-bottom: 0; }
.kenmerken-lijst { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.kenmerk-tag { display: inline-flex; align-items: center; gap: 5px; background: #EFF6FF; color: #1D4ED8; font-size: 0.8125rem; font-weight: 600; padding: 6px 12px; border-radius: 16px; border: 1px solid #BFDBFE; }
.kenmerk-tag svg { width: 12px; height: 12px; }

/* Categorie tag */
.categorie-tag { display: inline-flex; align-items: center; gap: 5px; background: #F0FDF4; color: #166534; font-size: 0.75rem; font-weight: 600; padding: 5px 12px; border-radius: 16px; border: 1px solid #BBF7D0; margin-bottom: 12px; }
.categorie-tag.cat-internationaal { background: #EFF6FF; color: #1E40AF; border-color: #BFDBFE; }
.categorie-tag.cat-budget { background: #FFF7ED; color: #9A3412; border-color: #FED7AA; }
.categorie-tag.cat-premium { background: #FAF5FF; color: #6B21A8; border-color: #E9D5FF; }
.categorie-tag.cat-zakelijk { background: #F0F9FF; color: #075985; border-color: #BAE6FD; }

/* Erkend badge */
.erkend-badge { display: inline-flex; align-items: center; gap: 10px; background: linear-gradient(135deg, #F0FDF4, #DCFCE7); color: #166534; font-size: 0.9375rem; font-weight: 700; padding: 10px 18px; border-radius: 10px; border: 1px solid #86EFAC; margin-bottom: 14px; clear: both; }
.bedrijf-header .erkend-badge { display: flex; width: fit-content; }
.erkend-badge img { height: 40px; width: auto; flex-shrink: 0; }

/* Certificeringen */
.cert-lijst { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; margin-bottom: 14px; }
.cert-tag { display: inline-flex; align-items: center; gap: 5px; font-size: 0.8125rem; font-weight: 600; padding: 6px 12px; border-radius: 16px; }
.cert-tag svg { width: 12px; height: 12px; flex-shrink: 0; }
.cert-erkend { background: #F0FDF4; color: #166534; border: 1px solid #BBF7D0; }
.cert-fidi { background: #EFF6FF; color: #1E40AF; border: 1px solid #BFDBFE; }
.cert-iam { background: #FAF5FF; color: #6B21A8; border: 1px solid #E9D5FF; }

/* Diensten */
.diensten-grid { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.dienst-tag { display: inline-flex; align-items: center; gap: 5px; background: #F9FAFB; color: #374151; font-size: 0.875rem; font-weight: 500; padding: 8px 14px; border-radius: 8px; border: 1px solid #E5E7EB; }
.dienst-tag svg { width: 14px; height: 14px; color: #2563EB; flex-shrink: 0; }
.dienst-tag.niet-beschikbaar { background: #FEF2F2; color: #991B1B; border-color: #FECACA; }
.dienst-tag.niet-beschikbaar svg { color: #DC2626; }
.diensten-label { font-size: 0.8125rem; font-weight: 600; color: #6B7280; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; }

/* Sterke & zwakke punten */
.punten-lijst { list-style: none; padding: 0; margin: 0; }
.punten-lijst li { display: flex; gap: 12px; padding: 12px 16px; background: #F9FAFB; border-radius: 8px; margin-bottom: 8px; border: 1px solid #E5E7EB; }
.punten-lijst li:last-child { margin-bottom: 0; }
.punt-icon { width: 22px; height: 22px; min-width: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-top: 1px; flex-shrink: 0; }
.punt-icon svg { width: 12px; height: 12px; }
.sterke-punten .punt-icon { background: #DCFCE7; color: #16a34a; }
.zwakke-punten .punt-icon { background: #FEE2E2; color: #DC2626; }
.sterke-punten .punten-lijst li { background: #F0FDF4; border-color: #BBF7D0; }
.zwakke-punten .punten-lijst li { background: #FEF2F2; border-color: #FECACA; }
.punt-content strong { display: block; font-size: 0.875rem; color: #111827; margin-bottom: 2px; }
.punt-content span { font-size: 0.8125rem; color: #6B7280; line-height: 1.5; }

/* Grid */
.bedrijf-grid { display: grid; grid-template-columns: 1fr; gap: 32px; padding-bottom: 48px; }
@media (min-width: 768px) { .bedrijf-grid { grid-template-columns: 1fr 320px; gap: 36px; } }

/* === CONTACT BLOCK (sticky sidebar) === */
.contact-block { background: #fff; border: 1px solid #E5E7EB; border-radius: 14px; padding: 24px; height: fit-content; position: sticky; top: 84px; box-shadow: 0 1px 4px rgba(0,0,0,0.04); }

.contact-heading { font-size: 0.8125rem; font-family: 'Manrope', sans-serif; font-weight: 700; color: #374151; margin-bottom: 16px; padding-bottom: 10px; border-bottom: 1px solid #F3F4F6; text-transform: uppercase; letter-spacing: 0.5px; display: block; }

.contact-item { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; padding: 10px 12px; background: #F9FAFB; border-radius: 8px; font-size: 0.9375rem; color: #374151; }
.contact-item:hover { background: #EFF6FF; }

.contact-icon { width: 34px; height: 34px; min-width: 34px; background: #EFF6FF; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.contact-icon svg { width: 16px; height: 16px; color: #2563EB; display: block; }

.contact-label { font-size: 0.6875rem; color: #9CA3AF; text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: 1px; }
.contact-value { font-size: 0.9375rem; color: #111827; }
.contact-value a { color: #2563EB; font-weight: 500; }
.contact-value a:hover { color: #1e40af; }

/* CTA buttons (in sidebar, tussen contact en openingstijden) */
.contact-cta { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; padding-top: 16px; border-top: 1px solid #F3F4F6; }
.contact-cta a { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px; border-radius: 8px; font-weight: 600; font-size: 0.875rem; font-family: 'Inter', sans-serif; transition: background 0.2s, transform 0.1s; text-decoration: none; }
.contact-cta a:active { transform: scale(0.98); }
.contact-cta a svg { width: 16px; height: 16px; }
.cta-call { background: #2563EB; color: #fff; }
.cta-call:hover { background: #1e40af; color: #fff; }
.cta-web { background: #F3F4F6; color: #374151; }
.cta-web:hover { background: #E5E7EB; color: #111827; }

/* Openingstijden */
.openingstijden { margin-top: 20px; }
.openingstijden ul { margin: 0; padding: 0; }
.openingstijden li { display: flex; justify-content: space-between; padding: 7px 0; border-bottom: 1px solid #F3F4F6; font-size: 0.8125rem; color: #374151; }
.openingstijden li:last-child { border-bottom: none; }
.openingstijden li span:first-child { font-weight: 500; color: #111827; }

/* Sections */
.bedrijf-section { margin-bottom: 36px; }
.bedrijf-section > h2 { font-size: 1.125rem; margin-bottom: 16px; display: flex; align-items: center; gap: 8px; color: #111827; }
.bedrijf-section > h2::before { content: ''; width: 3px; height: 20px; background: #2563EB; border-radius: 2px; flex-shrink: 0; }

/* Photos */
.foto-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; border-radius: 10px; overflow: hidden; }
@media (min-width: 768px) { .foto-grid { grid-template-columns: repeat(3, 1fr); } }
.foto-grid img { width: 100%; height: 160px; object-fit: cover; }
.foto-grid img:first-child { grid-column: 1 / -1; height: 220px; }
@media (min-width: 768px) { .foto-grid img:first-child { grid-column: 1 / 3; height: 240px; } .foto-grid img { height: 160px; } }

/* Map */
.map-container { margin-bottom: 36px; }
.map-container > h2 { font-size: 1.125rem; margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.map-container > h2::before { content: ''; width: 3px; height: 20px; background: #2563EB; border-radius: 2px; }
.map-container iframe { width: 100%; height: 260px; border: 0; border-radius: 10px; }
@media (min-width: 768px) { .map-container iframe { height: 320px; } }

/* Reviews */
.review-card { background: #fff; border: 1px solid #E5E7EB; border-radius: 10px; padding: 20px; margin-bottom: 10px; }
.review-card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; flex-wrap: wrap; gap: 6px; }
.review-author { font-weight: 600; font-size: 0.875rem; color: #111827; }
.review-date { font-size: 0.6875rem; color: #9CA3AF; background: #F9FAFB; padding: 3px 8px; border-radius: 12px; }
.review-stars { margin-bottom: 8px; font-size: 0.875rem; letter-spacing: 1px; }
.review-text { color: #4B5563; font-size: 0.9375rem; line-height: 1.65; margin: 0; }

/* Gerelateerd */
.gerelateerd-grid { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 768px) { .gerelateerd-grid { grid-template-columns: repeat(2, 1fr); } }
.gerelateerd-card { display: block; background: #F9FAFB; border: 1px solid #E5E7EB; border-radius: 10px; padding: 16px; transition: box-shadow 0.2s, transform 0.2s, border-color 0.2s; color: #111827; text-decoration: none; }
.gerelateerd-card:hover { box-shadow: 0 4px 12px rgba(37,99,235,0.08); transform: translateY(-2px); border-color: #BFDBFE; color: #111827; }
.gerelateerd-card h3 { font-size: 0.875rem; margin-bottom: 4px; }
.gerelateerd-meta { font-size: 0.75rem; color: #6B7280; }