body { margin: 0; background: #f4f9fc; color: #16283b; font-family: "Cairo", "Segoe UI", Tahoma, sans-serif; }
        .wrap { max-width: 1140px; margin: 0 auto; padding: 22px 14px 40px; }
        .back { margin-bottom: 10px; }
        .back a { color: #0369a1; text-decoration: none; font-weight: 700; }
        .detail-nav {
            position: sticky;
            top: 8px;
            z-index: 18;
            margin-bottom: 10px;
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
            padding: 8px;
            border: 1px solid #d0e3f0;
            border-radius: 12px;
            background: rgba(255, 255, 255, .94);
            box-shadow: 0 8px 16px rgba(12, 58, 89, .08);
            backdrop-filter: blur(4px);
        }
        .detail-nav a {
            text-decoration: none;
            border: 1px solid #cfe2ef;
            background: #f6fbff;
            color: #164563;
            border-radius: 999px;
            padding: 6px 11px;
            font-size: 12px;
            font-weight: 800;
        }
        .detail-nav a.is-active {
            border-color: #69bde3;
            background: #e8f6ff;
            color: #0e567f;
        }
        .box { background: #fff; border: 1px solid #d8e5ef; border-radius: 16px; padding: 18px; }
        h1 { margin: 0 0 10px; font-size: 32px; line-height: 1.25; }
        p { margin: 0; color: #5a6d80; line-height: 1.75; }
        .grid-main { display: grid; gap: 14px; grid-template-columns: 1.15fr .85fr; }
        .gallery { background: #f0f7fc; border: 1px solid #c8dfee; border-radius: 14px; padding: 10px; }
        .gallery-main { position: relative; aspect-ratio: 16/10; background: #dfeef8; border-radius: 10px; overflow: hidden; }
        .gallery-main img { width: 100%; height: 100%; object-fit: cover; display: block; }
        .gallery-open {
            position: absolute;
            inset-inline-end: 10px;
            bottom: 10px;
            border: 1px solid rgba(255, 255, 255, .6);
            background: rgba(10, 31, 48, .66);
            color: #fff;
            border-radius: 999px;
            padding: 6px 11px;
            font-size: 12px;
            font-weight: 700;
            cursor: pointer;
        }
        .thumbs { margin-top: 8px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
        .thumb-btn { border: 2px solid transparent; border-radius: 8px; overflow: hidden; cursor: pointer; background: #fff; padding: 0; }
        .thumb-btn.active { border-color: #0e7490; }
        .thumb-btn img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
        .section-title { margin: 18px 0 8px; font-size: 22px; color: #0d324a; }
        .quick-kpis {
            margin-top: 10px;
            display: grid;
            gap: 8px;
            grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
        }
        .quick-kpi {
            border: 1px solid #d5e6f0;
            background: #f8fcff;
            border-radius: 10px;
            padding: 8px 9px;
            display: grid;
            gap: 2px;
        }
        .quick-kpi .k {
            font-size: 11px;
            color: #587189;
            font-weight: 700;
        }
        .quick-kpi .v {
            color: #11496d;
            font-size: 16px;
            font-weight: 900;
            line-height: 1.2;
        }
        .story-grid {
            margin-top: 18px;
            display: grid;
            gap: 12px;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        }
        .story-card {
            border: 1px solid #d5e4ef;
            border-radius: 16px;
            background: linear-gradient(160deg, #ffffff, #f7fbff);
            padding: 16px;
            display: grid;
            gap: 10px;
            box-shadow: 0 12px 26px rgba(11, 57, 86, .05);
        }
        .story-card h3 {
            margin: 0;
            font-size: 18px;
            color: #0f314a;
            line-height: 1.35;
        }
        .story-list {
            margin: 0;
            padding-inline-start: 18px;
            display: grid;
            gap: 8px;
            color: #456176;
        }
        .story-best-for {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }
        .story-chip {
            display: inline-flex;
            align-items: center;
            padding: 8px 12px;
            border-radius: 999px;
            background: #eef7fc;
            border: 1px solid #d2e3ee;
            color: #114a68;
            font-size: 13px;
            font-weight: 800;
        }
        .story-note-grid {
            display: grid;
            gap: 10px;
        }
        .story-note {
            border: 1px solid #d9e7f0;
            border-radius: 14px;
            background: #fbfdff;
            padding: 12px 13px;
            display: grid;
            gap: 6px;
        }
        .story-note strong {
            color: #0d324a;
            font-size: 14px;
        }
        .story-note p {
            font-size: 14px;
            line-height: 1.8;
        }
        .service-depth {
            margin-top: 18px;
            padding: 18px 20px;
            border: 1px solid #d8e8f2;
            border-radius: 18px;
            background: linear-gradient(180deg, #ffffff 0%, #f4faff 100%);
            box-shadow: 0 12px 28px rgba(12, 58, 89, .05);
        }
        .service-depth-grid {
            display: grid;
            gap: 12px;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        }
        .service-depth-card {
            border: 1px solid #d6e5ef;
            border-radius: 16px;
            background: #f9fcff;
            padding: 16px;
            display: grid;
            gap: 10px;
        }
        .service-depth-card h3 {
            margin: 0;
            font-size: 17px;
            color: #0f314a;
            line-height: 1.35;
        }
        .service-facts {
            margin: 0;
            display: grid;
            gap: 10px;
        }
        .service-facts div {
            display: grid;
            gap: 4px;
        }
        .service-facts dt {
            color: #597085;
            font-size: 12px;
            font-weight: 800;
        }
        .service-facts dd {
            margin: 0;
            color: #173d58;
            font-size: 14px;
            font-weight: 700;
            line-height: 1.7;
        }
        .service-list {
            margin: 0;
            padding-inline-start: 18px;
            display: grid;
            gap: 8px;
            color: #35596f;
            line-height: 1.8;
        }
        .service-meta-row {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }
        .service-meta-chip {
            display: inline-flex;
            align-items: center;
            padding: 7px 11px;
            border-radius: 999px;
            border: 1px solid #cee1ee;
            background: #f7fbff;
            color: #114664;
            font-size: 12px;
            font-weight: 800;
        }
        .intent-panel {
            margin: 18px 0 10px;
            padding: 18px 20px;
            border: 1px solid #d8e8f2;
            border-radius: 18px;
            background: linear-gradient(180deg, #f8fcff 0%, #eef7fc 100%);
            box-shadow: 0 12px 28px rgba(12, 58, 89, .06);
        }
        .intent-summary {
            margin: 6px 0 0;
            color: #35596f;
            line-height: 1.9;
            font-size: 15px;
        }
        .intent-chip-list {
            margin-top: 14px;
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }
        .intent-chip {
            display: inline-flex;
            align-items: center;
            padding: 8px 12px;
            border-radius: 999px;
            border: 1px solid #c9ddea;
            background: #fff;
            color: #18445e;
            font-size: 13px;
            font-weight: 700;
            line-height: 1.5;
            box-shadow: 0 6px 16px rgba(12, 58, 89, .05);
        }
        .facts { margin-top: 14px; display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; }
        .fact { background: #edf6fb; border: 1px solid #c8deec; border-radius: 10px; padding: 10px; }
        .fact .k { font-size: 12px; color: #5a6d80; }
        .fact .v { font-size: 16px; font-weight: 800; color: #045481; margin-top: 5px; }
        .trust-strip {
            margin: 12px 0 10px;
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }
        .trust-pill {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 7px 11px;
            border-radius: 999px;
            border: 1px solid #cfe1ee;
            background: #f7fbff;
            color: #114664;
            font-size: 12px;
            font-weight: 800;
            line-height: 1.4;
        }
        .trust-pill.is-rating {
            border-color: rgba(9, 36, 52, .08);
            background: linear-gradient(120deg, #0f2534, #143d55);
            color: #fff;
            box-shadow: 0 14px 28px rgba(9, 36, 52, .18);
        }
        .trust-pill.is-rating b {
            font-size: 15px;
        }
        .decision-grid {
            margin-top: 14px;
            display: grid;
            gap: 12px;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        }
        .decision-card {
            border: 1px solid #d5e4ef;
            border-radius: 16px;
            background: linear-gradient(160deg, #ffffff, #f5fbff);
            padding: 14px;
            box-shadow: 0 14px 28px rgba(11, 57, 86, .05);
            display: grid;
            gap: 10px;
            align-content: start;
        }
        .decision-card h2 {
            margin: 0;
            font-size: 18px;
            color: #0f314a;
            line-height: 1.35;
        }
        .decision-card p {
            color: #557086;
            font-size: 14px;
            line-height: 1.75;
        }
        .decision-card strong {
            color: #103752;
        }
        .decision-list {
            list-style: none;
            margin: 0;
            padding: 0;
            display: grid;
            gap: 8px;
        }
        .decision-list li {
            display: flex;
            gap: 8px;
            align-items: flex-start;
            color: #24485f;
            font-size: 13px;
            line-height: 1.7;
            font-weight: 700;
        }
        .decision-list li::before {
            content: "*";
            color: #0d6b94;
            font-size: 18px;
            line-height: 1;
            margin-top: 1px;
        }
        .decision-map {
            border: 1px solid #d7e6f0;
            border-radius: 14px;
            overflow: hidden;
            background: #e9f3f9;
            min-height: 190px;
        }
        .decision-map iframe {
            width: 100%;
            height: 100%;
            min-height: 190px;
            border: 0;
            display: block;
        }
        .decision-map-fallback {
            border: 1px dashed #c7dae7;
            border-radius: 14px;
            background: linear-gradient(145deg, #eff7fc, #f8fbfe);
            padding: 16px;
            color: #3f6178;
            font-size: 13px;
            line-height: 1.75;
        }
        .decision-price {
            font-size: 26px;
            font-weight: 900;
            color: #0d4d73;
            line-height: 1.1;
        }
        .decision-price small {
            display: block;
            margin-top: 4px;
            color: #547188;
            font-size: 12px;
            font-weight: 700;
        }
        .decision-actions {
            display: grid;
            gap: 8px;
        }
        .amenity-grid {
            margin-top: 10px;
            display: grid;
            gap: 10px;
            grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
        }
        .amenity-tile {
            border: 1px solid #d4e4ef;
            background: linear-gradient(145deg, #fbfdff, #f4faff);
            border-radius: 12px;
            padding: 10px 11px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }
        .amenity-label {
            color: #0f3f5d;
            font-size: 14px;
            font-weight: 800;
            line-height: 1.45;
        }
        .amenity-icon {
            width: 34px;
            height: 34px;
            border-radius: 10px;
            border: 1px solid #cde3f1;
            background: linear-gradient(135deg, #ffffff, #edf7fd);
            color: #0f5f88;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            flex: 0 0 auto;
        }
        .amenity-icon svg {
            width: 19px;
            height: 19px;
            display: block;
        }
        .amenity-subgrid {
            margin-top: 10px;
            display: grid;
            gap: 8px;
            grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
        }
        .amenity-subtile {
            border: 1px solid #ddeaf3;
            background: #f9fcff;
            border-radius: 10px;
            padding: 8px 9px;
            display: flex;
            align-items: center;
            gap: 8px;
            color: #204f6c;
            font-size: 12px;
            font-weight: 700;
        }
        .amenity-subtile .amenity-icon {
            width: 28px;
            height: 28px;
            border-radius: 8px;
        }
        .amenity-subtile .amenity-icon svg {
            width: 15px;
            height: 15px;
        }
        .chips { margin-top: 10px; display: flex; gap: 8px; flex-wrap: wrap; }
        .chip { background: #eaf6ff; border: 1px solid #c8deee; color: #0d4b73; border-radius: 999px; padding: 5px 10px; font-size: 12px; font-weight: 700; }
        .notice {
            margin-top: 10px;
            border: 1px solid #f2cc89;
            background: #fff8ec;
            color: #7f4d06;
            border-radius: 10px;
            padding: 9px 10px;
            font-size: 13px;
            line-height: 1.65;
        }
        .notice strong {
            display: block;
            color: #6f4507;
            margin-bottom: 2px;
        }
        .reviews-panel {
            margin-top: 14px;
            border: 1px solid #d0e3f0;
            border-radius: 12px;
            background: #f7fbff;
            padding: 12px;
            display: grid;
            gap: 10px;
        }
        .reviews-score {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            align-items: center;
        }
        .reviews-rating {
            font-size: 29px;
            font-weight: 900;
            line-height: 1;
            color: #0f4f75;
        }
        .reviews-rating span { font-size: 15px; font-weight: 700; color: #47718c; }
        .reviews-meta { display: grid; gap: 2px; color: #4f667c; font-size: 13px; }
        .reviews-meta strong { color: #123651; font-size: 14px; }
        .reviews-list { display: grid; gap: 8px; }
        .review-card {
            border: 1px solid #d8e7f1;
            border-radius: 10px;
            background: #fff;
            padding: 9px 10px;
        }
        .review-head {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 8px;
            color: #143752;
            font-size: 13px;
            font-weight: 700;
        }
        .review-stars { color: #c17f00; white-space: nowrap; }
        .review-date { margin-top: 2px; color: #67829a; font-size: 12px; }
        .review-text {
            margin-top: 6px;
            color: #405f75;
            line-height: 1.7;
            font-size: 13px;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        .rooms { margin-top: 14px; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 10px; }
        .room-card { border: 1px solid #d4e4ef; background: #fbfdff; border-radius: 12px; padding: 12px; }
        .room-media { margin: -12px -12px 10px; border-bottom: 1px solid #dce9f2; background: #ecf5fb; border-radius: 12px 12px 0 0; overflow: hidden; aspect-ratio: auto; }
        .room-media img { width: 100%; height: 170px; object-fit: cover; display: block; }
        .room-card h3 { margin: 0 0 6px; font-size: 18px; }
        .room-meta { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
        .room-price { margin-top: 7px; font-weight: 800; color: #0b5d87; font-size: 16px; }
        .rate-table-wrap { margin-top: 9px; overflow: auto; border: 1px solid #d7e7f2; border-radius: 10px; background: #fff; }
        .rate-table { width: 100%; border-collapse: collapse; min-width: 520px; }
        .rate-table th, .rate-table td {
            border-bottom: 1px solid #e4eef5;
            padding: 7px 9px;
            font-size: 12px;
            text-align: start;
            vertical-align: top;
        }
        .rate-table th { background: #f3f9fd; color: #16415d; font-weight: 800; }
        .rate-table td { color: #264b63; }
        .rate-pill {
            display: inline-flex;
            align-items: center;
            border-radius: 999px;
            border: 1px solid #bed6e5;
            padding: 3px 8px;
            font-size: 11px;
            font-weight: 800;
            color: #0f5377;
            background: #edf7fd;
            white-space: nowrap;
        }
        .rate-pill.refundable { border-color: #95d5b5; color: #0a6a3b; background: #eaf8f0; }
        .rate-note { margin-top: 6px; font-size: 11px; color: #5b758c; }
        .room-actions { margin-top: 8px; display: flex; gap: 8px; flex-wrap: wrap; }
        .room-jump {
            border: 1px solid #bed9eb;
            background: #eef8ff;
            color: #0f547c;
            border-radius: 8px;
            padding: 6px 10px;
            font-size: 12px;
            font-weight: 800;
            cursor: pointer;
        }
        .policy-list { margin-top: 10px; display: grid; gap: 8px; }
        .policy-group-title {
            margin: 6px 0 2px;
            color: #0f425f;
            font-size: 14px;
            font-weight: 900;
        }
        .policy-item { border: 1px solid #d9e8f2; border-radius: 10px; padding: 10px; background: #f8fcff; }
        .policy-item h4 { margin: 0 0 4px; font-size: 16px; color: #0d344d; }
        .planner { margin-top: 16px; border: 1px solid #cfe3f1; border-radius: 12px; background: #f6fbff; padding: 12px; }
        .planner-grid { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
        .planner label { display: grid; gap: 5px; font-size: 12px; color: #35576f; font-weight: 700; }
        .planner input, .planner select {
            border: 1px solid #c5dced;
            border-radius: 8px;
            padding: 8px 9px;
            font: inherit;
            color: #17374f;
            background: #fff;
        }
        .planner-actions { margin-top: 8px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
        .planner-btn { border: 1px solid #0f5f8d; background: linear-gradient(120deg, #0f4b72, #0c7cb5); color: #fff; border-radius: 9px; padding: 8px 12px; font-weight: 800; cursor: pointer; }
        .planner-status { font-size: 12px; color: #5a6d80; }
        .planner-status.err { color: #b42318; }
        .planner-status.ok { color: #0f7a4b; }
        .planner-result { margin-top: 10px; border: 1px dashed #bed8e9; border-radius: 10px; background: #fff; padding: 10px; }
        .planner-result[hidden] { display: none; }
        .planner-price { font-size: 18px; font-weight: 900; color: #0d4b73; margin-bottom: 6px; }
        .planner-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; color: #35556c; font-size: 13px; }
        .planner-link { display: inline-block; margin-top: 8px; text-decoration: none; border: 1px solid #0d5a86; border-radius: 8px; padding: 7px 10px; color: #fff; background: #0f6b9a; font-weight: 700; }
        .planner-muted {
            border-style: dashed;
            background: #fbfeff;
        }
        .cta { margin-top: 16px; display: flex; gap: 8px; flex-wrap: wrap; }
        .btn {
            text-decoration: none;
            border-radius: 10px;
            padding: 9px 13px;
            font-weight: 700;
            border: 1px solid transparent;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font: inherit;
            line-height: 1.2;
        }
        .btn-primary { color: #fff; background: linear-gradient(120deg, #0f4b72, #0c7cb5); border: 1px solid #0f5f8d; }
        .btn-secondary { background: #e7f2fa; color: #045481; border: 1px solid #c3dced; }
        .btn-save.is-saved {
            background: #e8f8ef;
            color: #0c6941;
            border-color: #b8e6cc;
        }
        .sticky-cta {
            position: fixed;
            inset-inline: 10px;
            bottom: 10px;
            z-index: 1400;
            border: 1px solid #b9d7e8;
            border-radius: 14px;
            background: rgba(255, 255, 255, .98);
            box-shadow: 0 16px 36px rgba(7, 41, 63, .18);
            backdrop-filter: blur(6px);
            padding: 9px;
            display: none;
            grid-template-columns: minmax(0, 1fr) auto auto;
            gap: 8px;
            align-items: center;
        }
        .sticky-cta-price {
            display: grid;
            gap: 1px;
            min-width: 0;
        }
        .sticky-cta-price .k {
            font-size: 11px;
            color: #5f7a8f;
            font-weight: 700;
        }
        .sticky-cta-price .v {
            color: #0e4e74;
            font-size: 15px;
            font-weight: 900;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .sticky-cta .btn {
            padding: 8px 11px;
            font-size: 12px;
            white-space: nowrap;
        }
        .lightbox {
            position: fixed;
            inset: 0;
            z-index: 2300;
            display: grid;
            place-items: center;
            background: rgba(3, 11, 20, .86);
            padding: 14px;
        }
        .lightbox[hidden] { display: none; }
        .lightbox-inner {
            width: min(1100px, 100%);
            max-height: calc(100vh - 28px);
            display: grid;
            grid-template-rows: auto 1fr auto;
            gap: 8px;
        }
        .lightbox-head {
            display: flex;
            justify-content: space-between;
            align-items: center;
            color: #e4f4ff;
            font-size: 13px;
            font-weight: 700;
        }
        .lightbox-close {
            border: 1px solid rgba(228, 244, 255, .5);
            background: rgba(228, 244, 255, .15);
            color: #fff;
            border-radius: 8px;
            padding: 6px 9px;
            cursor: pointer;
        }
        .lightbox-stage {
            display: grid;
            grid-template-columns: 44px minmax(0, 1fr) 44px;
            gap: 8px;
            align-items: center;
        }
        .lightbox-nav {
            border: 1px solid rgba(228, 244, 255, .45);
            background: rgba(5, 36, 58, .58);
            color: #fff;
            border-radius: 999px;
            width: 44px;
            height: 44px;
            cursor: pointer;
            font-size: 22px;
            line-height: 1;
        }
        .lightbox-media {
            border-radius: 12px;
            overflow: hidden;
            background: rgba(4, 20, 33, .75);
            border: 1px solid rgba(215, 233, 244, .25);
        }
        .lightbox-media img {
            width: 100%;
            max-height: calc(100vh - 185px);
            object-fit: contain;
            display: block;
            margin: 0 auto;
        }
        .lightbox-thumbs {
            display: flex;
            gap: 7px;
            overflow-x: auto;
            padding-bottom: 4px;
        }
        .lightbox-thumb {
            flex: 0 0 88px;
            border: 2px solid transparent;
            border-radius: 8px;
            overflow: hidden;
            padding: 0;
            background: transparent;
            cursor: pointer;
        }
        .lightbox-thumb.is-active { border-color: #43b5e8; }
        .lightbox-thumb img {
            width: 100%;
            height: 62px;
            object-fit: cover;
            display: block;
        }
        #overview,
        #search-intents,
        #detail-faq,
        #facilities,
        #reviews,
        #rooms,
        #planner,
        #policies {
            scroll-margin-top: 88px;
        }
        @media (max-width: 980px) {
            .grid-main { grid-template-columns: 1fr; }
            .thumbs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
            .lightbox-stage { grid-template-columns: 36px minmax(0, 1fr) 36px; }
            .lightbox-nav { width: 36px; height: 36px; font-size: 18px; }
            .sticky-cta { display: grid; }
            body { padding-bottom: 96px; }
        }
        @media (min-width: 981px) {
            .sticky-cta { display: none !important; }
        }
        .detail-faq {
            margin: 28px 0 10px;
            display: grid;
            gap: 18px;
        }
        .faq-list {
            display: grid;
            gap: 14px;
        }
        .faq-item {
            border: 1px solid #d7e5ee;
            border-radius: 18px;
            background: #fff;
            box-shadow: 0 16px 38px rgba(13, 50, 74, 0.06);
            overflow: hidden;
        }
        .faq-q {
            cursor: pointer;
            list-style: none;
            padding: 18px 20px;
            font-weight: 800;
            color: #0d324a;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 14px;
        }
        .faq-q::-webkit-details-marker {
            display: none;
        }
        .faq-q::after {
            content: "+";
            flex: 0 0 auto;
            color: #0f6b83;
            font-size: 24px;
            line-height: 1;
        }
        .faq-item[open] .faq-q::after {
            content: "\2212";
        }
        .faq-a {
            padding: 0 20px 18px;
            color: #496476;
            line-height: 1.9;
        }
        .faq-a p {
            margin: 0;
        }
        .related-links {
            margin: 28px 0 10px;
            display: grid;
            gap: 24px;
        }
        .related-links-head p {
            margin: -2px 0 0;
            color: #597286;
            font-size: 14px;
        }
        .related-links-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
            gap: 18px;
        }
        .related-link-card {
            display: grid;
            grid-template-rows: 168px 1fr;
            border-radius: 20px;
            overflow: hidden;
            border: 1px solid #d7e5ee;
            background: #fff;
            box-shadow: 0 18px 44px rgba(13, 50, 74, 0.08);
            text-decoration: none;
            color: inherit;
            transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
        }
        .related-link-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 24px 54px rgba(13, 50, 74, 0.13);
            border-color: #9dc4db;
        }
        .related-link-card.is-compact {
            grid-template-rows: 1fr;
        }
        .related-link-media {
            display: block;
            background: linear-gradient(135deg, #e9f4fa, #f5fbff);
        }
        .related-link-media img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
        .related-link-body {
            display: grid;
            gap: 10px;
            padding: 16px 16px 18px;
            align-content: start;
        }
        .related-link-kicker {
            font-size: 11px;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: #4d7b95;
            font-weight: 800;
        }
        .related-link-title {
            margin: 0;
            color: #0d324a;
            font-size: 18px;
            line-height: 1.35;
        }
        .related-link-text {
            color: #496476;
            font-size: 14px;
            line-height: 1.7;
        }
        .related-link-meta {
            color: #0f6b83;
            font-size: 14px;
            font-weight: 800;
        }
        .related-links-subtitle {
            margin: 4px 0 -6px;
            color: #355165;
            font-size: 15px;
            font-weight: 800;
        }
        @media (max-width: 720px) {
            .related-link-card {
                grid-template-rows: 150px 1fr;
            }
            .related-link-card.is-compact {
                grid-template-rows: 1fr;
            }
        }
        .sb-media-shell {
            position: relative;
            overflow: hidden;
        }
        .sb-media-shell::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.58) 48%, rgba(255,255,255,0) 100%);
            transform: translateX(-120%);
            opacity: 0;
            pointer-events: none;
            z-index: 1;
        }
        .sb-media-shell.is-media-loading::before {
            opacity: 1;
            animation: sbMediaShimmer 1.05s linear infinite;
        }
        .sb-media-shell.is-media-loading > img {
            opacity: .08;
        }
        .sb-media-shell > img {
            transition: opacity .22s ease;
        }
        @keyframes sbMediaShimmer {
            to { transform: translateX(120%); }
        }