/* Prose + section-bar styling for editor-written page bodies.
   ---------------------------------------------------------------------------
   site.master flattens every heading inside #ContentPlaceHolder1_ctext to
   inline-block at body font-size, so h2/h3 run together and read as paragraphs.
   Lists lose their markers to a global reset, and tables arrive from the editor
   as clean semantic markup with no styling at all.

   Selectors are prefixed with `body` so they outrank the master's id-scoped
   rules (1,0,2 vs 1,0,1) without depending on a wrapping <article> - the region
   page has one, the city pages do not.

   Loaded by DestinationPages/Default.aspx and diaplayplace.aspx via code-behind,
   after the master's own stylesheet.                                           */

body #ContentPlaceHolder1_ctext { font-size: 15px; line-height: 1.75; color: #33383f; }
body #ContentPlaceHolder1_ctext div { text-align: left; }
body #ContentPlaceHolder1_ctext p { margin: 0 0 14px; }
body #ContentPlaceHolder1_ctext a { font-size: inherit; }
body #ContentPlaceHolder1_ctext a:hover,
body #ContentPlaceHolder1_ctext a:focus { text-decoration: underline; }
body #ContentPlaceHolder1_ctext strong { font-weight: 600; color: #1f2328; }
body #ContentPlaceHolder1_ctext img { max-width: 100%; height: auto; border-radius: 4px; }
body #ContentPlaceHolder1_ctext hr { border: 0; border-top: 1px solid #e5e7eb; margin: 26px 0; }

/* Headings: put the hierarchy back. */
body #ContentPlaceHolder1_ctext h1,
body #ContentPlaceHolder1_ctext h2,
body #ContentPlaceHolder1_ctext h3,
body #ContentPlaceHolder1_ctext h4,
body #ContentPlaceHolder1_ctext h5,
body #ContentPlaceHolder1_ctext h6 {
    display: block !important; font-family: inherit !important;
    font-weight: 600 !important; letter-spacing: normal !important;
    color: #1f2328; line-height: 1.32;
}
body #ContentPlaceHolder1_ctext h1 { font-size: 30px !important; margin: 0 0 14px !important; }
body #ContentPlaceHolder1_ctext h2 { font-size: 25px !important; margin: 34px 0 11px !important; }
body #ContentPlaceHolder1_ctext h3 { font-size: 19.5px !important; margin: 27px 0 8px !important; }
body #ContentPlaceHolder1_ctext h4 { font-size: 16.5px !important; margin: 21px 0 6px !important; }
body #ContentPlaceHolder1_ctext h5,
body #ContentPlaceHolder1_ctext h6 { font-size: 15px !important; margin: 18px 0 6px !important; }
body #ContentPlaceHolder1_ctext > *:first-child { margin-top: 0 !important; }

/* Lists: the global reset strips markers and makes ul inline-block. */
body #ContentPlaceHolder1_ctext ul,
body #ContentPlaceHolder1_ctext ol {
    display: block !important; padding-left: 22px !important; margin: 0 0 14px !important;
}
body #ContentPlaceHolder1_ctext ul { list-style: disc outside !important; }
body #ContentPlaceHolder1_ctext ol { list-style: decimal outside !important; }
body #ContentPlaceHolder1_ctext li { display: list-item !important; margin: 0 0 6px; line-height: 1.7; }
body #ContentPlaceHolder1_ctext li:last-child { margin-bottom: 0; }

/* Tables: bare thead/tbody with no rules of their own. */
body #ContentPlaceHolder1_ctext table {
    width: 100%; border-collapse: collapse; margin: 20px 0 24px;
    font-size: 14px; line-height: 1.55; background: #fff;
    border: 1px solid #e6e9ed; border-radius: 4px;
}
body #ContentPlaceHolder1_ctext thead th {
    text-align: left; vertical-align: bottom; background: #f4f5f6;
    color: #1f2328; font-weight: 600; padding: 11px 13px;
    border-bottom: 2px solid #dfe3e8; white-space: nowrap;
}
body #ContentPlaceHolder1_ctext td { padding: 11px 13px; vertical-align: top; border-bottom: 1px solid #eceef1; }
body #ContentPlaceHolder1_ctext tbody tr:last-child td { border-bottom: 0; }
body #ContentPlaceHolder1_ctext tbody tr:hover { background: #fafbfc; }
body #ContentPlaceHolder1_ctext th:first-child,
body #ContentPlaceHolder1_ctext td:first-child { font-weight: 600; color: #1f2328; }
body #ContentPlaceHolder1_ctext caption {
    caption-side: bottom; padding-top: 8px; font-size: 12.5px; color: #6b7280; text-align: left;
}

body #ContentPlaceHolder1_ctext blockquote {
    margin: 20px 0; padding: 2px 0 2px 16px; border-left: 3px solid #e2e5e9; color: #5b6169;
}

/* A lead summary block reads as a callout rather than loose bold lines. */
body #ContentPlaceHolder1_ctext .summary {
    background: #f7f9fb; border-left: 3px solid #f34f4f;
    border-radius: 0 4px 4px 0; padding: 16px 20px; margin: 0 0 26px;
}
body #ContentPlaceHolder1_ctext .summary h2 {
    margin: 0 0 9px !important; font-size: 13px !important;
    text-transform: uppercase; letter-spacing: .05em !important; color: #6b7280;
}
body #ContentPlaceHolder1_ctext .summary ul { margin-bottom: 0 !important; }

/* A wide table cannot shrink to a phone; let it scroll instead of stacking words. */
@media only screen and (max-width: 767px) {
    body #ContentPlaceHolder1_ctext table {
        display: block; width: max-content; max-width: 100%;
        overflow-x: auto; -webkit-overflow-scrolling: touch;
    }
    body #ContentPlaceHolder1_ctext h1 { font-size: 24px !important; }
    body #ContentPlaceHolder1_ctext h2 { font-size: 21px !important; margin-top: 26px !important; }
    body #ContentPlaceHolder1_ctext h3 { font-size: 17.5px !important; }
}

/* ---- Section bar -------------------------------------------------------- */
/* The bar's own stylesheet assumed a fixed number of tabs and never had an
   active state switched on. */
.component-sectionmenu li.nav-other:first-child::before { display: none; }
.component-sectionmenu li.nav-other:nth-last-child(3) { padding: 0 15px; }
.component-sectionmenu ul#toggle-link a { position: relative; transition: color .15s ease; }
.component-sectionmenu ul#toggle-link a::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 8px; height: 2px;
    background: #fff; transform: scaleX(0); transform-origin: center; transition: transform .18s ease;
}
.component-sectionmenu ul#toggle-link a:hover,
.component-sectionmenu ul#toggle-link a:focus { text-decoration: none; }
.component-sectionmenu ul#toggle-link a:hover::after,
.component-sectionmenu ul#toggle-link a:focus::after { transform: scaleX(1); }
.component-sectionmenu li.active a::after { transform: scaleX(1); background: #f34f4f; }
.component-sectionmenu li.active a { color: #fff !important; font-weight: 600; }
@media only screen and (max-width: 767px) {
    .component-sectionmenu ul#toggle-link a::after { display: none; }
}

/* Section-bar titles keep their weight when the tag changes.
   "Featured Places" was an h3 and is now an h2 so it sits at the same level as the
   page's other top-level section titles. .j_topbar_item already pins the size with
   !important; the weight came from the h3 element rule, so it is pinned here too
   and the heading renders exactly as before. */
/* Weight and vertical padding came from the h3 element rule; "Featured Places" is
   now an h2, so both are pinned on the class and the bar renders identically. */
.j_topbar_item { font-weight: 700; padding: 13px 0 10px; }

/* Brand line when it sits inside the body's own H1 (city pages, where the banner
   heading has been demoted). Smaller and lighter so the place name still leads. */
body #ContentPlaceHolder1_ctext h1 .brandline {
    display: block; margin-top: 4px;
    font-size: 15px; font-weight: 400; color: #6b7280; letter-spacing: .02em;
}
