/* ================================================================
   Editorial Template (Growth Tier)
   Loaded ONLY when site.template == "editorial".
   Design language: magazine-style layout, high-contrast black/white,
   oversized serif headings, asymmetric grids, pull quotes, drop caps,
   thin hairline rules — typography IS the design.

   Palette:
     Charcoal  #2d3436   (nav, headings, dark bg)
     White     #ffffff   (content areas)
     Light     #fafafa   (alt sections)
     Grey      #636e72   (body text)
     Muted     #b2bec3   (captions, labels)
     Rule      #e0e0e0   (hairline dividers)
     Accent    #e74c3c   (red-orange highlights, section tags ONLY)
   ================================================================ */

/* ================================= */
/* 1. TYPOGRAPHY & VISUAL CHARACTER  */
/* ================================= */

/* Very large, light-weight serif headings — the editorial signature.
   Uppercase with generous tracking for a magazine masthead feel. */
.tpl-editorial .pub-section h2 {
    font-size: clamp(2.2rem, 4.5vw, 3.5rem);
    font-weight: 300;
    letter-spacing: 0.06em;
    line-height: 1.1;
    text-transform: uppercase;
    color: var(--text, #2d3436);
}
.tpl-editorial .pub-section h3 {
    font-weight: 500;
    letter-spacing: 0.02em;
    color: var(--text, #2d3436);
}

/* Category-label section tags — bold, uppercase, vivid red accent */
.tpl-editorial .pub-section-tag {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--accent, #e74c3c);
    display: inline-block;
    padding-bottom: 6px;
    border-bottom: 2px solid var(--accent, #e74c3c);
    margin-bottom: 12px;
}

/* Editorial heading accent — NO decorative line below h2.
   Typography alone defines the hierarchy. Instead, a thin full-width
   hairline rule sits ABOVE the section tag to separate from previous. */
.tpl-editorial .pub-section:not(.pub-section-hero):not(.pub-section-cta_banner) h2::after {
    display: none;
}
/* Dark/accent section heading — also no decoration */
.tpl-editorial .pub-section-dark h2::after,
.tpl-editorial .pub-section-accent h2::after {
    display: none;
}

/* ================================= */
/* 1b. SECTION SPACING & RHYTHM     */
/* ================================= */

/* Generous vertical padding — magazine pages need breathing room */
.tpl-editorial .pub-section-about_snippet,
.tpl-editorial .pub-section-feature_cards,
.tpl-editorial .pub-section-testimonials,
.tpl-editorial .pub-section-rooms_preview,
.tpl-editorial .pub-section-rooms_list,
.tpl-editorial .pub-section-area_guide,
.tpl-editorial .pub-section-reviews,
.tpl-editorial .pub-section-image_grid,
.tpl-editorial .pub-section-text_block {
    padding: 5.5rem 0;
}

.tpl-editorial .pub-section-amenities,
.tpl-editorial .pub-section-stats,
.tpl-editorial .pub-section-faq,
.tpl-editorial .pub-section-video,
.tpl-editorial .pub-section-checkin_lookup {
    padding: 4.5rem 0;
}

/* Book now — light grey strip, tight padding */
.tpl-editorial .pub-section.pub-section-book_now {
    padding: 2.5rem 0;
    margin: 0;
    position: relative;
    z-index: 10;
}
.tpl-editorial .pub-section-book_now + .pub-section {
    padding-top: 4rem;
}

@media (max-width: 768px) {
    .tpl-editorial .pub-section-about_snippet,
    .tpl-editorial .pub-section-feature_cards,
    .tpl-editorial .pub-section-testimonials,
    .tpl-editorial .pub-section-rooms_preview,
    .tpl-editorial .pub-section-rooms_list,
    .tpl-editorial .pub-section-area_guide,
    .tpl-editorial .pub-section-reviews,
    .tpl-editorial .pub-section-image_grid,
    .tpl-editorial .pub-section-text_block { padding: 3rem 0; }
    .tpl-editorial .pub-section-amenities,
    .tpl-editorial .pub-section-stats,
    .tpl-editorial .pub-section-faq,
    .tpl-editorial .pub-section-video,
    .tpl-editorial .pub-section-checkin_lookup { padding: 2.5rem 0; }
    .tpl-editorial .pub-section-hero { padding: 0; }
    .tpl-editorial .pub-section-book_now + .pub-section { padding-top: 2.5rem; }
}

/* ================================= */
/* 1c. SECTION DIVIDERS — HAIRLINES  */
/* ================================= */

/* Full-width thin hairline rules between sections.
   The editorial DNA: rules, not ornaments, define separation. */
.tpl-editorial .editorial-js .pub-section:not(.pub-section-hero):not(.pub-section-cta_banner):not(:last-child) {
    border-bottom: 1px solid #e0e0e0;
    position: relative;
}
/* Dark/accent sections get a subtle white rule */
.tpl-editorial .editorial-js .pub-section-dark:not(:last-child),
.tpl-editorial .editorial-js .pub-section-accent:not(:last-child) {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

/* ================================= */
/* 2. BACKGROUNDS                    */
/* ================================= */

/* Clean white is the default. Alternating sections get faintest warm grey. */
.tpl-editorial .pub-section-rooms_preview,
.tpl-editorial .pub-section-rooms_list,
.tpl-editorial .pub-section-amenities {
    background: #fafafa;
}

.tpl-editorial .pub-section-alt:not(.pub-section-cta_banner):not(.pub-section-book_now) {
    background: #fafafa !important;
}

/* ================================= */
/* 3. NAV — CLEAN, HIGH-CONTRAST    */
/* ================================= */

/* Pure white nav with sharp bottom hairline. No shadows.
   Magazine masthead feel: logo left, nav right, nothing else. */
.tpl-editorial .pub-header.nav-solid {
    background: var(--nav-bg, #ffffff);
    border-bottom: 1px solid var(--text, #2d3436);
    box-shadow: none;
}
.tpl-editorial .pub-header.nav-solid .pub-logo {
    color: var(--nav-text, var(--text, #2d3436));
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 18px;
}

/* Desktop nav links — small, uppercase, tracked, editorial precision */
@media (min-width: 769px) {
    .tpl-editorial .pub-header.nav-solid .pub-nav a.pub-nav-admin-btn {
        padding: 8px 24px;
        border-bottom: none;
    }
    .tpl-editorial .pub-header.nav-solid .pub-nav a {
        color: var(--nav-text, #636e72);
        font-family: var(--nav-font-family, inherit);
        font-size: var(--nav-font-size, 11px);
        font-weight: var(--nav-font-weight, 600);
        letter-spacing: 0.14em;
        text-transform: uppercase;
        padding: 4px 0;
        border-bottom: 1px solid transparent;
        transition: color 0.2s ease, border-color 0.2s ease;
    }
    .tpl-editorial .pub-header.nav-solid .pub-nav a:hover {
        color: var(--nav-hover-color, var(--text, #2d3436));
        opacity: 1;
        border-bottom-color: var(--nav-underline-color, var(--accent, #e74c3c));
    }
    .tpl-editorial .pub-header.nav-solid .pub-nav a.active {
        color: var(--nav-active-color, var(--text, #2d3436));
        opacity: 1;
        border-bottom-color: var(--nav-underline-color, var(--accent, #e74c3c));
    }
}
/* Mobile nav */
@media (max-width: 768px) {
    .tpl-editorial .pub-header.nav-solid .pub-nav a {
        color: var(--nav-text, #636e72);
        font-family: var(--nav-font-family, inherit);
        font-size: var(--nav-font-size, 11px);
        font-weight: var(--nav-font-weight, inherit);
        letter-spacing: 0.12em;
        text-transform: uppercase;
    }
    .tpl-editorial .pub-header.nav-solid .pub-nav a:hover {
        color: var(--nav-hover-color, var(--text, #2d3436));
        opacity: 1;
    }
    .tpl-editorial .pub-header.nav-solid .pub-nav a.active {
        color: var(--nav-active-color, var(--text, #2d3436));
        opacity: 1;
    }
    .tpl-editorial .pub-header.nav-solid .pub-nav {
        background: var(--mobile-nav-bg, #ffffff);
        border-bottom: 1px solid var(--text, #2d3436);
    }
}
.tpl-editorial .pub-header.nav-solid .pub-nav-toggle { color: var(--burger-color, var(--text, #2d3436)); }
.tpl-editorial .pub-header.nav-solid .pub-nav-admin-btn {
    background: var(--login-btn-bg, transparent);
    color: var(--login-btn-color, #636e72);
    border: none;
    box-shadow: inset 0 0 0 1px var(--login-btn-border, var(--text, #2d3436));
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border-radius: var(--login-btn-radius, 0);
    padding: 8px 24px;
}
.tpl-editorial .pub-header.nav-solid .pub-nav-admin-btn:hover {
    background: var(--login-btn-bg, rgba(45, 52, 54, 0.1));
    color: var(--login-btn-color, var(--text, #2d3436));
}

/* Scrolled transparent nav — clean white, no blur/glass */
.tpl-editorial .nav-transparent.scrolled {
    background: rgba(255, 255, 255, 0.98);
    border-bottom: 1px solid var(--text, #2d3436);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow: none;
}
.tpl-editorial .nav-transparent.scrolled .pub-logo {
    color: var(--text, #2d3436);
}
.tpl-editorial .nav-transparent.scrolled .pub-nav a { color: var(--nav-text, #636e72); font-family: var(--nav-font-family, inherit); font-weight: var(--nav-font-weight, inherit); }
.tpl-editorial .nav-transparent.scrolled .pub-nav a:hover { color: var(--nav-hover-color, var(--text, #2d3436)); opacity: 1; }
.tpl-editorial .nav-transparent.scrolled .pub-nav a.active { color: var(--nav-active-color, var(--text, #2d3436)); opacity: 1; }
.tpl-editorial .nav-transparent.scrolled .pub-nav-toggle { color: var(--burger-color, var(--text, #2d3436)); }
.tpl-editorial .nav-transparent.scrolled .pub-nav-admin-btn {
    background: var(--login-btn-bg, transparent);
    color: var(--login-btn-color, #636e72);
    border-color: var(--login-btn-border, var(--text, #2d3436));
    border-radius: var(--login-btn-radius, 0);
}
.tpl-editorial .nav-transparent.scrolled .pub-nav-admin-btn:hover {
    background: var(--login-btn-bg, #2d3436);
    color: var(--login-btn-color, #fff);
    opacity: 1;
}

/* ── Hero-transparent override — let branding opacity slider control ── */
.tpl-editorial .pub-nav-hero-transparent {
    background: var(--nav-bg, #ffffff) !important;
    border-bottom: 1px solid var(--text, #2d3436) !important;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}
.tpl-editorial .pub-nav-hero-transparent .pub-logo {
    color: var(--nav-text, var(--text, #2d3436));
}
.tpl-editorial .pub-nav-hero-transparent .pub-nav-link {
    color: var(--nav-text, #636e72) !important;
}
.tpl-editorial .pub-nav-hero-transparent.pub-nav-scrolled {
    background: var(--nav-bg, rgba(255, 255, 255, 0.98)) !important;
    border-bottom: 1px solid var(--text, #2d3436) !important;
    box-shadow: none !important;
}

/* ================================= */
/* 4. HERO — MAGAZINE COVER STYLE    */
/* ================================= */

/* Hero sits flush against the nav. Magazine cover: image with
   editorial text overlay at the bottom — text over dark gradient. */
.tpl-editorial .pub-section-hero {
    margin-top: -1px;
    padding: 0;
    margin-bottom: 0;
}
.tpl-editorial main {
    margin-top: 0;
    padding-top: 0;
}

/* Heavy bottom gradient — text sits at the bottom like a magazine cover.
   Top is nearly transparent to show the photography. */
.tpl-editorial .pub-hero-overlay {
    background: var(--hero-overlay-gradient, linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.05) 0%,
        rgba(0, 0, 0, 0.12) 30%,
        rgba(0, 0, 0, 0.45) 65%,
        rgba(0, 0, 0, 0.82) 100%
    ));
}

/* Oversized, light-weight hero headline — the editorial signature.
   Huge serif text with tight line-height for impact. */
.tpl-editorial .pub-hero-content h1 {
    font-size: clamp(2.8rem, 7vw, 5.5rem);
    font-weight: 300;
    letter-spacing: 0.04em;
    line-height: 1.0;
    text-transform: uppercase;
    text-shadow: none;
}

/* Small, restrained subtitle — contrast with the massive headline */
.tpl-editorial .pub-hero-content p {
    font-size: clamp(0.85rem, 1.4vw, 1rem);
    line-height: 1.7;
    color: var(--hero-p-color, rgba(255, 255, 255, 0.7));
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-weight: 400;
}

/* CTA button — sharp, outlined, fills on hover */
.tpl-editorial .pub-section-hero .pub-btn {
    border-radius: 0;
    padding: 14px 48px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    background: transparent;
    color: #ffffff;
    border: 2px solid rgba(255, 255, 255, 0.8);
    box-shadow: none;
    transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.tpl-editorial .pub-section-hero .pub-btn:hover {
    background: #ffffff;
    color: var(--text, #2d3436);
    border-color: #ffffff;
    transform: none;
    opacity: 1;
}

/* Hero badge — editorial label style */
.tpl-editorial .pub-section-hero .pub-hero-badge {
    padding: 5px 16px;
    font-size: 0.6rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.4);
    margin-bottom: 16px;
    border-radius: 0;
    font-weight: 700;
}

/* Hero gradient fallback (no image uploaded) */
.tpl-editorial .pub-section-hero .pub-hero:not([style*="background-image"]) {
    background: var(--hero-bg, linear-gradient(180deg, #2d3436 0%, #1a1a1a 50%, #0d0d0d 100%));
}

/* ================================= */
/* 5. BOOK NOW — CLEAN, SHARP       */
/* ================================= */

.tpl-editorial .pub-section.pub-section-book_now {
    background: #f5f5f5 !important;
}

.tpl-editorial .pub-book-now { background: transparent; }
.tpl-editorial .pub-book-now-inner {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 0;
    padding: 32px 36px;
    max-width: 960px;
    margin: 0 auto;
    box-shadow: none;
}
.tpl-editorial .pub-book-now-header { margin-bottom: 20px; }
.tpl-editorial .pub-book-now-header h2 {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 4px;
    color: var(--text, #2d3436);
}
.tpl-editorial .pub-section-book_now h2 {
    font-size: 13px;
    color: var(--text, #2d3436);
    text-transform: uppercase;
    letter-spacing: 0.14em;
}
.tpl-editorial .pub-book-now-header h2::after { display: none !important; }
.tpl-editorial .pub-book-now-header p {
    color: #b2bec3;
    font-size: 12px;
    margin: 0;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.tpl-editorial .pub-book-now-form { width: 100%; }
.tpl-editorial .pub-book-now-fields {
    display: flex;
    gap: 12px;
    align-items: flex-end;
    flex-wrap: wrap;
}
.tpl-editorial .pub-book-now-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
    flex: 1;
    min-width: 130px;
}
.tpl-editorial .pub-book-now-field label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #b2bec3;
    white-space: nowrap;
}
.tpl-editorial .pub-book-now-date { min-width: 130px; }
.tpl-editorial .pub-book-now .pub-input {
    border-radius: 0;
    border: 1px solid #dfe6e9;
    padding: 11px 14px;
    font-size: 14px;
    background: #ffffff;
    color: var(--text, #2d3436);
    transition: border-color 0.2s ease;
}
.tpl-editorial .pub-book-now .pub-input:focus {
    background: #fff;
    border-color: var(--text, #2d3436);
    box-shadow: none;
}
.tpl-editorial .pub-book-now-btn {
    flex-shrink: 0;
    white-space: nowrap;
    align-self: flex-end;
    border-radius: 0;
    padding: 12px 36px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    box-shadow: none;
    transition: background 0.25s ease, color 0.25s ease;
}
.tpl-editorial .pub-book-now-btn:hover {
    opacity: 0.85;
}
@media (max-width: 680px) {
    .tpl-editorial .pub-section-book_now { padding: 1.5rem 0; }
    .tpl-editorial .pub-book-now-inner { padding: 24px 20px; }
    .tpl-editorial .pub-book-now-header h2,
    .tpl-editorial .pub-section-book_now h2 { font-size: 12px; }
    .tpl-editorial .pub-book-now-fields { flex-direction: column; }
    .tpl-editorial .pub-book-now-field,
    .tpl-editorial .pub-book-now-btn { width: 100%; }
}

/* ================================= */
/* 6. ABOUT SECTION — ASYMMETRIC    */
/* ================================= */

.tpl-editorial .pub-about { gap: 4rem; }
.tpl-editorial .pub-about-text h2 {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 300;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text, #2d3436);
}

/* Body text — small sans-serif, generous line-height */
.tpl-editorial .pub-about-body {
    font-size: 15px;
    line-height: 2;
    color: #636e72;
}
/* Drop cap effect on first paragraph */
.tpl-editorial .pub-about-body::first-letter {
    font-size: 3.8em;
    float: left;
    line-height: 0.8;
    font-weight: 700;
    color: var(--text, #2d3436);
    margin-right: 8px;
    margin-top: 6px;
    font-family: var(--font-heading);
}
.tpl-editorial .pub-about-body::first-line {
    font-size: 1.05em;
    font-weight: 500;
    color: var(--text, #2d3436);
}
.tpl-editorial .pub-about-text p {
    font-size: 15px;
    line-height: 2;
    color: #636e72;
}

/* Sharp-edged image — no rounded corners */
.tpl-editorial .pub-about-image {
    background: linear-gradient(135deg, #ecf0f1 0%, #dfe6e9 100%);
    border-radius: 0;
}
.tpl-editorial .pub-about-image img {
    max-height: 520px;
    border-radius: 0;
    box-shadow: none;
}
.tpl-editorial .pub-about-image:hover img {
    transform: scale(1.02);
    box-shadow: none;
}
/* No decorative corner frame — editorial is austere */
.tpl-editorial .pub-about-image::after {
    display: none;
}

/* ================================= */
/* 7. FEATURE CARDS — BORDER-DEFINED */
/* ================================= */

/* No shadows, no rounded corners. Border-defined cards.
   Grid with varied column layouts for magazine feel. */
.tpl-editorial .pub-card {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 0;
    box-shadow: none;
    transition: border-color 0.3s ease;
}
.tpl-editorial .pub-card:hover {
    border-color: var(--text, #2d3436);
    transform: none;
    box-shadow: none;
}
.tpl-editorial .pub-card-title {
    font-weight: 600;
    color: var(--text, #2d3436);
    letter-spacing: 0.02em;
    text-transform: uppercase;
    font-size: 0.9rem;
}
.tpl-editorial .pub-card-text {
    color: #636e72;
    line-height: 1.8;
    font-size: 14px;
}

/* Feature card — specific overrides */
.tpl-editorial .pub-feature-card {
    border: 1px solid #e0e0e0;
    border-radius: 0;
    background: #ffffff;
    box-shadow: none;
    padding: 32px 24px 28px;
    transition: border-color 0.3s ease;
}
.tpl-editorial .pub-feature-card:hover {
    border-color: var(--text, #2d3436);
    transform: none;
    box-shadow: none;
}
/* Feature icon — small, square, accent-outlined */
.tpl-editorial .pub-feature-icon {
    width: 44px;
    height: 44px;
    background: transparent;
    border: 1px solid #e0e0e0;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent, #e74c3c);
    transition: border-color 0.2s ease, background 0.2s ease;
}
.tpl-editorial .pub-feature-card:hover .pub-feature-icon {
    border-color: var(--text, #2d3436);
    background: #2d3436;
    color: #ffffff;
}

/* Cards on dark background — clean, border-only */
.tpl-editorial .pub-section-dark .pub-card {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 0;
    padding: 32px 24px 28px;
    transition: border-color 0.3s ease;
}
.tpl-editorial .pub-section-dark .pub-card:hover {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.4);
    transform: none;
    box-shadow: none;
}
.tpl-editorial .pub-section-dark .pub-card-title {
    color: #ffffff;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.tpl-editorial .pub-section-dark .pub-card-text {
    color: #b2bec3;
    line-height: 1.8;
}
.tpl-editorial .pub-section-dark .pub-section-header { text-align: center; }
.tpl-editorial .pub-section-dark .pub-section-subtitle {
    margin-left: auto;
    margin-right: auto;
}

/* Dark feature cards */
.tpl-editorial .pub-section-dark .pub-feature-card {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.15);
}
.tpl-editorial .pub-section-dark .pub-feature-card:hover {
    border-color: rgba(255, 255, 255, 0.4);
    background: rgba(255, 255, 255, 0.03);
}
.tpl-editorial .pub-section-dark .pub-feature-icon {
    border-color: rgba(255, 255, 255, 0.2);
    color: var(--accent, #e74c3c);
}
.tpl-editorial .pub-section-dark .pub-feature-card:hover .pub-feature-icon {
    background: var(--accent, #e74c3c);
    border-color: var(--accent, #e74c3c);
    color: #ffffff;
}

/* Feature cards section header — left-aligned for editorial asymmetry */
.tpl-editorial .pub-section-feature_cards .pub-section-header {
    text-align: left;
    margin-bottom: 3rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e0e0e0;
}
.tpl-editorial .pub-section-feature_cards .pub-section-subtitle {
    max-width: 600px;
    color: #636e72;
    font-size: 14px;
    line-height: 1.8;
}

/* ================================= */
/* 7b. AMENITIES — GRID, NO FLUFF   */
/* ================================= */

.tpl-editorial .pub-amenity-item {
    padding: 20px 12px 18px;
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #e0e0e0;
    background: transparent;
    box-shadow: none;
    transition: background 0.2s ease;
}
.tpl-editorial .pub-amenity-item:hover {
    background: #fafafa;
    transform: none;
}
/* Minimal square icon container */
.tpl-editorial .pub-amenity-icon {
    width: 44px;
    height: 44px;
    background: transparent;
    border: 1px solid #e0e0e0;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent, #e74c3c);
    transition: border-color 0.2s ease, background 0.2s ease;
}
.tpl-editorial .pub-amenity-icon svg {
    width: 20px;
    height: 20px;
}
.tpl-editorial .pub-amenity-item:hover .pub-amenity-icon {
    border-color: var(--text, #2d3436);
    background: #2d3436;
    color: #ffffff;
}
.tpl-editorial .pub-amenity-item span {
    font-size: 11px;
    font-weight: 700;
    color: var(--text, #2d3436);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.4;
}

/* ================================= */
/* 8. ROOM CARDS — SHARP, EDITORIAL  */
/* ================================= */

.tpl-editorial .pub-room-card {
    border-radius: 0;
    box-shadow: none;
    border: 1px solid #e0e0e0;
    transition: border-color 0.35s ease;
}
.tpl-editorial .pub-room-card:hover {
    box-shadow: none;
    border-color: var(--text, #2d3436);
    transform: none;
}
/* Image placeholder gradient */
.tpl-editorial .pub-room-image {
    background: linear-gradient(135deg, #ecf0f1 0%, #dfe6e9 100%);
    min-height: 260px;
}
.tpl-editorial .pub-room-image img {
    height: 260px;
    transition: transform 0.6s ease;
}
.tpl-editorial .pub-room-card:hover .pub-room-image img {
    transform: scale(1.04);
}
.tpl-editorial .pub-room-info { padding: 24px 22px 20px; }
.tpl-editorial .pub-room-info h3 {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 10px;
    color: var(--text, #2d3436);
}
.tpl-editorial .pub-room-info p {
    font-size: 14px;
    color: #636e72;
    line-height: 1.75;
    margin-bottom: 16px;
}
.tpl-editorial .pub-room-meta {
    padding-top: 14px;
    border-top: 1px solid #e0e0e0;
}
.tpl-editorial .pub-room-price {
    font-size: 14px;
    font-weight: 700;
    color: var(--text, #2d3436);
    letter-spacing: 0.04em;
}
/* Sharp badge — no rounded corners */
.tpl-editorial .pub-room-badge {
    background: var(--accent, #e74c3c);
    border-radius: 0;
    box-shadow: none;
    letter-spacing: 0.08em;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}
.tpl-editorial .pub-btn-room {
    border-radius: 0;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 10px 24px;
    margin-top: 14px;
    box-shadow: none;
    transition: background 0.25s ease, color 0.25s ease;
}
.tpl-editorial .pub-btn-room:hover {
    transform: none;
    box-shadow: none;
    opacity: 0.85;
}
.tpl-editorial .pub-view-all-rooms {
    border-radius: 0;
    padding: 12px 40px;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    background: transparent;
    color: var(--text, #2d3436);
    border: 2px solid var(--text, #2d3436);
    transition: background 0.3s ease, color 0.3s ease;
}
.tpl-editorial .pub-view-all-rooms:hover {
    background: #2d3436;
    color: #ffffff;
    transform: none;
    box-shadow: none;
}

/* Rooms section heading */
.tpl-editorial .pub-section-rooms_preview .pub-section-tag,
.tpl-editorial .pub-section-rooms_list .pub-section-tag {
    font-size: 11px;
    letter-spacing: 0.18em;
}

/* ================================= */
/* 9. GALLERY — EDITORIAL GRID      */
/* ================================= */

/* CSS Grid: 3 columns. First item spans 2 cols + 2 rows for
   a magazine-style featured image layout. */
.tpl-editorial .pub-gallery-masonry {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
}
.tpl-editorial .pub-gallery-masonry .pub-gallery-item:first-child {
    grid-column: 1 / 3;
    grid-row: 1 / 3;
}
.tpl-editorial .pub-gallery-masonry .pub-gallery-item:first-child img {
    height: 100%;
    min-height: 400px;
}

.tpl-editorial .pub-gallery-item {
    border-radius: 0;
    overflow: hidden;
}
.tpl-editorial .pub-gallery-item img {
    height: 240px;
    border-radius: 0;
    transition: transform 0.5s ease, filter 0.5s ease;
}
.tpl-editorial .pub-gallery-item:hover img {
    transform: scale(1.03);
    filter: contrast(1.05);
}

/* Gallery caption — small, editorial, uppercase */
.tpl-editorial .pub-gallery-caption {
    font-size: 11px;
    color: #636e72;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 8px 0;
    text-align: center;
}

/* Gallery filter buttons — editorial: outlined, sharp */
.tpl-editorial .pub-gallery-filter {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e0e0e0;
}
.tpl-editorial .pub-gallery-filter-btn {
    border-radius: 0;
    border: 1px solid #e0e0e0;
    background: transparent;
    color: #636e72;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 6px 16px;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.tpl-editorial .pub-gallery-filter-btn.active,
.tpl-editorial .pub-gallery-filter-btn:hover {
    background: #2d3436;
    color: #ffffff;
    border-color: var(--text, #2d3436);
}

/* Gallery section header */
.tpl-editorial .pub-section-gallery .pub-section-header {
    text-align: left;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e0e0e0;
}

@media (max-width: 768px) {
    .tpl-editorial .pub-gallery-masonry {
        grid-template-columns: repeat(2, 1fr);
    }
    .tpl-editorial .pub-gallery-masonry .pub-gallery-item:first-child {
        grid-column: 1 / -1;
        grid-row: auto;
    }
    .tpl-editorial .pub-gallery-masonry .pub-gallery-item:first-child img {
        min-height: 260px;
    }
}
@media (max-width: 480px) {
    .tpl-editorial .pub-gallery-masonry {
        grid-template-columns: 1fr;
    }
}

/* ================================= */
/* 10. TESTIMONIALS — PULL QUOTES    */
/* ================================= */

/* Large pull-quote style with oversized quotation mark.
   No cards, no shadows — just type and space. */
.tpl-editorial .pub-testimonial {
    background: transparent;
    border: none;
    border-top: 1px solid #e0e0e0;
    border-radius: 0;
    box-shadow: none;
    padding: 36px 0 32px;
    text-align: center;
    transition: none;
}
.tpl-editorial .pub-testimonial:hover {
    box-shadow: none;
    transform: none;
}
/* Oversized opening quote — the editorial pull-quote mark */
.tpl-editorial .pub-testimonial-quote {
    color: var(--accent, #e74c3c);
    font-size: 6rem;
    font-family: var(--font-heading);
    opacity: 0.35;
    top: 6px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}
.tpl-editorial .pub-testimonial-text,
.tpl-editorial .pub-testimonial p {
    font-size: clamp(1.1rem, 2.2vw, 1.4rem);
    line-height: 1.8;
    font-style: italic;
    color: var(--text, #2d3436);
    font-weight: 300;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}
.tpl-editorial .pub-testimonial-author {
    font-size: 11px;
    font-weight: 700;
    color: #636e72;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-top: 8px;
}
.tpl-editorial .pub-testimonial-role {
    font-size: 10px;
    color: #b2bec3;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.tpl-editorial .pub-testimonial-avatar {
    width: 36px;
    height: 36px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: none;
    background: #2d3436;
    border-radius: 0;
}
.tpl-editorial .pub-testimonial-stars svg {
    fill: #e74c3c;
}

/* Testimonials on dark background */
.tpl-editorial .pub-section-dark .pub-testimonial {
    border-top-color: rgba(255, 255, 255, 0.1);
    background: transparent;
}
.tpl-editorial .pub-section-dark .pub-testimonial:hover {
    background: transparent;
    box-shadow: none;
}
.tpl-editorial .pub-section-dark .pub-testimonial-quote {
    color: var(--accent, #e74c3c);
    opacity: 0.3;
}
.tpl-editorial .pub-section-dark .pub-testimonial-text,
.tpl-editorial .pub-section-dark .pub-testimonial p {
    color: #dfe6e9;
    font-style: italic;
}
.tpl-editorial .pub-section-dark .pub-testimonial-author {
    color: #b2bec3;
}
.tpl-editorial .pub-section-dark .pub-testimonial-role {
    color: rgba(255, 255, 255, 0.35);
}
.tpl-editorial .pub-section-dark .pub-testimonial-avatar {
    background: var(--accent, #e74c3c);
    box-shadow: none;
}
.tpl-editorial .pub-section-dark .pub-testimonial-stars svg {
    fill: #e74c3c;
    filter: none;
}

/* ================================= */
/* 11. FAQ — CLEAN, MINIMAL LINES   */
/* ================================= */

.tpl-editorial .pub-faq {
    max-width: 740px;
    margin-left: auto;
    margin-right: auto;
}
.tpl-editorial .pub-faq-item {
    border-bottom: 1px solid #e0e0e0;
    padding: 0;
}
.tpl-editorial .pub-faq-question,
.tpl-editorial .pub-faq-item summary {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.04em;
    padding: 22px 0;
    color: var(--text, #2d3436);
    text-transform: none;
}
.tpl-editorial .pub-faq-item summary::after {
    content: '+';
    font-size: 18px;
    font-weight: 300;
    color: var(--accent, #e74c3c);
    border: none;
    transform: none;
    transition: transform 0.3s ease;
    flex-shrink: 0;
    width: auto;
    height: auto;
}
.tpl-editorial .pub-faq-item[open] summary::after {
    content: '\2212';
    transform: none;
}
.tpl-editorial .pub-faq-item summary:hover {
    color: var(--accent, #e74c3c);
}
.tpl-editorial .pub-faq-answer,
.tpl-editorial .pub-faq-item .pub-faq-answer {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.35s ease, padding 0.25s ease;
    padding: 0;
}
.tpl-editorial .pub-faq-item[open] .pub-faq-answer {
    max-height: 500px;
    padding: 0 0 22px 0;
}
.tpl-editorial .pub-faq-item p {
    font-size: 14px;
    line-height: 1.85;
    color: #636e72;
    padding-right: 32px;
    margin: 0;
}
/* Dark FAQ */
.tpl-editorial .pub-section-dark .pub-faq-item {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
.tpl-editorial .pub-section-dark .pub-faq-item summary,
.tpl-editorial .pub-section-dark .pub-faq-question {
    color: #ffffff;
}
.tpl-editorial .pub-section-dark .pub-faq-item summary::after {
    color: var(--accent, #e74c3c);
}
.tpl-editorial .pub-section-dark .pub-faq-item summary:hover {
    color: var(--accent, #e74c3c);
}
.tpl-editorial .pub-section-dark .pub-faq-item p {
    color: #b2bec3;
}

/* ================================= */
/* 12. CTA BANNER — DARK CHARCOAL   */
/* ================================= */

/* Sharp, bold CTA section. Black background with white type.
   No gradients, no pseudo-element decorations. */
.tpl-editorial .pub-cta {
    background: #2d3436;
    color: #ffffff;
    padding: 6rem 32px;
}
.tpl-editorial .pub-section-accent .pub-cta {
    background: #2d3436;
}
.tpl-editorial .pub-cta::before,
.tpl-editorial .pub-cta::after { display: none; }
.tpl-editorial .pub-cta h2 {
    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 300;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #ffffff;
}
.tpl-editorial .pub-cta h2::after { display: none !important; }
.tpl-editorial .pub-cta p {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.5);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
/* Outlined button — fills white on hover */
.tpl-editorial .pub-cta .pub-btn {
    border-radius: 0;
    background: transparent;
    color: #ffffff;
    border: 2px solid rgba(255, 255, 255, 0.6);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 14px 52px;
    box-shadow: none;
    transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.tpl-editorial .pub-cta .pub-btn:hover {
    background: #ffffff;
    color: var(--text, #2d3436);
    border-color: #ffffff;
    transform: none;
    opacity: 1;
}
@media (max-width: 768px) {
    .tpl-editorial .pub-cta { padding: 4rem 20px; }
    .tpl-editorial .pub-cta .pub-btn { padding: 12px 40px; }
}

/* ================================= */
/* 13. STATS — HORIZONTAL STRIP     */
/* ================================= */

/* Stats displayed as a horizontal strip with thin vertical dividers
   between each stat. Clean, informational, magazine-data style. */
.tpl-editorial .pub-stat-item {
    text-align: center;
}
.tpl-editorial .pub-stat-number {
    font-size: clamp(2.2rem, 5vw, 3.5rem);
    font-weight: 300;
    letter-spacing: 0.02em;
    color: var(--text, #2d3436);
}
.tpl-editorial .pub-stat-label {
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 700;
    color: #636e72;
}

/* Stats grid — horizontal with vertical dividers */
.tpl-editorial .pub-stats-grid {
    display: flex;
    justify-content: center;
    gap: 0;
    flex-wrap: wrap;
}
.tpl-editorial .pub-stats-grid > * {
    padding: 0 2.5rem;
    border-right: 1px solid #e0e0e0;
    text-align: center;
}
.tpl-editorial .pub-stats-grid > *:last-child {
    border-right: none;
}

/* Accent/dark section stats */
.tpl-editorial .pub-section-accent .pub-stats-grid { margin-top: 1.5rem; }
.tpl-editorial .pub-section-accent .pub-stat-number {
    text-shadow: none;
    color: #ffffff;
}
.tpl-editorial .pub-section-accent .pub-stat-label {
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.6);
}
.tpl-editorial .pub-section-accent .pub-stats-grid > * {
    border-right-color: rgba(255, 255, 255, 0.15);
}
.tpl-editorial .pub-section-dark .pub-stat-number { color: #ffffff; }
.tpl-editorial .pub-section-dark .pub-stat-label { color: #b2bec3; }
.tpl-editorial .pub-section-dark .pub-stats-grid > * {
    border-right-color: rgba(255, 255, 255, 0.1);
}

@media (max-width: 768px) {
    .tpl-editorial .pub-stats-grid > * {
        padding: 1rem 2rem;
        border-right: none;
        border-bottom: 1px solid #e0e0e0;
        width: 50%;
    }
    .tpl-editorial .pub-stats-grid > *:last-child,
    .tpl-editorial .pub-stats-grid > *:nth-last-child(2):nth-child(odd) {
        border-bottom: none;
    }
    .tpl-editorial .pub-section-accent .pub-stats-grid > *,
    .tpl-editorial .pub-section-dark .pub-stats-grid > * {
        border-right: none;
        border-bottom-color: rgba(255, 255, 255, 0.1);
    }
}

/* ================================= */
/* 14. PAGE HERO (sub-pages)         */
/* ================================= */

/* Dark charcoal page hero with sharp typography */
.tpl-editorial .pub-page-hero {
    background: #2d3436;
    margin-top: -1px;
    padding: 3rem 0 2.5rem;
}
.tpl-editorial .pub-page-hero::before {
    background: none;
}
.tpl-editorial .pub-page-hero-title {
    font-size: clamp(1.6rem, 3.5vw, 2.4rem);
    font-weight: 300;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.tpl-editorial .pub-page-hero-subtitle {
    color: rgba(255, 255, 255, 0.35);
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

/* ================================= */
/* 14b. CONTACT SECTION — EDITORIAL  */
/* ================================= */

.tpl-editorial .pub-contact-channels {
    border-bottom: 1px solid #e0e0e0;
    gap: 2rem;
    padding: 1.25rem 0;
    margin-bottom: 2rem;
}
.tpl-editorial .pub-contact-channel-icon {
    width: 40px;
    height: 40px;
    border-radius: 0;
    background: transparent;
    border: 1px solid #e0e0e0;
}
.tpl-editorial a.pub-contact-channel:hover .pub-contact-channel-icon {
    background: #2d3436;
    border-color: var(--text, #2d3436);
    color: #ffffff;
}

.tpl-editorial .pub-contact-form-panel h2 {
    font-size: clamp(1.4rem, 3vw, 2rem);
    font-weight: 300;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text, #2d3436);
}
.tpl-editorial .pub-contact-layout .pub-input {
    border-radius: 0;
    border: 1px solid #e0e0e0;
    padding: 11px 14px;
    background: #ffffff;
    font-size: 14px;
    transition: border-color 0.2s ease;
}
.tpl-editorial .pub-contact-layout .pub-input:focus {
    background: #fff;
    border-color: var(--text, #2d3436);
    box-shadow: none;
}
.tpl-editorial .pub-contact-layout .pub-input::placeholder { color: #b2bec3; }
.tpl-editorial .pub-contact-submit {
    border-radius: 0;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    box-shadow: none;
    transition: opacity 0.25s ease;
}
.tpl-editorial .pub-contact-submit:hover {
    transform: none;
    opacity: 0.85;
}

.tpl-editorial .pub-contact-map {
    border-radius: 0;
    box-shadow: none;
    border: 1px solid #e0e0e0;
}
.tpl-editorial .pub-contact-info-card {
    background: #fafafa;
    border-radius: 0;
    border: 1px solid #e0e0e0;
    padding: 1.25rem;
}
.tpl-editorial .pub-contact-success {
    border-radius: 0;
    background: #f0f9ef;
    border: 1px solid #d9edda;
}

/* ================================= */
/* 15. FOOTER — MINIMAL, CHARCOAL   */
/* ================================= */

/* Dark charcoal footer. Thin top border. Clean column layout.
   Minimal — like a magazine colophon page. */
.tpl-editorial .pub-footer {
    background: #2d3436;
    border-top: 1px solid #636e72;
    --footer-text: #dfe6e9;
    --footer-muted: #b2bec3;
    --footer-border: rgba(255, 255, 255, 0.08);
    --footer-social-bg: transparent;
}
.tpl-editorial .pub-footer-inner {
    padding: 3rem 0 2rem;
}
.tpl-editorial .pub-footer-name {
    color: #ffffff;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 700;
}
.tpl-editorial .pub-footer-tagline {
    color: #b2bec3;
    font-size: 12px;
    letter-spacing: 0.02em;
}
.tpl-editorial .pub-footer-link {
    color: #b2bec3;
    font-size: 12px;
    letter-spacing: 0.04em;
}
.tpl-editorial .pub-footer-link:hover { color: var(--accent, #e74c3c); }
.tpl-editorial .pub-footer-col-title {
    color: #636e72;
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 700;
}
.tpl-editorial .pub-footer-address {
    color: #b2bec3;
    font-size: 12px;
}
.tpl-editorial .pub-footer-legal-link { color: #636e72; }
.tpl-editorial .pub-footer-legal-link:hover { color: var(--accent, #e74c3c); }
.tpl-editorial .pub-footer-copy { color: #4a5568; font-size: 11px; }
.tpl-editorial .pub-powered { color: #4a5568; }

/* Footer social icons — outlined squares, no bg */
.tpl-editorial .pub-footer .pub-social-link {
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 0;
    background: transparent;
    transition: border-color 0.2s ease, background 0.2s ease;
}
.tpl-editorial .pub-footer .pub-social-link:hover {
    border-color: var(--accent, #e74c3c);
    background: rgba(231, 76, 60, 0.1);
}

/* Footer links — single column, tight */
.tpl-editorial .pub-footer-nav .pub-footer-links {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

/* Footer bottom divider */
.tpl-editorial .pub-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding-top: 1.5rem;
    margin-top: 2rem;
}
.tpl-editorial .pub-footer-brand {
    margin-bottom: 0.5rem;
}

/* ================================= */
/* 16. TEXT BLOCK — DROP CAP         */
/* ================================= */

/* Text sections get the editorial drop cap on the first paragraph */
.tpl-editorial .pub-section-text_block .pub-container p:first-of-type::first-letter {
    font-size: 4em;
    float: left;
    line-height: 0.75;
    font-weight: 700;
    color: var(--text, #2d3436);
    margin-right: 10px;
    margin-top: 8px;
    font-family: var(--font-heading);
}
.tpl-editorial .pub-section-text_block .pub-container p {
    font-size: 15px;
    line-height: 2;
    color: #636e72;
    max-width: 720px;
}

/* ================================= */
/* 17. VIDEO SECTION                 */
/* ================================= */

.tpl-editorial .pub-video-wrapper {
    border-radius: 0;
    box-shadow: none;
    border: 1px solid #e0e0e0;
}
.tpl-editorial .pub-video-caption {
    font-size: 12px;
    color: #636e72;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-top: 12px;
    text-align: center;
}

/* ================================= */
/* 18. AREA GUIDE                    */
/* ================================= */

.tpl-editorial .pub-section-area_guide .pub-section-header {
    text-align: left;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 2.5rem;
}

/* Area guide cards — sharp, border-defined, no shadows */
.tpl-editorial .pub-area-card {
    border: 1px solid #e0e0e0;
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
    transition: border-color 0.3s ease;
}
.tpl-editorial .pub-area-card:hover {
    border-color: var(--text, #2d3436);
    transform: none;
    box-shadow: none;
}
.tpl-editorial .pub-area-card img {
    border-radius: 0;
}

/* ================================= */
/* 19. REVIEWS                       */
/* ================================= */

.tpl-editorial .pub-review-card {
    border: none;
    border-bottom: 1px solid #e0e0e0;
    border-radius: 0;
    box-shadow: none;
    padding: 1.5rem 0;
}
.tpl-editorial .pub-review-stars svg {
    fill: #e74c3c;
}
.tpl-editorial .pub-review-text {
    font-size: 14px;
    line-height: 1.85;
    color: #636e72;
    font-style: italic;
}
.tpl-editorial .pub-review-author {
    font-size: 11px;
    font-weight: 700;
    color: var(--text, #2d3436);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* ================================= */
/* 20. IMAGE GRID                    */
/* ================================= */

/* Image grid — scope grid to .pub-gallery, not the whole container
   (container also holds the heading which must span full width) */
.tpl-editorial .pub-section-image_grid .pub-gallery {
    display: grid;
    grid-template-columns: repeat(var(--columns, 3), 1fr);
    gap: 4px;
}
.tpl-editorial .pub-section-image_grid img {
    border-radius: 0;
    width: 100%;
    height: 240px;
    object-fit: cover;
}
@media (max-width: 768px) {
    .tpl-editorial .pub-section-image_grid .pub-gallery {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 480px) {
    .tpl-editorial .pub-section-image_grid .pub-gallery {
        grid-template-columns: 1fr;
    }
}

/* ================================= */
/* 21. CHECK-IN LOOKUP               */
/* ================================= */

.tpl-editorial .pub-checkin-lookup {
    text-align: center;
    max-width: 520px;
    margin: 0 auto;
    padding: 16px 0;
}
.tpl-editorial .pub-checkin-icon {
    width: 52px;
    height: 52px;
    background: #2d3436;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
    box-shadow: none;
}
.tpl-editorial .pub-checkin-icon svg {
    width: 24px;
    height: 24px;
    stroke: #fff;
}
.tpl-editorial .pub-checkin-lookup h2 { margin-bottom: 10px; }
.tpl-editorial .pub-checkin-instructions {
    color: #636e72;
    font-size: 14px;
    line-height: 1.7;
    margin-bottom: 24px;
}
.tpl-editorial .pub-checkin-btn {
    border-radius: 0;
    padding: 13px 44px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    box-shadow: none;
    transition: opacity 0.25s ease;
}
.tpl-editorial .pub-checkin-btn:hover {
    transform: none;
    opacity: 0.85;
}
.tpl-editorial .pub-checkin-note {
    margin-top: 12px;
    font-size: 11px;
    color: #b2bec3;
    letter-spacing: 0.04em;
}

/* ================================= */
/* 22. FORMS — SHARP, MINIMAL       */
/* ================================= */

/* Form group styling — editorial: clean borders, no rounded corners */
.tpl-editorial .pub-form-group label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #636e72;
    margin-bottom: 6px;
    display: block;
}
.tpl-editorial .pub-form-group input,
.tpl-editorial .pub-form-group textarea,
.tpl-editorial .pub-form-group select {
    border-radius: 0;
    border: 1px solid #e0e0e0;
    padding: 11px 14px;
    font-size: 14px;
    background: #ffffff;
    color: var(--text, #2d3436);
    width: 100%;
    transition: border-color 0.2s ease;
    font-family: inherit;
}
.tpl-editorial .pub-form-group input::placeholder,
.tpl-editorial .pub-form-group textarea::placeholder {
    color: #b2bec3;
}
.tpl-editorial .pub-form-group input:focus,
.tpl-editorial .pub-form-group textarea:focus,
.tpl-editorial .pub-form-group select:focus {
    outline: none;
    border-color: var(--text, #2d3436);
    box-shadow: none;
}
.tpl-editorial .pub-form-group select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23636e72' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 36px;
}

/* ================================= */
/* 23. SCROLL REVEAL — FADE ONLY    */
/* ================================= */

/* Editorial: sections fade in cleanly with no vertical movement.
   Movement is distracting — let the typography command attention. */
.tpl-editorial .pub-reveal {
    opacity: 0;
    transform: none;
    transition: opacity 0.7s ease;
}
.tpl-editorial .pub-reveal.revealed {
    opacity: 1;
    transform: none;
}

.tpl-editorial .pub-reveal-stagger > * {
    opacity: 0;
    transform: none;
    transition: opacity 0.5s ease;
}
.tpl-editorial .pub-reveal-stagger.revealed > * {
    opacity: 1;
    transform: none;
}

/* Stagger delays — 100ms intervals */
.tpl-editorial .pub-reveal-stagger.revealed > *:nth-child(1) { transition-delay: 0ms; }
.tpl-editorial .pub-reveal-stagger.revealed > *:nth-child(2) { transition-delay: 100ms; }
.tpl-editorial .pub-reveal-stagger.revealed > *:nth-child(3) { transition-delay: 200ms; }
.tpl-editorial .pub-reveal-stagger.revealed > *:nth-child(4) { transition-delay: 300ms; }
.tpl-editorial .pub-reveal-stagger.revealed > *:nth-child(5) { transition-delay: 400ms; }
.tpl-editorial .pub-reveal-stagger.revealed > *:nth-child(6) { transition-delay: 500ms; }
.tpl-editorial .pub-reveal-stagger.revealed > *:nth-child(7) { transition-delay: 600ms; }
.tpl-editorial .pub-reveal-stagger.revealed > *:nth-child(8) { transition-delay: 700ms; }
.tpl-editorial .pub-reveal-stagger.revealed > *:nth-child(n+9) { transition-delay: 800ms; }

/* Editorial entrance: sections start invisible when JS is active */
.tpl-editorial .editorial-js .pub-section:not(.pub-section-hero):not(.pub-page-hero) {
    opacity: 0;
    transition: opacity 0.7s ease;
}
.tpl-editorial .editorial-js .pub-section:not(.pub-section-hero):not(.pub-page-hero).wave-in {
    opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
    .tpl-editorial .pub-reveal,
    .tpl-editorial .pub-reveal-stagger > * {
        opacity: 1;
        transform: none;
        transition: none;
    }
    .tpl-editorial .editorial-js .pub-section:not(.pub-section-hero):not(.pub-page-hero) {
        opacity: 1;
        transition: none;
    }
}

/* ================================= */
/* 24. GLOBAL BUTTON OVERRIDES       */
/* ================================= */

/* Editorial uses sharp, square buttons with heavy tracking */
.tpl-editorial .pub-btn {
    border-radius: 0;
    letter-spacing: 0.1em;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    background: #2d3436;
    color: #ffffff;
    border: 2px solid var(--text, #2d3436);
    box-shadow: none;
    transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
.tpl-editorial .pub-btn:hover {
    background: #1a1e20;
    border-color: #1a1e20;
    transform: none;
}
/* Dark/accent section — invert to white outlined */
.tpl-editorial .pub-section-dark .pub-btn,
.tpl-editorial .pub-section-accent .pub-btn {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.6);
}
.tpl-editorial .pub-section-dark .pub-btn:hover,
.tpl-editorial .pub-section-accent .pub-btn:hover {
    background: #ffffff;
    color: var(--text, #2d3436);
    border-color: #ffffff;
}
/* Room card button — charcoal outlined, fills on hover */
.tpl-editorial .pub-btn-room {
    background: transparent;
    color: var(--text, #2d3436);
    border: 2px solid var(--text, #2d3436);
}
.tpl-editorial .pub-btn-room:hover {
    background: #2d3436;
    color: #ffffff;
}
/* Global button — no hover transform (editorial = flat) */
.tpl-editorial .pub-btn {
    border-radius: 0;
    letter-spacing: 0.1em;
    font-weight: 700;
    transition: background 0.25s ease, color 0.25s ease, opacity 0.2s;
}

/* Secondary button — outlined, charcoal border, fills on hover */
.tpl-editorial .pub-btn-secondary {
    background: transparent;
    color: var(--text, #2d3436);
    border: 2px solid var(--text, #2d3436);
    border-radius: 0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 12px 36px;
    box-shadow: none;
    transition: background 0.3s ease, color 0.3s ease;
}
.tpl-editorial .pub-btn-secondary:hover {
    background: #2d3436;
    color: #ffffff;
    transform: none;
}
/* Secondary on dark bg */
.tpl-editorial .pub-section-dark .pub-btn-secondary,
.tpl-editorial .pub-section-accent .pub-btn-secondary {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.6);
}
.tpl-editorial .pub-section-dark .pub-btn-secondary:hover,
.tpl-editorial .pub-section-accent .pub-btn-secondary:hover {
    background: #ffffff;
    color: var(--text, #2d3436);
    border-color: #ffffff;
}

/* ================================= */
/* 25. DARK SECTION BACKGROUND       */
/* ================================= */

/* Editorial dark = charcoal black, not brown or navy */
.tpl-editorial .pub-section-dark {
    background: #2d3436 !important;
}
.tpl-editorial .pub-section-dark h2 {
    color: #ffffff;
}
.tpl-editorial .pub-section-dark .pub-section-subtitle {
    color: #b2bec3;
}

/* ================================= */
/* 26. ACCENT SECTION                */
/* ================================= */

/* Accent sections in editorial use a very dark charcoal — nearly black */
.tpl-editorial .pub-section-accent {
    background: #1a1a1a !important;
}
.tpl-editorial .pub-section-accent h2 {
    color: #ffffff;
}
.tpl-editorial .pub-section-accent .pub-section-subtitle {
    color: #b2bec3;
}

/* ================================= */
/* 27. LINK COLOUR                   */
/* ================================= */

/* All links within editorial content use the vivid red-orange accent */
.tpl-editorial a:not(.pub-btn):not(.pub-nav a):not(.pub-footer-link):not(.pub-logo) {
    color: var(--accent, #e74c3c);
}
.tpl-editorial a:not(.pub-btn):not(.pub-nav a):not(.pub-footer-link):not(.pub-logo):hover {
    color: #c0392b;
}

/* ================================= */
/* 28. SECTION SUBTITLE              */
/* ================================= */

/* Subtitles: small, uppercase, grey — secondary information */
.tpl-editorial .pub-section-subtitle {
    font-size: 13px;
    color: #636e72;
    letter-spacing: 0.04em;
    line-height: 1.7;
}

/* ================================= */
/* 29. COOKIE BANNER — SHARP         */
/* ================================= */

/* Editorial cookie banner: sharp edges, charcoal bg, clean type */
.tpl-editorial .pub-cookie-banner {
    border-radius: 0;
    background: #2d3436;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
}
.tpl-editorial .pub-cookie-banner p {
    font-size: 13px;
    color: #dfe6e9;
    letter-spacing: 0.02em;
}
.tpl-editorial .pub-cookie-banner a {
    color: var(--accent, #e74c3c);
}
.tpl-editorial .pub-cookie-banner .pub-btn {
    border-radius: 0;
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 700;
}

/* ================================= */
/* 31. WHATSAPP BUTTON — SQUARE      */
/* ================================= */

/* Sharp square instead of circle — matches editorial edges */
.tpl-editorial .pub-whatsapp-btn {
    border-radius: 0;
}

/* ================================= */
/* 32. WAVE DIVIDERS — DISABLED      */
/* ================================= */

/* Editorial does NOT use wave dividers. Hairline rules define
   section separation. Hide any wave elements if injected by JS. */
.tpl-editorial .pub-wave-divider,
.tpl-editorial .pub-wave-top,
.tpl-editorial .pub-wave {
    display: none !important;
}

/* ================================= */
/* 33. SOCIAL LINKS                  */
/* ================================= */

/* Content-area social links — square, outlined */
.tpl-editorial .pub-social-link {
    border: 1px solid #e0e0e0;
    border-radius: 0;
    background: transparent;
    color: #636e72;
    transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.tpl-editorial .pub-social-link:hover {
    border-color: var(--text, #2d3436);
    background: #2d3436;
    color: #ffffff;
}

/* ================================= */
/* 34. RESPONSIVE FINE-TUNING        */
/* ================================= */

@media (max-width: 768px) {
    /* Tighten the oversized headings on mobile */
    .tpl-editorial .pub-section h2 {
        font-size: clamp(1.6rem, 6vw, 2.2rem);
        letter-spacing: 0.04em;
    }

    /* Hero headline scales down but stays light-weight */
    .tpl-editorial .pub-hero-content h1 {
        font-size: clamp(2rem, 8vw, 3rem);
        letter-spacing: 0.03em;
    }

    /* Hero subtitle */
    .tpl-editorial .pub-hero-content p {
        font-size: 0.8rem;
        letter-spacing: 0.03em;
    }

    /* Testimonial text scales down */
    .tpl-editorial .pub-testimonial-text,
    .tpl-editorial .pub-testimonial p {
        font-size: 1rem;
    }

    /* Drop cap slightly smaller on mobile */
    .tpl-editorial .pub-about-body::first-letter {
        font-size: 3em;
    }
    .tpl-editorial .pub-section-text_block .pub-container p:first-of-type::first-letter {
        font-size: 3.2em;
    }

    /* Stats strip becomes 2-column on mobile (handled above) */

    /* Gallery grid already responsive (handled above) */

    /* CTA button full width on mobile */
    .tpl-editorial .pub-cta .pub-btn {
        padding: 12px 32px;
        width: auto;
    }

    /* Footer tighten */
    .tpl-editorial .pub-footer-inner {
        padding: 2rem 0 1.5rem;
    }
}

@media (max-width: 480px) {
    /* Single column stats on very small screens */
    .tpl-editorial .pub-stats-grid > * {
        width: 100%;
        padding: 0.8rem 1rem;
    }

    /* Room cards: full width, no side padding issues */
    .tpl-editorial .pub-room-info { padding: 18px 16px 16px; }

    /* Testimonial quote mark smaller */
    .tpl-editorial .pub-testimonial-quote {
        font-size: 4rem;
    }

    /* Feature cards stack fully */
    .tpl-editorial .pub-feature-card {
        padding: 24px 18px 22px;
    }
}

/* ================================= */
/* 35. PRINT STYLES                  */
/* ================================= */

@media print {
    .tpl-editorial .pub-header,
    .tpl-editorial .pub-footer,
    .tpl-editorial .pub-section-hero,
    .tpl-editorial .pub-section-cta_banner,
    .tpl-editorial .pub-section-book_now,
    .tpl-editorial .pub-cookie-banner,
    .tpl-editorial .pub-whatsapp-btn,
    .tpl-editorial .pub-announcement-bar {
        display: none;
    }
    .tpl-editorial .pub-section {
        padding: 2rem 0;
        border-bottom: 1px solid #ccc;
    }
    .tpl-editorial .pub-section h2 {
        font-size: 1.5rem;
    }
    .tpl-editorial .pub-reveal,
    .tpl-editorial .pub-reveal-stagger > * {
        opacity: 1;
        transform: none;
    }
    /* Preserve editorial drop caps in print */
    .tpl-editorial .pub-about-body::first-letter,
    .tpl-editorial .pub-section-text_block .pub-container p:first-of-type::first-letter {
        font-size: 3em;
    }
}