body[data-page="blog"] { background: #fbfaf6; font-family: "DM Sans", sans-serif; }
body[data-page="blog"] h1, body[data-page="blog"] h2, body[data-page="blog"] h3 { color: var(--color-primary-dark); }
body[data-page="blog"] h1, .blog-section-heading h2, .blog-featured-copy h3, .blog-cta h2 { font-family: "DM Serif Display", serif; font-weight: 400; }
.blog-kicker, .blog-category { margin: 0 0 .7rem; color: var(--color-primary); font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.blog-hero { padding: 1.75rem 0; border-bottom: 1px solid rgba(31, 68, 55, .1); background: linear-gradient(135deg, #eef1e8, #f7f0e4); }
.blog-hero h1 { margin: 0 0 .45rem; font-size: clamp(2.25rem, 4vw, 3.5rem); line-height: 1.05; }
.blog-hero p { max-width: 680px; margin: 0; font-size: clamp(.98rem, 1.25vw, 1.1rem); line-height: 1.55; }
.blog-hero .blog-kicker { margin-bottom: .45rem; font-size: .72rem; }
.blog-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; }
.blog-section-heading h2 { margin: 0; font-size: clamp(2rem, 4vw, 3.2rem); }
.blog-listing-heading { display: block; margin-bottom: 1.25rem; }
.blog-listing-heading .blog-kicker { margin-bottom: .25rem; }
.blog-listing-heading h2 { font-size: clamp(1.65rem, 2.8vw, 2.35rem); }
.blog-featured { padding: clamp(2rem, 4vw, 3.5rem) 0; background: #fff; }
.blog-featured-card { display: grid; grid-template-columns: minmax(280px, 36%) minmax(0, 1fr); overflow: hidden; border: 1px solid rgba(31, 68, 55, .12); border-radius: 1rem; background: #eef1e8; box-shadow: 0 14px 36px rgba(25, 56, 45, .08); }
.blog-featured-media { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--color-primary-dark); }
.blog-featured-media img { width: 100%; height: 100%; object-fit: cover; }
.blog-featured-copy { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: clamp(1.4rem, 3vw, 2.5rem); }
.blog-featured-copy h3 { margin: 0 0 .7rem; font-size: clamp(2rem, 3vw, 2.5rem); line-height: 1.1; }
.blog-featured-copy h3 a, .blog-card h3 a { color: inherit; text-decoration: none; }
.blog-featured-copy > p:not(.blog-category):not(.blog-meta) { display: -webkit-box; overflow: hidden; margin: 0; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.blog-read-link { align-self: flex-start; min-height: 44px; margin-top: .65rem; padding: .65rem 0; color: var(--color-primary-dark); font-weight: 700; }
.blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 2.4vw, 2rem); }
.blog-card { overflow: hidden; border: 1px solid rgba(31, 68, 55, .12); border-radius: 1rem; background: #fff; }
.blog-card-media { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #e8eadf; }
.blog-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.blog-card:hover .blog-card-media img { transform: scale(1.025); }
.blog-card-body { padding: 1.4rem; }
.blog-card h3 { margin: 0 0 .75rem; font-size: clamp(1.25rem, 2vw, 1.65rem); line-height: 1.25; }
.blog-card-body > p:not(.blog-category):not(.blog-meta) { display: -webkit-box; overflow: hidden; line-height: 1.65; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.blog-latest { padding: clamp(2.5rem, 5vw, 4rem) 0; background: #fbfaf6; }
.blog-latest-list { display: grid; gap: 1rem; }
.blog-latest-card { display: grid; grid-template-columns: minmax(180px, 28%) minmax(0, 1fr); }
.blog-latest-card .blog-card-media { aspect-ratio: 16 / 10; }
.blog-latest-card .blog-card-body { align-self: center; padding: 1.15rem 1.4rem; }
.blog-latest-card h3 { font-size: clamp(1.3rem, 2vw, 1.75rem); }
.blog-meta { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1rem; color: #66726c; font-size: .88rem; }
.blog-image-fallback { display: grid; width: 100%; height: 100%; place-items: center; padding: 1rem; color: #fff; background: var(--color-primary-dark); font-family: "DM Serif Display", serif; font-size: 1.25rem; text-align: center; }
.blog-empty { max-width: 720px; margin: 0 auto; padding: clamp(2.25rem, 5vw, 4rem); border: 1px solid rgba(31, 68, 55, .12); border-radius: 1.25rem; background: #fff; text-align: center; }
.blog-empty h2 { font-family: "DM Serif Display", serif; font-size: clamp(2rem, 4vw, 3rem); font-weight: 400; }
.blog-categories { padding: clamp(2.25rem, 4vw, 3.25rem) 0; background: #f2eee3; }
.blog-categories ul { display: flex; flex-wrap: wrap; gap: .65rem; margin: 0; padding: 0; list-style: none; }
.blog-categories li { flex: 0 0 auto; padding: .7rem 1rem; border: 1px solid rgba(31, 68, 55, .2); border-radius: 999px; background: rgba(255,255,255,.76); }
.blog-categories span { display: block; color: var(--color-primary-dark); font-size: .9rem; font-weight: 700; white-space: nowrap; }
.blog-cta { padding: clamp(4rem, 8vw, 7rem) 0; color: #fff; background: var(--color-primary-dark); text-align: center; }
.blog-cta .blog-kicker, .blog-cta h2 { color: #fff; }
.blog-cta h2 { margin: 0 0 1rem; font-size: clamp(2.2rem, 5vw, 4rem); }
.blog-cta p:not(.blog-kicker) { max-width: 650px; margin: 0 auto 1.75rem; line-height: 1.7; }
.blog-breadcrumb { padding-top: 7rem; }
.blog-breadcrumb ol { display: flex; flex-wrap: wrap; gap: .55rem; padding: 0; list-style: none; color: #66726c; font-size: .88rem; }
.blog-breadcrumb li:not(:last-child)::after { content: "/"; margin-left: .55rem; }
.blog-breadcrumb a { color: var(--color-primary); }
.blog-article-header { padding: clamp(2rem, 5vw, 4rem) 0 3rem; text-align: left; }
.blog-article-header h1 { max-width: 850px; margin: 0 0 1.25rem; font-size: clamp(2.5rem, 6vw, 5rem); line-height: 1.02; }
.blog-lead { max-width: 760px; font-size: clamp(1.08rem, 2vw, 1.3rem); line-height: 1.7; }
.blog-cover { display: block; width: 100%; height: auto; max-height: 660px; margin-top: 2.5rem; border-radius: 1.1rem; object-fit: cover; }
.blog-prose { max-width: 780px; padding-top: 2rem; padding-bottom: 4rem; color: #29342f; font-size: clamp(1rem, 1.25vw, 1.12rem); line-height: 1.85; }
.blog-prose p { margin: 0 0 1.35rem; }
.blog-prose h2, .blog-prose h3, .blog-prose h4 { margin: 2.5rem 0 1rem; font-family: "DM Sans", sans-serif; font-weight: 700; line-height: 1.25; }
.blog-prose h2 { font-size: clamp(1.7rem, 3vw, 2.25rem); }.blog-prose h3 { font-size: 1.5rem; }.blog-prose h4 { font-size: 1.2rem; }
.blog-prose ul, .blog-prose ol { margin: 0 0 1.5rem; padding-left: 1.5rem; }.blog-prose li { margin-bottom: .55rem; }
.blog-prose blockquote { margin: 2rem 0; padding: 1.25rem 1.5rem; border-left: 4px solid var(--color-primary); background: #eef1e8; font-family: "DM Serif Display", serif; font-size: 1.35rem; }
.blog-prose a { color: var(--color-primary); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.blog-prose figure { margin: 2.5rem 0; }.blog-prose figure img { display: block; width: 100%; height: auto; border-radius: .8rem; }.blog-prose figcaption { margin-top: .7rem; color: #66726c; font-size: .88rem; line-height: 1.55; }
.blog-author { max-width: 780px; margin: 0 auto 5rem; padding: 0 20px; }
.blog-author-inner { display: flex; align-items: center; gap: 1.5rem; padding: 1.75rem; border-radius: 1rem; background: #eef1e8; }
.blog-author img { width: 92px; height: 92px; flex: 0 0 auto; border-radius: 50%; object-fit: cover; }
.blog-author h2 { margin: 0; font-family: "DM Sans", sans-serif; font-size: 1.35rem; }.blog-author-role { margin: .25rem 0 .5rem; color: #66726c; font-weight: 600; }
.blog-related { border-top: 1px solid rgba(31, 68, 55, .12); background: #fff; }
.blog-toc { margin: 0 0 .75rem; padding: 1.25rem 1.4rem; border: 1px solid rgba(31,68,55,.15); border-radius: .75rem; background: #f5f4ed; }
.blog-toc-title { margin: 0 0 .7rem; color: var(--color-primary-dark); font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.blog-toc-list { display: grid; gap: .3rem; margin: 0; padding-left: 1.35rem; }
.blog-toc li { padding-left: .2rem; color: #66726c; }
.blog-toc a { display: inline-flex; min-height: 44px; align-items: center; padding: .35rem 0; color: var(--color-primary-dark); line-height: 1.45; text-decoration: underline; text-decoration-color: rgba(31,68,55,.3); text-underline-offset: .2em; }
.blog-toc a:hover { text-decoration-color: currentColor; }
.blog-toc-children { display: grid; gap: .05rem; margin: .05rem 0 .25rem; padding-left: 1.2rem; list-style: disc; }
.blog-toc-children li { padding-left: .15rem; color: #7a847f; }
.blog-toc-children a { min-height: 40px; color: #53635c; font-size: .92rem; }
.blog-toc-toggle { min-height: 44px; margin-top: .8rem; padding: .55rem .9rem; border: 1px solid var(--color-primary-dark); border-radius: .35rem; color: var(--color-primary-dark); background: transparent; font: inherit; font-weight: 700; cursor: pointer; }
.blog-toc-toggle:hover { color: #fff; background: var(--color-primary-dark); }
.blog-toc-toggle:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 3px; }
.blog-toc-toggle[hidden] { display: none; }
.blog-toc.is-enhanced.is-collapsed [data-blog-toc-overflow],
.blog-toc.is-enhanced.is-collapsed .blog-toc-children { display: none; }
.blog-table-scroll { max-width: 100%; margin: 2.25rem 0; overflow-x: auto; border: 1px solid rgba(31,68,55,.18); border-radius: .75rem; background: #fff; scrollbar-width: thin; }
.blog-table-scroll:focus-visible { outline: 3px solid rgba(38,111,82,.35); outline-offset: 3px; }
.blog-data-table { width: 100%; min-width: 620px; border-collapse: collapse; font-size: .96rem; line-height: 1.55; }
.blog-data-table th, .blog-data-table td { min-width: 150px; padding: .9rem 1rem; border-right: 1px solid rgba(31,68,55,.12); border-bottom: 1px solid rgba(31,68,55,.12); text-align: left; vertical-align: top; }
.blog-data-table th:last-child, .blog-data-table td:last-child { border-right: 0; }
.blog-data-table tr:last-child td { border-bottom: 0; }
.blog-data-table th { color: var(--color-primary-dark); background: #eef1e8; font-weight: 700; }
.blog-data-table p { margin: 0; }.blog-data-table p + p { margin-top: .65rem; }
.blog-itinerary { margin: 2.5rem 0; padding: clamp(1.25rem,3vw,2rem); border: 1px solid rgba(31,68,55,.14); border-radius: 1rem; background: #f2eee3; }
.blog-itinerary-title { margin: 0 0 1.35rem !important; font-family: "DM Serif Display",serif !important; font-size: clamp(1.45rem,3vw,1.9rem) !important; font-weight: 400 !important; }
.blog-itinerary ol { margin: 0; padding: 0; list-style: none; }
.blog-itinerary li { display: grid; grid-template-columns: minmax(110px,22%) minmax(0,1fr); gap: 1.25rem; margin: 0; padding: 1.1rem 0; border-top: 1px solid rgba(31,68,55,.14); }
.blog-itinerary-time { color: var(--color-primary-dark); font-weight: 700; font-variant-numeric: tabular-nums; }
.blog-itinerary-details { min-width: 0; }.blog-itinerary-details h4 { display: inline; margin: 0 .6rem 0 0; font-size: 1.08rem; }
.blog-itinerary-area, .blog-itinerary-notes { margin: .35rem 0 0 !important; }.blog-itinerary-area { color: #596860; font-weight: 600; }
.blog-itinerary-optional { display: inline-block; padding: .18rem .5rem; border: 1px solid currentColor; border-radius: 999px; color: var(--color-primary); font-size: .72rem; font-weight: 700; line-height: 1.4; text-transform: uppercase; }
.blog-callout { margin: 2.25rem 0; padding: 1.4rem 1.5rem; border: 1px solid rgba(31,68,55,.16); border-left: 4px solid var(--color-primary); border-radius: .65rem; background: #eef1e8; }
.blog-callout--warning { border-left-color: #9b6b21; background: #f7f0e4; }.blog-callout--important { border-left-color: #1f4437; }.blog-callout--tip { background: #f5f7ef; }
.blog-callout-label, .blog-reader-cta-eyebrow { margin: 0 0 .35rem !important; color: var(--color-primary); font-size: .74rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.blog-callout h3, .blog-reader-cta h3 { margin: .25rem 0 .75rem; font-family: "DM Sans",sans-serif; font-size: clamp(1.25rem,3vw,1.55rem); }
.blog-callout-body > :last-child { margin-bottom: 0; }
.blog-reader-cta { margin: 2.75rem 0; padding: clamp(1.5rem,4vw,2.35rem); border: 1px solid rgba(31,68,55,.18); border-radius: 1rem; background: #eef1e8; }
.blog-reader-cta--highlight { background: #f2eee3; }.blog-reader-cta--primary { color: #fff; border-color: var(--color-primary-dark); background: var(--color-primary-dark); }
.blog-reader-cta--primary h3, .blog-reader-cta--primary .blog-reader-cta-eyebrow { color: #fff; }
.blog-reader-cta > p:not(.blog-reader-cta-eyebrow) { margin-bottom: 1.2rem; }
.blog-reader-cta-link { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: .7rem 1rem; border-radius: .35rem; color: #fff !important; background: var(--color-primary); font-weight: 700; text-decoration: none; }
.blog-reader-cta--primary .blog-reader-cta-link { color: var(--color-primary-dark) !important; background: #fff; }
@media (max-width: 1024px) { .blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 768px) { .blog-hero { padding: 1.4rem 0; }.blog-featured { padding: 1.5rem 0 2rem; }.blog-featured-card { grid-template-columns: 1fr; }.blog-featured-media { aspect-ratio: 16 / 9; }.blog-featured-copy h3 { font-size: clamp(1.65rem, 7vw, 2.15rem); }.blog-section-heading { display: block; }.blog-listing-heading { margin-bottom: 1rem; }.blog-grid { grid-template-columns: 1fr; }.blog-latest-card { grid-template-columns: minmax(130px, 34%) minmax(0, 1fr); }.blog-categories .container { padding-right: 0; }.blog-categories ul { overflow-x: auto; flex-wrap: nowrap; padding: 0 20px .5rem 0; scrollbar-width: thin; scroll-snap-type: x proximity; }.blog-categories li { scroll-snap-align: start; }.blog-breadcrumb li[aria-current="page"] { display: none; } }
@media (max-width: 430px) { .blog-hero { padding: 1.15rem 0; }.blog-hero h1 { font-size: 2rem; }.blog-featured-copy h3 { font-size: 1.5rem; line-height: 1.12; }.blog-featured-copy, .blog-card-body { padding: 1.1rem; }.blog-featured-copy > p:not(.blog-category):not(.blog-meta) { -webkit-line-clamp: 2; }.blog-latest-card { grid-template-columns: 1fr; }.blog-latest-card .blog-card-media { aspect-ratio: 16 / 9; }.blog-author-inner { align-items: flex-start; }.blog-author img { width: 70px; height: 70px; }.blog-meta { gap: .35rem .65rem; } }
@media (max-width: 600px) { .blog-toc { padding: 1.1rem 1.15rem; }.blog-toc a { overflow-wrap: anywhere; }.blog-itinerary { padding: 1.15rem; }.blog-itinerary li { display: block; }.blog-itinerary-time { margin-bottom: .35rem; }.blog-reader-cta-link { width: 100%; }.blog-callout { padding: 1.2rem; } }
