:root { color-scheme: light; --navy:#123453; --blue:#0077a8; --coral:#e45d4f; --ink:#263746; --muted:#617180; --line:#dbe4ea; --surface:#fff; --wash:#f5f9fb; }
* { box-sizing:border-box; }
html { background:transparent; -webkit-text-size-adjust:100%; }
body { margin:0; background:transparent; color:var(--ink); font-family:Arial, Helvetica, sans-serif; line-height:1.55; }
.feed-shell { width:min(1180px, 100%); margin:0 auto; padding:clamp(22px, 4vw, 52px) clamp(14px, 3vw, 28px); }
.intro { max-width:720px; margin:0 auto clamp(24px, 4vw, 42px); text-align:center; }
.eyebrow { margin:0 0 6px; color:var(--blue); font-size:.78rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
h1 { margin:0; color:var(--navy); font-family:Georgia, 'Times New Roman', serif; font-size:clamp(2rem, 7vw, 3.5rem); line-height:1.08; }
.intro > p:last-child { margin:12px auto 0; color:var(--muted); font-size:clamp(1rem, 2.5vw, 1.15rem); }
.card-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:clamp(16px, 2.5vw, 26px); }
.card { display:flex; min-width:0; flex-direction:column; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:var(--surface); box-shadow:0 10px 28px rgba(18,52,83,.09); }
.image-link { display:block; aspect-ratio:16/9; overflow:hidden; background:linear-gradient(135deg, #dcecf4, #f8e6dc); }
.image-link img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .25s ease; }
.image-link:not(.has-image)::after { content:'Travel inspiration'; display:grid; height:100%; place-items:center; color:var(--navy); font-family:Georgia, serif; font-size:1.25rem; }
.image-link:not(.has-image) img { display:none; }
.card-body { display:flex; flex:1; flex-direction:column; padding:20px; }
time { color:var(--muted); font-size:.82rem; font-weight:700; letter-spacing:.03em; text-transform:uppercase; }
h2 { margin:8px 0 10px; font-family:Georgia, 'Times New Roman', serif; font-size:clamp(1.25rem, 2.3vw, 1.55rem); line-height:1.24; }
h2 a { color:var(--navy); text-decoration:none; }
.excerpt { margin:0 0 18px; color:var(--muted); }
.read-more { width:max-content; margin-top:auto; color:var(--blue); font-weight:800; text-decoration:none; }
a:focus-visible { outline:3px solid var(--coral); outline-offset:4px; border-radius:3px; }
.status-card { grid-column:1/-1; padding:32px; border:1px solid var(--line); border-radius:16px; background:var(--wash); text-align:center; }
.spinner { display:inline-block; width:18px; height:18px; margin-right:9px; vertical-align:-3px; border:3px solid #bdd6e2; border-top-color:var(--blue); border-radius:50%; animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
@media (hover:hover) { .image-link:hover img { transform:scale(1.035); } h2 a:hover, .read-more:hover { color:var(--coral); } }
@media (max-width:820px) { .card-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:560px) { .feed-shell { padding-inline:12px; } .card-grid { grid-template-columns:1fr; } .card { border-radius:14px; } .card-body { padding:18px; } }
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } }
