.notes-page main,
.notes-page article,
.notes-page figure { min-width: 0; }

.notes-index { padding: 55px 0 48px; }
.notes-intro { max-width: 750px; }
.notes-intro h1 { font-size: clamp(46px, 6vw, 72px); margin: 17px 0 24px; }
.notes-intro > p:not(.eyebrow) { max-width: 660px; font-size: 16px; line-height: 1.9; }
.notes-topics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px; margin: 38px 0 42px; padding: 31px 0 35px; border-top: 1px solid var(--stone); border-bottom: 1px solid var(--stone); }
.notes-topics h2 { margin: 0 0 11px; font-size: 25px; }
.notes-topics p { font-size: 13px; line-height: 1.85; }
.notes-featured > .eyebrow { margin-bottom: 21px; }
.notes-follow { margin-top: 42px; padding-top: 32px; border-top: 1px solid var(--stone); }
.notes-follow h2 { margin: 0 0 16px; font-size: clamp(28px, 3.5vw, 35px); }
.notes-follow > p { max-width: 650px; font-size: 14px; }
.notes-follow .social-links { justify-content: flex-start; gap: 24px; margin-top: 17px; }
.notes-follow > a { display: inline-flex; align-items: center; min-height: 44px; margin: 14px 22px 0 0; font-size: 13px; }

.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 19px; font-size: 12px; line-height: 1.7; color: var(--navy); }
.breadcrumbs a { display: inline-flex; align-items: center; min-height: 44px; }
.breadcrumbs > span { min-width: 0; overflow-wrap: anywhere; }
.article-hero { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .8fr); align-items: center; gap: 60px; padding: 33px 0 50px; }
.article-heading h1 { font-size: clamp(42px, 4.8vw, 61px); line-height: 1.14; margin: 18px 0 23px; }
.article-deck { max-width: 570px; font-size: 17px; line-height: 1.85; }
.article-byline { margin-top: 22px; font-size: 12px; color: var(--navy); }
.article-heading > .text-link { margin-top: 13px; }
.article-cover { width: 100%; max-width: 380px; justify-self: end; }
.article-cover img { display: block; width: 100%; height: auto; }
.article-cover figcaption { margin-top: 10px; font-size: 11px; line-height: 1.7; }
.article-layout { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 60px; align-items: start; padding-top: 31px; border-top: 1px solid var(--stone); }
.article-contents { position: sticky; top: 28px; align-self: start; font-size: 12px; line-height: 1.65; }
.article-contents summary { padding: 0 0 15px; font-size: 13px; font-weight: 600; color: var(--navy); cursor: pointer; }
.article-contents summary:focus-visible { outline: 2px solid var(--navy); outline-offset: 5px; }
.article-contents details[open] summary { border-bottom: 1px solid var(--stone); }
.article-contents ol { margin: 17px 0 0; padding-left: 22px; }
.article-contents li { padding-left: 3px; }
.article-contents li::marker { font-size: 10px; color: var(--navy); }
.article-contents a { display: block; min-height: 40px; padding: 7px 0; }
.article-body { min-width: 0; font-size: 15px; line-height: 1.9; }
.article-body > p + p,
.guide-step > p + p { margin-top: 17px; }
.article-introduction { font-size: 17px; line-height: 1.9; }
.article-body a:not(.text-link) { text-decoration: underline; text-underline-offset: 4px; overflow-wrap: anywhere; }
.guide-step { margin-top: 35px; padding-top: 30px; border-top: 1px solid var(--stone); scroll-margin-top: 28px; }
.guide-step > .eyebrow { font-size: 10px; letter-spacing: .12em; }
.guide-step h2 { display: flex; align-items: baseline; gap: 13px; margin: 12px 0 20px; font-size: clamp(28px, 3vw, 34px); line-height: 1.3; }
.step-number { flex: 0 0 26px; font-family: "Manrope", sans-serif; font-size: 11px; line-height: 1.7; font-weight: 600; letter-spacing: .06em; color: var(--espresso); }
.practical-note { margin-top: 20px; padding: 17px 20px; border-left: 3px solid var(--taupe); background: var(--stone); font-size: 13px; line-height: 1.85; }
.practical-note p + p { margin-top: 12px; }
.article-body h3 { margin: 22px 0 12px; font-size: 22px; line-height: 1.4; }
.practical-note h3 { margin: 0 0 12px; font-size: 21px; }
.article-body .affiliate-note { margin-top: 20px; font-size: 12px; line-height: 1.8; color: var(--navy); }
.article-body ul,
.article-body ol { margin: 18px 0; padding-left: 24px; }
.article-body li + li { margin-top: 7px; }
.article-ending { margin-top: 35px; padding-top: 28px; border-top: 1px solid var(--stone); }
.article-ending p + p { margin-top: 17px; }

.trip-checklist { margin-top: 46px; padding: 33px 36px 30px; border: 1px solid var(--stone); background: var(--warm-white); scroll-margin-top: 28px; }
.checklist-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px 28px; }
.checklist-heading > .eyebrow { grid-column: 1 / -1; font-size: 10px; text-align: left; }
.checklist-heading h2 { margin: 0; font-size: clamp(28px, 3vw, 35px); }
.checklist-heading #checklist-progress { font-size: 12px; color: var(--navy); text-align: right; }
.checklist-groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 21px; margin-top: 27px; }
.checklist-groups fieldset { min-width: 0; min-inline-size: 0; margin: 0; padding: 17px 16px 14px; border: 1px solid var(--stone); }
.checklist-groups legend { max-width: 100%; padding: 0 7px; font-size: 10px; font-weight: 600; line-height: 1.7; letter-spacing: .08em; text-transform: uppercase; color: var(--navy); }
.checklist-groups label { display: flex; align-items: flex-start; gap: 10px; padding: 9px 0; font-size: 12px; line-height: 1.8; cursor: pointer; }
.checklist-groups input[type="checkbox"] { flex: 0 0 16px; width: 16px; height: 16px; margin: 4px 0 0; accent-color: var(--navy); cursor: pointer; }
.checklist-groups input[type="checkbox"]:focus-visible { outline: 2px solid var(--navy); outline-offset: 4px; }
.checklist-groups label span { min-width: 0; overflow-wrap: anywhere; }
.check-number { display: inline-block; min-width: 1.9em; margin-right: 3px; font-size: 10px; font-weight: 600; letter-spacing: .03em; color: var(--navy); }
.checklist-groups label:has(input:checked) span { color: var(--navy); text-decoration: line-through; text-decoration-thickness: 1px; }
.checklist-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 26px; margin-top: 24px; padding-top: 23px; border-top: 1px solid var(--stone); }
.checklist-actions button { font-family: inherit; line-height: 1.7; border: 0; cursor: pointer; }
.checklist-actions button.text-link { padding: 0; background: transparent; }
.checklist-note { display: block; max-width: 820px; margin-top: 15px; font-size: 11px; line-height: 1.8; }
.article-back { margin-top: 24px; padding: 9px 0 30px; }

@media (max-width: 1000px) {
  .article-hero { gap: 38px; }
  .article-layout { gap: 38px; }
  .trip-checklist { padding-right: 27px; padding-left: 27px; }
  .checklist-groups { gap: 16px; }
}

@media (max-width: 800px) {
  .article-hero { grid-template-columns: 1fr; gap: 29px; padding: 27px 0 34px; }
  .article-heading { max-width: 660px; }
  .article-cover { max-width: 400px; justify-self: start; }
  .article-layout { grid-template-columns: 1fr; gap: 29px; padding-top: 28px; }
  .article-contents { position: static; padding: 0 19px; border: 1px solid var(--stone); }
  .article-contents summary { padding: 16px 0; }
  .article-contents ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; margin: 12px 0 15px; }
  .checklist-heading { align-items: start; }
  .checklist-groups { grid-template-columns: 1fr; gap: 19px; }
  .checklist-groups fieldset { padding: 16px 19px; }
  .checklist-groups label { font-size: 13px; }
}

@media (max-width: 680px) {
  .notes-index { padding: 33px 0 34px; }
  .notes-intro h1 { font-size: 38px; line-height: 1.15; margin: 16px 0 20px; }
  .notes-intro > p:not(.eyebrow) { font-size: 15px; }
  .notes-topics { grid-template-columns: 1fr; gap: 23px; margin: 28px 0 32px; padding: 26px 0 29px; }
  .notes-topics h2 { font-size: 26px; margin-bottom: 9px; }
  .notes-featured > .eyebrow { margin-bottom: 18px; }
  .notes-follow { margin-top: 32px; padding-top: 27px; }
  .notes-follow h2 { font-size: 26px; }
  .breadcrumbs { gap: 6px; padding-top: 13px; font-size: 11px; }
  .article-hero { padding-top: 20px; gap: 25px; }
  .article-heading h1 { font-size: 38px; line-height: 1.16; margin: 16px 0 20px; }
  .article-deck { font-size: 15px; line-height: 1.9; }
  .article-byline { margin-top: 18px; font-size: 11px; }
  .article-cover figcaption { font-size: 10px; }
  .article-contents ol { grid-template-columns: 1fr; margin-top: 10px; }
  .article-body,
  .article-introduction { font-size: 15px; line-height: 1.9; }
  .guide-step { margin-top: 29px; padding-top: 25px; }
  .guide-step h2 { gap: 9px; margin: 11px 0 17px; font-size: 26px; }
  .step-number { flex-basis: 23px; font-size: 10px; }
  .practical-note { padding: 15px 16px; }
  .article-ending { margin-top: 29px; padding-top: 24px; }
  .trip-checklist { margin-top: 32px; padding: 24px 20px; }
  .checklist-heading { display: block; }
  .checklist-heading > .eyebrow { margin-bottom: 10px; }
  .checklist-heading h2 { font-size: 26px; }
  .checklist-heading #checklist-progress { margin-top: 12px; text-align: left; }
  .checklist-groups { margin-top: 23px; }
  .checklist-groups fieldset { padding: 15px 16px; }
  .checklist-actions { margin-top: 23px; padding-top: 21px; }
  .checklist-actions .button { width: 100%; justify-content: center; }
  .article-back { padding-bottom: 22px; }
}

@media print {
  @page { size: A4 portrait; margin: 14mm; }
  html,
  body.notes-page,
  .notes-page .page,
  .notes-page main,
  .notes-page .article-page { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: #fff !important; color: #000 !important; }
  .notes-page .skip-link,
  .notes-page .page > :not(main),
  .notes-page main > :not(.article-page):not(.trip-checklist),
  .notes-page .article-page > :not(.trip-checklist),
  .notes-page .checklist-actions { display: none !important; }
  .notes-page .article-page,
  .notes-page .trip-checklist { display: block !important; }
  .notes-page .trip-checklist { margin: 0 !important; padding: 0 !important; border: 0 !important; background: #fff !important; color: #000 !important; break-inside: avoid; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .notes-page .checklist-heading { display: block; }
  .notes-page .checklist-heading > .eyebrow { display: none; }
  .notes-page .checklist-heading::before { content: "The Suite Passport"; display: block; margin-bottom: 7mm; font-family: "Manrope", sans-serif; font-size: 8pt; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
  .notes-page .checklist-heading h2 { margin: 0 0 3mm; font-size: 22pt; line-height: 1.2; color: #000; }
  .notes-page .checklist-heading #checklist-progress { margin: 0; font-size: 9pt; line-height: 1.5; text-align: left; color: #000; }
  .notes-page .checklist-groups { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5mm; margin-top: 7mm; }
  .notes-page .checklist-groups fieldset { padding: 4mm 3mm; border: 1px solid #aaa; background: #fff; break-inside: avoid; }
  .notes-page .checklist-groups legend { padding: 0 1.5mm; font-size: 8pt; line-height: 1.5; letter-spacing: .03em; color: #000; }
  .notes-page .checklist-groups label { gap: 2mm; padding: 2mm 0; font-size: 9pt; line-height: 1.5; break-inside: avoid; }
  .notes-page .checklist-groups input[type="checkbox"] { appearance: auto; flex-basis: 3.5mm; width: 3.5mm; height: 3.5mm; margin-top: .7mm; accent-color: #000; }
  .notes-page .checklist-groups label span,
  .notes-page .checklist-groups label:has(input:checked) span { color: #000; }
  .notes-page .check-number { font-size: 7pt; }
  .notes-page .checklist-note { max-width: none; margin-top: 5mm; font-size: 8pt; line-height: 1.5; color: #000; }
}