.directory-intro { margin-top: 81px; padding: 44px 0; min-height: 270px; background: #fff var(--directory-image) no-repeat right center / auto 100%; border-bottom: 1px solid var(--border); }
.directory-intro .container { position: relative; }
.directory-intro h1 { font-size: 40px; font-weight: 600; color: var(--primary); margin: 12px 0; }
.directory-intro p { max-width: 560px; font-size: 17px; line-height: 1.6; color: var(--text-main); background: rgba(255,255,255,.95); }
.directory-catalogue { padding-top: 36px; padding-bottom: 48px; }
.insurance-directory .grid-3 { grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); }
.directory-group + .directory-group { margin-top: 36px; }
.directory-group h2 { font-size: 24px; font-weight: 500; margin-bottom: 18px; color: var(--primary); }
.insurance-directory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.insurance-directory-item { display: flex; flex-direction: column; gap: 10px; padding: 22px; border: 1px solid var(--border); border-radius: 6px; color: var(--text-main); background: #fff; min-width: 0; }
.insurance-directory-item:hover { border-color: var(--primary); background: #faf7fc; }
.insurance-directory-item:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.insurance-directory-item:has(.directory-product-image) { padding: 0 0 22px; overflow: hidden; }
.directory-product-image { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; background: #fff; }
.insurance-directory-item:has(.directory-product-image) > h3,
.insurance-directory-item:has(.directory-product-image) > p,
.insurance-directory-item:has(.directory-product-image) > .directory-link { margin-left: 22px; margin-right: 22px; }
.insurance-directory-item h3 { font-size: 19px; font-weight: 500; line-height: 1.35; overflow-wrap: anywhere; }
.insurance-directory-item p { font-size: 14px; line-height: 1.6; color: #626c7a; }
.directory-link { margin-top: auto; padding-top: 6px; font-size: 14px; color: var(--primary); }
@media (max-width: 900px) { .insurance-directory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .directory-intro { background-size: auto 70%; background-position: right top; } }
@media (max-width: 600px) { .directory-intro { padding: 28px 0; min-height: 0; background-image: none; } .directory-intro h1 { font-size: 32px; } .directory-intro p { font-size: 16px; } .insurance-directory-grid { grid-template-columns: 1fr; } .directory-group h2 { font-size: 22px; } }
