/* custom.css — Stable CSS moved from Site Header/Footer code injection */

/* === PWA STANDALONE: Safe area inset for status bar/Dynamic Island === */
@media (display-mode: standalone) {
   body {
      padding-top: env(safe-area-inset-top, 0px);
   }
}

/* === SEARCH REDESIGN (moved from Site Header, Block 1) === */
body.search-is-active .search-section{display:flex !important;align-items:center !important;justify-content:center !important}body.search-is-active .search-content{top:auto !important;max-height:85vh !important}

.search-results{display:grid !important;grid-template-columns:repeat(2,1fr) !important;gap:14px !important;padding:14px !important;overflow-x:hidden !important;overflow-y:auto !important;max-height:498px !important;scrollbar-width:thin;scrollbar-color:rgba(146,172,185,0.3) transparent}.search-results::-webkit-scrollbar{width:4px}.search-results::-webkit-scrollbar-track{background:transparent}.search-results::-webkit-scrollbar-thumb{background:rgba(146,172,185,0.3);border-radius:4px}.search-results::-webkit-scrollbar-thumb:hover{background:rgba(146,172,185,0.5)}.search-results a.search-card{margin:0 !important;font-size:inherit !important;display:flex !important;line-height:normal !important}.search-results a.search-card:last-of-type{margin-bottom:0 !important}.search-results small{display:none !important}.search-card{display:flex;flex-direction:column;overflow:hidden;border-radius:var(--border-radius,4px);background:var(--color-one);text-decoration:none;color:inherit;outline:2px solid transparent;outline-offset:-2px;transition:outline-color .15s ease}.search-card.is-selected,.search-results:not(.is-keyboard) .search-card:hover{outline-color:#92ACB9}.search-card-image{width:100%;height:372px;overflow:hidden;background:var(--color-five)}.search-card-image img{width:100%;height:372px;object-fit:cover;object-position:top center;display:block}.search-card-body{padding:12px 14px 14px}.search-card-tag{font-family:var(--font-family-secondary);font-size:10px;font-weight:var(--font-weight-secondary-bolder);display:inline-block;padding:2px 8px;margin-bottom:8px;border-radius:var(--border-radius-small,2px);background:#92ACB9;color:#182029;text-transform:uppercase;letter-spacing:1px}.search-card-title{font-family:var(--font-family-primary);font-size:16px;font-weight:var(--font-weight-primary-regular);line-height:1.3;margin:0 0 4px;color:var(--color-font-one);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.search-card-excerpt{font-family:var(--font-family-secondary);font-size:12px;line-height:1.4;margin:0;color:var(--color-font-two);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.search-card-date{font-family:var(--font-family-secondary);font-size:11px;margin:0;color:var(--color-font-two);opacity:.7}
@media (max-width:600px){.search-results{grid-template-columns:repeat(2,1fr);gap:10px;padding:12px 15px 12px !important}.search-card-body{padding:10px 10px 12px}.search-card-title{font-size:14px}.search-card-tag{font-size:9px;margin-bottom:6px}}

/* === TAG ARCHIVE HEADER (moved from Site Header, Block 2) === */
.tag-archive-header{position:relative;overflow:hidden;border-radius:var(--border-radius);margin-bottom:var(--margin-items)}.tag-archive-header-bg{position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;background:url('https://res.cloudinary.com/dj8x7wh8w/image/upload/v1773993270/j6q207tbre7gpnhqoxwh.jpg') center center / cover no-repeat}.tag-archive-header-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;padding:24px;gap:24px}.tag-archive-info{flex:0 1 auto;display:flex;align-items:center;gap:16px;padding:24px 30px;border-radius:calc(var(--border-radius) + 2px);background:var(--color-body);max-width:480px}.tag-archive-info-text{flex:1}.tag-archive-name{font-size:33px;margin:0 0 0 -1px;line-height:1.1}.tag-archive-desc{font-family:var(--font-family-primary);font-weight:var(--font-weight-primary-regular);font-size:15px;line-height:1.4;margin:14px 0 0;color:var(--color-font-two)}.tag-archive-counter{display:flex;align-items:center;justify-content:center;min-width:70px;min-height:70px;border-radius:var(--border-radius);background:var(--color-one)}.tag-archive-counter span{font-family:var(--font-family-primary);font-size:40px;font-weight:var(--font-weight-primary-regular);line-height:1;color:var(--color-font-one)}.tag-archive-image{flex:0 0 auto}.tag-archive-image img{width:230px;height:230px;object-fit:cover;display:block;border-radius:var(--border-radius)}.tag-archive-letter{width:230px;height:230px;display:flex;align-items:center;justify-content:center;border-radius:var(--border-radius);background:rgba(0,0,0,0.12);font-family:var(--font-family-primary);font-size:120px;font-weight:var(--font-weight-primary-regular);color:rgba(255,255,255,0.25);line-height:1;visibility:hidden}.tag-archive-letter.is-ready{visibility:visible}body.tag-template .archive-section{display:none !important}
.tag-mobile-header{display:none;background:var(--color-two);border:1px solid var(--color-three);border-radius:var(--border-radius);padding:14px 16px;align-items:center;justify-content:space-between;gap:12px;margin-bottom:var(--margin-items)}.tag-mobile-header-name{font-family:var(--font-family-primary);font-weight:var(--font-weight-primary-regular);font-size:20px;margin:0;line-height:1.2;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--color-font-one)}.tag-mobile-header-counter{flex-shrink:0;background:#92ACB9;border-radius:var(--border-radius);width:52px;height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.tag-mobile-counter-number{font-family:var(--font-family-primary);font-size:20px;font-weight:var(--font-weight-primary-regular);color:#fff;line-height:1}.tag-mobile-counter-label{font-family:var(--font-family-primary);font-size:9px;color:rgba(255,255,255,0.75);line-height:1;letter-spacing:0.03em}@media (max-width:768px){.tag-archive-header{display:none}.tag-mobile-header{display:flex}body.tag-template .archive-section{display:block !important}}
@media (min-width:769px) and (max-width:1024px){.tag-archive-image img,.tag-archive-letter{width:180px;height:180px;font-size:90px}.tag-archive-name{font-size:28px}.tag-archive-info{padding:20px 24px}}

/* === PAGE BANNER HEADER (moved from Site Header, Block 3) === */
.page-banner-header{position:relative;overflow:hidden;border-radius:var(--border-radius);margin-bottom:28px}.page-banner-bg{width:100%;padding-top:21.4%;background-size:cover;background-position:center center;background-repeat:no-repeat}.page-banner-frosted{background:rgba(146,172,185,0.06);border:1px solid rgba(146,172,185,0.15);border-radius:12px}.page-banner-frosted-inner{width:100%;padding-top:21.4%;position:relative}.page-banner-frosted-title{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;font-size:42px;margin:0;color:var(--color-font-one)}.page-banner-sr-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (min-width:769px) and (max-width:1024px){.page-banner-frosted-title{font-size:34px}}
@media (max-width:768px){.page-banner-header{display:none}}

/* === PAGE SIDEBAR (moved from Site Header, Block 4) === */
@media (min-width:769px){.page-content-layout{display:flex;gap:40px;max-width:960px;margin:0 auto;padding:0 20px;justify-content:center}.page-content-layout .post-content{flex:1;min-width:0;max-width:720px}.page-sidebar{flex:0 0 180px;padding-top:8px}.page-sidebar-inner{position:sticky;top:100px}.page-sidebar-card{background:rgba(146,172,185,0.06);border:1px solid rgba(146,172,185,0.12);border-radius:8px;padding:18px}.page-sidebar-section{margin-bottom:20px}.page-sidebar-section:last-child,.page-sidebar-note-slot:last-child .page-sidebar-section{margin-bottom:0}.page-sidebar-note-slot{display:none}.page-sidebar-note-slot.has-note{display:block}.page-sidebar-note-slot .page-sidebar-section{margin-top:20px;margin-bottom:0}.page-sidebar-credit-slot{display:none}.page-sidebar-credit-slot.has-note{display:block}.page-sidebar-credit-slot .page-sidebar-section{margin-top:20px;margin-bottom:0}.page-sidebar-label{display:block;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--ghost-accent-color);opacity:0.7;margin-bottom:6px}.page-sidebar-value{display:block;font-size:13px;color:var(--color-font-two)}.page-sidebar-links{display:flex;flex-direction:column;gap:0}.page-sidebar-links a{font-size:13px;color:var(--ghost-accent-color);text-decoration:none;transition:color 0.15s ease;line-height:1.7}.page-sidebar-links a:hover{color:var(--color-font-one)}.page-sidebar-links a.is-current{display:none}}
@media (max-width:768px){.page-content-layout{display:block}.page-sidebar{display:none}}

/* === ARCHIVE PAGINATION (moved from Site Header, Block 5) === */
body .archive-pagination{display:block !important;visibility:visible !important;opacity:1 !important;margin:0 auto 10vh !important;text-align:center !important;padding:3rem 1rem !important}body .archive-pagination .archive-nav{display:flex !important;align-items:center !important;justify-content:center !important;gap:2.5rem !important;flex-wrap:nowrap !important}body .archive-nav-prev,body .archive-nav-next,body .archive-nav-info,body .archive-nav-disabled{font-family:var(--font-family-primary) !important;font-size:18px !important;line-height:1.4 !important;font-weight:400 !important;padding:12px 24px !important;white-space:nowrap !important;display:inline-block !important}body .archive-nav-prev,body .archive-nav-next{color:var(--ghost-accent-color) !important;text-decoration:none !important;transition:opacity 0.2s ease !important}body .archive-nav-prev:hover,body .archive-nav-next:hover{opacity:0.7 !important}body .archive-nav-disabled{color:var(--color-meta) !important;opacity:0.4 !important;cursor:not-allowed !important}body .archive-nav-info{color:var(--color-text) !important}
@media (max-width:768px){body .archive-pagination .archive-nav{gap:2rem !important}body .archive-nav-prev,body .archive-nav-next,body .archive-nav-info,body .archive-nav-disabled{font-size:17px !important;padding:10px 18px !important}}
@media (max-width:640px){body .archive-pagination{padding:2.5rem 0.5rem !important}body .archive-pagination .archive-nav{gap:1.5rem !important}body .archive-nav-prev,body .archive-nav-next,body .archive-nav-info,body .archive-nav-disabled{font-size:16px !important;padding:8px 12px !important}}
@media (max-width:480px){body .archive-pagination{padding:2rem 0.25rem !important}body .archive-pagination .archive-nav{gap:1rem !important}body .archive-nav-prev,body .archive-nav-next,body .archive-nav-info,body .archive-nav-disabled{font-size:15px !important;padding:8px 10px !important}}
@media (max-width:375px){body .archive-pagination .archive-nav{gap:0.75rem !important}body .archive-nav-prev,body .archive-nav-next,body .archive-nav-info,body .archive-nav-disabled{font-size:14px !important;padding:6px 8px !important}}



/* === FOCAL POINT / IMAGE POSITION (moved from Site Header, Block 8) === */
.global-image img,.nextprev-image img,.archive-image img,.pinned-image img{object-position:center 20% !important}.post-header[data-img-pos="top"] .post-image img{object-position:center top !important}.post-header[data-img-pos="bottom"] .post-image img{object-position:center bottom !important}.post-header[data-img-pos="left"] .post-image img{object-position:left center !important}.post-header[data-img-pos="right"] .post-image img{object-position:right center !important}.post-header[data-img-pos="top-left"] .post-image img{object-position:left top !important}.post-header[data-img-pos="top-right"] .post-image img{object-position:right top !important}.post-header[data-img-pos="bottom-left"] .post-image img{object-position:left bottom !important}.post-header[data-img-pos="bottom-right"] .post-image img{object-position:right bottom !important}.post-header[data-img-pos="center"] .post-image img{object-position:center center !important}.loop-item[data-img-pos="top"] .global-image img{object-position:center top !important}.loop-item[data-img-pos="bottom"] .global-image img{object-position:center bottom !important}.loop-item[data-img-pos="left"] .global-image img{object-position:left center !important}.loop-item[data-img-pos="right"] .global-image img{object-position:right center !important}.loop-item[data-img-pos="top-left"] .global-image img{object-position:left top !important}.loop-item[data-img-pos="top-right"] .global-image img{object-position:right top !important}.loop-item[data-img-pos="bottom-left"] .global-image img{object-position:left bottom !important}.loop-item[data-img-pos="bottom-right"] .global-image img{object-position:right bottom !important}.loop-item[data-img-pos="center"] .global-image img{object-position:center center !important}.pinned-item[data-img-pos="top"] .global-image img{object-position:center top !important}.pinned-item[data-img-pos="bottom"] .global-image img{object-position:center bottom !important}.pinned-item[data-img-pos="left"] .global-image img{object-position:left center !important}.pinned-item[data-img-pos="right"] .global-image img{object-position:right center !important}.pinned-item[data-img-pos="top-left"] .global-image img{object-position:left top !important}.pinned-item[data-img-pos="top-right"] .global-image img{object-position:right top !important}.pinned-item[data-img-pos="bottom-left"] .global-image img{object-position:left bottom !important}.pinned-item[data-img-pos="bottom-right"] .global-image img{object-position:right bottom !important}.pinned-item[data-img-pos="center"] .global-image img{object-position:center center !important}.nextprev-newer[data-img-pos] .nextprev-image img,.nextprev-older[data-img-pos] .nextprev-image img{object-position:center 20% !important}[data-img-pos="top"] .nextprev-image img{object-position:center top !important}[data-img-pos="bottom"] .nextprev-image img{object-position:center bottom !important}[data-img-pos="left"] .nextprev-image img{object-position:left center !important}[data-img-pos="right"] .nextprev-image img{object-position:right center !important}[data-img-pos="top-left"] .nextprev-image img{object-position:left top !important}[data-img-pos="top-right"] .nextprev-image img{object-position:right top !important}[data-img-pos="bottom-left"] .nextprev-image img{object-position:left bottom !important}[data-img-pos="bottom-right"] .nextprev-image img{object-position:right bottom !important}[data-img-pos="center"] .nextprev-image img{object-position:center center !important}

/* === IMAGE TOOLTIP (moved from Site Header, Block 9) === */
.image-tooltip-trigger{position:relative;cursor:help;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}.image-tooltip{position:fixed;top:0;left:0;z-index:999999;pointer-events:none;opacity:0;transition:opacity 0.2s ease;max-width:600px;width:auto}.image-tooltip.visible{opacity:1}.image-tooltip-container{background:#fff;border:2px solid #92ACB9;border-radius:8px;padding:8px;box-shadow:0 4px 20px rgba(0,0,0,0.15)}
@media (prefers-color-scheme:dark){.image-tooltip-container{background:#182029;border-color:#92ACB9}}.image-tooltip-image{display:block;max-width:100%;height:auto;border-radius:4px}
@media (max-width:1023px){.image-tooltip{display:none !important}.image-tooltip-trigger{cursor:default;text-decoration:underline;text-decoration-style:solid}}

/* === ENTITY LINK (moved from Site Header, Block 10) === */
a.entity-link{color:var(--color-font-one);text-decoration:wavy underline #92ACB9;text-decoration-thickness:0.8px;text-underline-offset:5px;transition:text-decoration-color 0.15s ease;border-bottom:none !important}a.entity-link:hover{text-decoration-color:var(--color-font-one);border-bottom:none !important}
.pm-ext-icons{display:inline-flex;align-items:center;gap:2px;vertical-align:text-bottom;margin-left:3px;line-height:1}.pm-ext-icons a{display:inline-flex;align-items:center;line-height:1;text-decoration:none !important;border-bottom:none !important;transition:color 0.15s ease;padding:3px 2px;position:relative;top:1px}.pm-ext-icons a.pm-active{color:#92ACB9;cursor:pointer}.pm-ext-icons a.pm-active:hover{color:var(--color-font-one)}.pm-ext-icons a.pm-inactive{color:var(--color-border-two,rgba(150,150,150,0.25));cursor:default;pointer-events:none}.pm-ext-paren{color:rgba(146,172,185,0.5);font-size:0.85em;line-height:1}.pm-ext-slash{color:rgba(146,172,185,0.4);font-size:11px;line-height:1;margin:0 1px}

/* === TAG-TEMPLATE LOOP GRID (moved from Site Header, Block 11) === */
.loop-wrap .loop-item:not(.is-first){flex-grow:0 !important}

body.tag-template .loop-wrap .loop-item:not(.is-first){flex-grow:0 !important;flex-basis:calc(25% - var(--margin-items)) !important}
@media (max-width:480px){body.tag-template .loop-wrap .loop-item:not(.is-first){flex-basis:calc(100% - var(--margin-items)) !important}}
@media (min-width:481px) and (max-width:768px){body.tag-template .loop-wrap .loop-item:not(.is-first){flex-basis:calc(50% - var(--margin-items)) !important}}
@media (min-width:769px) and (max-width:1024px){body.tag-template .loop-wrap .loop-item:not(.is-first){flex-basis:calc(33.333% - var(--margin-items)) !important;flex-grow:0 !important}}

/* === HOVER/TRANSFORM DISABLE (moved from Site Header, Block 12) === */
@media (hover:none) and (pointer:coarse){.global-underline{transition:none !important;background:none !important}.global-underline:hover{background-size:0 !important}}
@media (max-width:1023px){.global-underline{transition:none !important;background:none !important}.global-underline:hover{background-size:0 !important}}

@media (hover:none) and (pointer:coarse){.pinned-item:hover,.loop-item-wrap:hover,.post-content .kg-bookmark-container:hover,.widget-content.authors a:hover{transform:none !important}}
@media (max-width:1023px){.pinned-item:hover,.loop-item-wrap:hover,.post-content .kg-bookmark-container:hover,.widget-content.authors a:hover{transform:none !important}}

/* === ENTITY TAG NAME CLEANER CSS (moved from Site Header, Block 15) === */
.post-tags a[href^="/tag/photographer-"],.post-tags a[href^="/tag/model-"]{display:none !important}
.entity-tag-page .tag-archive-info{opacity:0}.entity-tag-page .tag-archive-info.is-ready{opacity:1;transition:opacity 0.1s ease}.entity-tag-page .tag-mobile-header-name{opacity:0}.entity-tag-page .tag-mobile-header-name.is-ready{opacity:1;transition:opacity 0.1s ease}



/* === TAG GRID CSS (moved from Site Footer, Block 2) === */
.widget-content.tags-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:16px;padding:54px;opacity:0;transition:opacity 0.3s ease}.widget-content.tags-grid.is-loaded{opacity:1}.widget-content.tags{display:none}.widget-tags{margin-top:48px}.tag-grid-card{position:relative;aspect-ratio:1;border-radius:var(--border-radius);overflow:hidden;display:flex;align-items:flex-end;justify-content:center;transition:box-shadow 0.2s ease;box-shadow:0 2px 8px rgba(0,0,0,0.1);text-decoration:none}.tag-grid-card:hover{box-shadow:0 4px 16px rgba(0,0,0,0.2)}.tag-grid-image{position:absolute;inset:0;background-size:cover;background-position:center}.tag-grid-fallback{background:linear-gradient(135deg,var(--color-five) 0%,var(--color-six) 100%)}.tag-grid-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,0.00),rgba(0,0,0,0.10));transition:background 0.3s ease}.tag-grid-card:hover .tag-grid-overlay{background:linear-gradient(to bottom,rgba(0,0,0,0.00),rgba(0,0,0,0.00))}.tag-grid-name{position:relative;z-index:1;font-family:var(--font-family-primary);font-size:clamp(11px,1.1vw,16px);font-weight:var(--font-weight-primary-regular);color:#fff;text-align:center;padding:0 8px 12px;line-height:1.2;text-shadow:0 1px 2px rgba(0,0,0,0.9),0 2px 8px rgba(0,0,0,0.8),0 0 16px rgba(0,0,0,0.6);transition:transform 0.2s ease;word-break:keep-all;overflow-wrap:normal;hyphens:none;max-width:100%}.tag-grid-card:hover .tag-grid-name{transform:scale(1.05)}
@media (max-width:1024px){.widget-content.tags-grid{display:none !important}.widget-content.tags{display:flex !important;flex-wrap:wrap}.widget-content.tags a{margin:6px;color:var(--color-font-one);border-radius:var(--border-radius-big);background-color:var(--color-six);line-height:1;display:inline-block;padding:15px;transition-timing-function:ease;transition-duration:.15s;transition-property:color,background-color;letter-spacing:1px}.widget-content.tags a:hover{color:var(--color-font-three);background-color:var(--ghost-accent-color)}}
@media (min-width:1025px) and (max-width:1280px){.widget-content.tags-grid{padding:36px;gap:12px}.tag-grid-name{font-size:clamp(10px,1vw,14px)}}
@media (min-width:1281px) and (max-width:1440px){.widget-content.tags-grid{gap:14px}.tag-grid-name{font-size:clamp(10px,1.05vw,15px)}}
@media (min-width:1025px){.tag-grid-image{transform:scale(1.03);transform-origin:center center;will-change:transform}.tag-grid-card::after{content:'';position:absolute;inset:0;border:2px solid rgba(255,255,255,1);border-radius:var(--border-radius);pointer-events:none;transition:border-color 0.3s ease}.tag-grid-card:hover::after{border-color:var(--ghost-accent-color)}}

/* === TAG CAROUSEL CSS (moved from Site Footer, Block 3) === */

@media (max-width:1024px){.widget-content.tags,.widget-content.global-tags{display:none !important}.tag-carousel-container{display:block;position:relative;width:100%;padding:20px 0}.tag-carousel-wrapper{overflow:hidden;margin:0 45px}.tag-carousel-track{display:flex;gap:12px;transition:transform 0.3s ease}.tag-carousel-card{position:relative;flex:0 0 calc((100% - 12px) / 2);aspect-ratio:1;border-radius:8px;overflow:hidden;text-decoration:none;display:block;border:2px solid #92ACB9;box-sizing:border-box}.tag-carousel-image{width:100%;height:100%;background-size:cover;background-position:center;transform:scale(1.03);transform-origin:center center}.tag-carousel-fallback{background:linear-gradient(135deg,#2a3344 0%,#1a2333 100%)}.tag-carousel-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to bottom,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.10) 100%)}.tag-carousel-name{position:absolute;bottom:12px;left:12px;right:12px;color:#fff;font-size:13px;font-weight:600;z-index:2;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,0.9),0 2px 8px rgba(0,0,0,0.8),0 0 16px rgba(0,0,0,0.6)}.tag-carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);background:none;border:none;color:#92ACB9;font-size:32px;line-height:1;cursor:pointer;z-index:10;padding:0;user-select:none;-webkit-tap-highlight-color:transparent}.tag-carousel-arrow:active{color:#fff}.tag-carousel-arrow.disabled{opacity:0.3}.tag-carousel-arrow-left{left:0}.tag-carousel-arrow-right{right:0}.tag-carousel-dots{display:flex;justify-content:center;gap:8px;margin-top:15px}.tag-carousel-dot{width:8px;height:8px;border-radius:50%;background:#2a3344;border:none;padding:0;cursor:pointer;transition:all 0.2s ease;-webkit-tap-highlight-color:transparent}.tag-carousel-dot.active{background:#92ACB9;width:24px;border-radius:4px}}
@media (min-width:1025px){.tag-carousel-container{display:none !important}}

/* === EMAIL SLIDE-IN CSS (moved from Site Footer, Block 4) === */
#email-slide-in{position:fixed;bottom:20px;left:50%;transform:translateX(-50%) translateY(120%);max-width:450px;width:calc(100% - 40px);padding:24px;border-radius:8px;box-shadow:0 4px 20px rgba(0,0,0,0.15);z-index:9999;transition:transform 0.3s ease-in-out;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:#ffffff;border:8px solid #92ACB9}#email-slide-in.show{transform:translateX(-50%) translateY(0)}#email-slide-in h3{margin:0 0 8px 0;font-size:20px;font-weight:600;line-height:1.3;color:#182029}#email-slide-in p{margin:0 0 16px 0;font-size:15px;line-height:1.5;opacity:0.85;color:#15171A}#email-slide-in-form{display:flex;gap:8px;margin-bottom:0}#email-slide-in-input{flex:1;padding:10px 14px;font-size:15px;border-radius:5px;border:1px solid #d1d5db;background:#ffffff;color:#15171A;font-family:inherit}#email-slide-in-input:focus{outline:none;border-color:#92ACB9}#email-slide-in-submit{padding:10px 20px;background:#182029;color:#ffffff;text-decoration:none;border-radius:5px;font-size:15px;font-weight:500;cursor:pointer;border:none;transition:background-color 0.2s;white-space:nowrap}#email-slide-in-submit:hover:not(:disabled){background-color:#1f2934}#email-slide-in-submit:disabled{opacity:0.6;cursor:not-allowed}#email-slide-in-message{margin-top:12px;font-size:14px;text-align:center;display:none}#email-slide-in-message.success{color:#059669;display:block}#email-slide-in-message.error{color:#dc2626;display:block}#email-slide-in-close{position:absolute;top:12px;right:12px;background:none;border:none;font-size:24px;cursor:pointer;opacity:0.5;transition:opacity 0.2s;color:#15171A;padding:4px 8px;line-height:1}#email-slide-in-close:hover{opacity:1}

/* === GALLERY OVERLAY CSS (moved from Site Footer, Block 5) === */
#aa-gallery-overlay{position:fixed;inset:0;z-index:999998;display:none;background:rgba(255,255,255,0.9);opacity:0;transition:opacity 200ms ease;outline:none}#aa-gallery-overlay.is-open{display:block}#aa-gallery-overlay.is-visible{opacity:1}#aa-gallery-stage{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}#aa-gallery-img{max-width:90vw;max-height:90vh;object-fit:contain;opacity:0;transition:opacity 200ms ease;pointer-events:auto;display:block}#aa-gallery-img.is-visible{opacity:1}#aa-gallery-close{position:absolute;top:16px;right:16px;font-size:24px;line-height:24px;cursor:pointer;user-select:none;pointer-events:auto;color:#111}
@media (prefers-color-scheme:dark){#aa-gallery-overlay{background:rgba(0,0,0,0.9)}#aa-gallery-close{color:#fff}}

/* === SEARCH KEYBOARD NAV CSS (moved from Site Footer, Block 6) === */
#search-results a.global-underline{display:inline-block;background:none !important;transition:none !important;text-decoration:none;color:inherit}#search-results[data-input-mode="mouse"] a.global-underline:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px;text-decoration-color:var(--ghost-accent-color,currentColor)}#search-results .aa-active-link.global-underline{text-decoration:underline !important;text-underline-offset:3px;text-decoration-thickness:2px;text-decoration-color:var(--ghost-accent-color,currentColor);font-weight:600;color:inherit}#search-results a:focus{outline:none}

/* === SEARCH SCROLL INDICATOR CSS (moved from Site Footer, Block 8) === */

@media (min-width:769px){.search-scroll-indicator{position:fixed;pointer-events:none;opacity:0;transition:opacity 0.3s ease;z-index:1000}.search-scroll-indicator.is-visible{opacity:1}.search-scroll-indicator svg polyline{stroke:#92ACB9}@keyframes search-bounce-down{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}.search-scroll-indicator svg{animation:search-bounce-down 1.2s ease-in-out infinite}}
@media (max-width:768px){.search-scroll-indicator{display:none !important}}

/* ==========================================================================
   Subscribe CTA — image + separated bar
   Overrides screen.css subscribe styles (.subscribe-section through .subscribe-cover)
   ========================================================================== */

/* --- Reset old screen.css subscribe styles --- */
.subscribe-header,
.subscribe-claim,
.subscribe-cover {
   display: none !important;
}

/* --- Container --- */
.subscribe-section {
   margin-top: 7vh;
}

.subscribe-wrap {
   position: relative;
   overflow: hidden;
   border-radius: var(--border-radius) var(--border-radius) 0 0;
}

/* --- Background image --- */
.subscribe-bg {
   display: block;
   width: 100%;
   aspect-ratio: 21 / 9;
   max-height: 550px;
   object-fit: cover;
   object-position: center 15%;
}

@keyframes subscribe-glow {
   0%, 100% { box-shadow: 0 0 0 0 rgba(146, 172, 185, 0); }
   50% { box-shadow: 0 0 18px 2px rgba(146, 172, 185, 0.12); }
}

/* --- Bar --- */
.subscribe-bar {
   margin-top: 8px;
   background: #1f2934;
   border: 1px solid rgba(146, 172, 185, 0.35);
   border-radius: 0 0 var(--border-radius) var(--border-radius);
   padding: 18px 32px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 20px;
   box-sizing: border-box;
   animation: subscribe-glow 3.5s ease-in-out infinite;
}

/* --- Headline --- */
.subscribe-bar-headline {
   font-size: 16px;
   font-weight: var(--font-weight-primary-regular);
   color: #92ACB9;
   margin: 0;
   white-space: nowrap;
   line-height: 1.3;
}

/* Member headline: show desktop, hide mobile by default */
.subscribe-member-desktop {
   display: inline;
}
.subscribe-member-mobile {
   display: none;
}

/* --- Subscribe form (visitor) --- */
.subscribe-bar .subscribe-form {
   position: relative;
   display: flex;
   flex: 0 0 auto;
   height: auto;
   gap: 3px;
}

.subscribe-bar .subscribe-form input {
   font-family: var(--font-family-primary);
   font-size: 14px;
   font-weight: var(--font-weight-primary-regular);
   width: 180px;
   padding: 11px 18px;
   background: rgba(31, 41, 52, 0.9);
   color: #fff;
   border: 1px solid rgba(146, 172, 185, 0.4);
   border-radius: 8px 0 0 8px;
   outline: none;
   box-sizing: border-box;
   transition: border-color 0.2s ease;
}

.subscribe-bar .subscribe-form input::placeholder {
   color: rgba(255, 255, 255, 0.5);
}

.subscribe-bar .subscribe-form input:focus {
   width: 200px;
   border-color: rgba(146, 172, 185, 0.4);
}

.subscribe-bar .subscribe-form button {
   font-family: var(--font-family-primary);
   font-size: 14px;
   font-weight: 500;
   padding: 11px 20px;
   background: #92ACB9;
   color: #182029;
   border: none;
   border-radius: 0 8px 8px 0;
   cursor: pointer;
   transition: background-color 0.2s ease;
   white-space: nowrap;
   box-shadow: none;
}

.subscribe-bar .subscribe-form button:hover {
   background: #a3bcc8;
   color: #182029;
}

/* --- Form alerts --- */
.subscribe-bar .subscribe-form small {
   display: none;
}

.subscribe-bar .subscribe-form.loading .alert-loading,
.subscribe-bar .subscribe-form.success .alert-success,
.subscribe-bar .subscribe-form.error .alert-error {
   font-size: 10px;
   font-weight: var(--font-weight-secondary-bolder);
   position: absolute;
   right: 0;
   bottom: -28px;
   display: block;
   width: 100%;
   margin: 0;
   padding: 0;
   text-align: right;
   letter-spacing: 1.2px;
   text-transform: uppercase;
   color: #92ACB9;
}

/* --- Support button (member) --- */
.subscribe-bar-btn {
   font-family: var(--font-family-primary);
   font-size: 14px;
   font-weight: 500;
   padding: 11px 20px;
   background: #92ACB9;
   color: #182029;
   border: none;
   border-radius: 8px;
   cursor: pointer;
   text-decoration: none;
   white-space: nowrap;
   transition: background-color 0.2s ease;
   flex-shrink: 0;
}

.subscribe-bar-btn:hover {
   background: #a3bcc8;
   color: #182029;
}

/* --- Mobile: 768px and below --- */
@media (max-width: 768px) {
   .subscribe-bg {
      aspect-ratio: 3 / 2;
      max-height: none;
      object-position: center 35%;
   }

   .subscribe-bar {
      padding: 16px 18px;
      flex-wrap: wrap;
   }

   /* Visitor: stack headline above form */
   .subscribe-bar-headline {
      font-size: 15px;
      width: 100%;
      white-space: normal;
   }

   /* Member: inline layout */
   .subscribe-bar-headline-member {
      width: auto;
      flex: 1;
      min-width: 0;
      font-size: 13px;
   }

   .subscribe-member-desktop {
      display: none;
   }
   .subscribe-member-mobile {
      display: inline;
   }

   .subscribe-bar .subscribe-form {
      width: 100%;
   }

   .subscribe-bar .subscribe-form input {
      flex: 1;
      width: auto;
      font-size: 13px;
      padding: 10px 14px;
      border-radius: 6px 0 0 6px;
   }

   .subscribe-bar .subscribe-form input:focus {
      width: auto;
   }

   .subscribe-bar .subscribe-form button {
      font-size: 13px;
      padding: 10px 16px;
      border-radius: 0 6px 6px 0;
   }

   .subscribe-bar-btn {
      font-size: 13px;
      padding: 10px 16px;
      border-radius: 6px;
   }

   .subscribe-bar .subscribe-form.loading .alert-loading,
   .subscribe-bar .subscribe-form.success .alert-success,
   .subscribe-bar .subscribe-form.error .alert-error {
      text-align: center;
      bottom: -26px;
   }
}

/* --- Tablet: 481px to 768px --- */
@media (min-width: 481px) and (max-width: 768px) {
   .subscribe-bar .subscribe-form input {
      font-size: 14px;
      padding: 11px 16px;
   }

   .subscribe-bar .subscribe-form button {
      font-size: 14px;
      padding: 11px 18px;
   }
}

/* --- Light mode overrides --- */
@media (prefers-color-scheme: light) {
   @keyframes subscribe-glow {
      0%, 100% { box-shadow: 0 0 0 0 rgba(31, 41, 52, 0); }
      50% { box-shadow: 0 0 18px 2px rgba(31, 41, 52, 0.12); }
   }

   .subscribe-bar {
      background: #f1f1f2;
      border-color: rgba(31, 41, 52, 0.12);
   }

   .subscribe-bar-headline {
      color: #1f2934;
   }

   .subscribe-bar .subscribe-form input {
      background: #ffffff;
      color: #1f2934;
      border-color: rgba(31, 41, 52, 0.22);
   }

   .subscribe-bar .subscribe-form input::placeholder {
      color: rgba(31, 41, 52, 0.45);
   }

   .subscribe-bar .subscribe-form input:focus {
      border-color: rgba(31, 41, 52, 0.35);
   }

   .subscribe-bar .subscribe-form button,
   .subscribe-bar-btn {
      color: #f1f1f2;
   }

   .subscribe-bar .subscribe-form button:hover,
   .subscribe-bar-btn:hover {
      color: #f1f1f2;
   }
}

/* --- Small phones: 375px and below --- */
@media (max-width: 375px) {
   .subscribe-bar {
      padding: 14px 14px;
   }

   .subscribe-bar-headline {
      font-size: 14px;
   }

   .subscribe-bar .subscribe-form input {
      font-size: 12px;
      padding: 9px 12px;
   }

   .subscribe-bar .subscribe-form button {
      font-size: 12px;
      padding: 9px 14px;
   }
}


/* Supporters page — desktop spacing, isolated from other static pages */
@media (min-width:769px) {
   body.page-supporters .pm-page-bar {
      margin-bottom: 48px;
   }
   body.page-supporters .global-main {
      margin-bottom: 80px;
   }
}

/* Static pages — desktop spacing (header-to-content, content-to-footer) */
@media (min-width:769px) {
   body.page-template .post-section {
      padding-bottom: 0;
   }
   body.page-template .global-main {
      margin-bottom: 80px;
   }
   body.page-template .page-content-layout {
      padding-top: 24px;
      padding-bottom: 60px;
   }
   /* Zero out first/last child margins so spacing is
      consistent regardless of content type */
   body.page-template .post-content > *:first-child {
      margin-top: 0 !important;
   }
   body.page-template .post-content > *:last-child {
      margin-bottom: 0 !important;
   }
   /* Kill screen.css's 15vh bottom margin on the container itself */
   body.page-template .post-content {
      margin-bottom: 0 !important;
   }
}

/* === POST TAG PILLS — enforce pill shape on all desktop widths === */
/* screen.css gates border-radius and margin behind max-width:1440px,
   causing tags to merge on monitors wider than 1440px. Override here
   so pills render correctly at any desktop resolution.               */
.post-header .post-tags a {
   margin: 0 5px 5px 0;
   border-radius: var(--border-radius-big);
}

/* === TAG PAGE — growing placeholder card === */
.tag-loop-placeholder {
   border: 1.5px dashed rgba(0,0,0,0.15);
   border-radius: var(--border-radius-big);
   background: rgba(0,0,0,0.03);
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 12px;
   padding: 20px;
   box-sizing: border-box;
   margin: 0 calc(var(--margin-items) / 2) var(--margin-items);
   flex-grow: 0;
   flex-shrink: 0;
}
.tag-loop-placeholder.ph-span-3 { flex-basis: calc(75% - var(--margin-items)); }
.tag-loop-placeholder.ph-span-2 { flex-basis: calc(50% - var(--margin-items)); }
.tag-loop-placeholder.ph-span-1 { flex-basis: calc(25% - var(--margin-items)); }
.tag-loop-placeholder .ph-dots {
   display: flex;
   gap: 7px;
   align-items: center;
}
.tag-loop-placeholder .ph-dot {
   width: 7px;
   height: 7px;
   border-radius: 50%;
   background: rgba(0,0,0,0.25);
   animation: pmDotPulse 1.4s ease-in-out infinite;
}
.tag-loop-placeholder .ph-dot:nth-child(2) { animation-delay: 0.2s; }
.tag-loop-placeholder .ph-dot:nth-child(3) { animation-delay: 0.4s; }
@keyframes pmDotPulse {
   0%, 80%, 100% { opacity: 0.2; transform: scale(0.8); }
   40% { opacity: 1; transform: scale(1); }
}
.tag-loop-placeholder .ph-text {
   font-family: 'alata', sans-serif;
   font-size: 18px;
   color: rgba(0,0,0,0.35);
   text-align: center;
   letter-spacing: 0.01em;
}
.tag-loop-placeholder.ph-span-1 .ph-text { display: none; }
@media (prefers-color-scheme: dark) {
   .tag-loop-placeholder {
      background: #212933;
      border-color: rgba(146,172,185,0.3);
   }
   .tag-loop-placeholder .ph-dot {
      background: #92ACB9;
   }
   .tag-loop-placeholder .ph-text {
      color: #92ACB9;
   }
}
@media (max-width: 480px) {
   .tag-loop-placeholder { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
   .tag-loop-placeholder.ph-span-3 { flex-basis: calc(50% - var(--margin-items)); }
   .tag-loop-placeholder.ph-span-2 { display: none; }
   .tag-loop-placeholder.ph-span-1 { display: none; }
}
@media (min-width: 769px) and (max-width: 1024px) {
   .tag-loop-placeholder.ph-span-3 { flex-basis: calc(66.666% - var(--margin-items)); }
   .tag-loop-placeholder.ph-span-2 { flex-basis: calc(33.333% - var(--margin-items)); }
   .tag-loop-placeholder.ph-span-1 { display: none; }
}

/* === MOBILE FOOTER ACCORDION === */
@media (max-width:768px) {
   /* Hide description on mobile */
   .footer-description { display:none !important; }

   /* Hide the static column grid; accordion takes over */
   .footer-nav { display:block !important; }
   .footer-nav-column { display:none !important; }

   /* Accordion wrapper injected by JS */
   .footer-acc { margin-top:0; }

   /* Each row */
   .footer-acc-item {
      border-top:0.5px solid rgba(146,172,185,0.2);
   }
   .footer-acc-item:last-child {
      border-bottom:0.5px solid rgba(146,172,185,0.2);
   }

   /* Header button */
   .footer-acc-header {
      display:flex;
      align-items:center;
      justify-content:space-between;
      width:100%;
      padding:18px 0;
      background:none;
      border:none;
      cursor:pointer;
      text-align:left;
      -webkit-tap-highlight-color:transparent;
   }
   .footer-acc-label {
      font-family:var(--font-family-secondary);
      font-size:17px;
      font-weight:var(--font-weight-secondary-bolder);
      color:var(--color-font-one);
      letter-spacing:0.2px;
   }
   .footer-acc-chevron {
      flex-shrink:0;
      width:20px;
      height:20px;
      display:flex;
      align-items:center;
      justify-content:center;
   }
   .footer-acc-chevron svg {
      width:14px;
      height:14px;
      stroke:var(--ghost-accent-color);
      fill:none;
      stroke-width:1.5;
      stroke-linecap:round;
      stroke-linejoin:round;
      transition:transform 0.2s ease;
      transform-origin:center center;
   }
   .footer-acc-item.is-open .footer-acc-chevron svg {
      transform:rotate(180deg);
   }

   /* Logo size — larger relative to accordion text */
   .footer-logo img {
      max-height:52px !important;
   }

   /* Collapsible body */
   .footer-acc-body {
      overflow:hidden;
      max-height:0;
      transition:max-height 0.25s ease;
   }
   .footer-acc-item.is-open .footer-acc-body {
      max-height:400px;
   }
   .footer-acc-links {
      display:flex;
      flex-direction:column;
      padding-bottom:20px;
   }
   .footer-acc-links a {
      font-family:'Alata', sans-serif;
      font-size:15px;
      font-weight:400;
      color:var(--color-font-two);
      padding:9px 0;
      text-decoration:none;
      letter-spacing:0.2px;
   }
   .footer-acc-links a:hover {
      color:var(--color-font-one);
   }
}
/* Contact page — mobile card container (Option A)
   -------------------------------------------------- */
@media (max-width: 1024px) {
   .custom-contact .custom-content form {
      background: var(--color-one);
      border-radius: 14px;
      border: 1px solid var(--color-six);
      padding: 20px 18px 22px;
      max-width: 480px;
   }

   .custom-contact .custom-content h3 {
      margin-bottom: 4px;
   }

   .custom-contact input {
      background: var(--color-body);
      border-radius: 8px;
      border: 1px solid var(--color-six) !important;
      padding: 10px 12px !important;
      text-align: left;
   }

   .custom-contact input:focus {
      border-color: var(--ghost-accent-color) !important;
      outline: none;
   }

   /* Hide underline spans inside the card — border replaces them */
   .custom-contact input + span {
      display: none !important;
   }

   .custom-contact input + input {
      margin-top: 10px;
   }

   .custom-contact textarea {
      width: 100%;
      background: var(--color-body);
      border-radius: 8px;
      border: 1px solid var(--color-six) !important;
      margin: 10px auto 16px;
      padding: 10px 12px;
      text-align: left;
      box-sizing: border-box;
   }

   .custom-contact textarea:focus {
      border-color: var(--ghost-accent-color) !important;
   }

   .custom-contact .global-button {
      width: 100%;
      box-sizing: border-box;
   }
}



/* === PAGE ICON BAR (all viewports) === */
.pm-page-bar{display:flex;align-items:center;justify-content:space-between;background:var(--color-two);border:1px solid rgba(146,172,185,0.2);border-radius:var(--border-radius);padding:16px 20px;margin:0 0 28px}
.pm-page-bar-name{font-family:var(--font-family-primary);font-size:22px;font-weight:var(--font-weight-primary-regular);color:var(--color-font-one);line-height:1.2}
.pm-page-bar-icon{width:42px;height:42px;border-radius:8px;background:#92ACB9;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pm-page-bar-icon svg{width:18px;height:18px;stroke:#182029;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* Manifesto: icon bar mobile-only (desktop keeps image banner) */
.pm-page-bar-mobile-only{display:none}
@media (max-width:768px){
  .pm-page-bar{padding:12px 14px;margin:0 0 var(--margin-items)}
  .pm-page-bar-name{font-size:18px}
  .pm-page-bar-icon{width:36px;height:36px}
  .pm-page-bar-icon svg{width:16px;height:16px}
  .pm-page-bar-mobile-only{display:flex}
}

/* Mobile updated date pill (Manifesto, Privacy, Terms) */
.page-updated-mobile{display:none}
@media (max-width:768px){
  .page-updated-mobile{display:block;margin-top:24px;padding-top:16px;border-top:1px solid var(--color-three)}
  .page-updated-pill{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--color-font-two);background:var(--color-two);border:1px solid var(--color-three);border-radius:20px;padding:3px 10px}
  .page-updated-dot{width:5px;height:5px;border-radius:50%;background:var(--ghost-accent-color);flex-shrink:0}
}

/* ==========================================================================
   POST HEADER — Visual reorder + 3:4 feature image
   Works WITH screen.css flex layout — uses order to swap sides.
   HTML order stays: image first, title second (same as screen.css expects).
   Desktop only — mobile retains default stacked behavior.
   ========================================================================== */

@media (min-width:769px) {

   /* Keep the existing flex from screen.css, just swap visual order */
   .post-header.is-image {
      min-height: auto;
   }

   .post-header .post-image {
      order: 2;
      flex: 1 0 50%;
      min-height: auto;
      height: auto;
      position: relative;
      padding: 24px 0 24px 12px;
      box-sizing: border-box;
   }

   .post-header .post-image img {
      position: relative;
      top: auto;
      right: auto;
      bottom: auto;
      left: auto;
      width: 100%;
      height: auto;
      aspect-ratio: 3 / 4;
      object-fit: cover;
      border-radius: var(--border-radius);
      max-height: 72vh;
   }

   .post-header .post-image-caption {
      position: relative;
      bottom: auto;
      left: auto;
      display: block;
      text-align: left;
      margin-top: 8px;
   }

   .post-title-wrap.is-image {
      order: 1;
      flex: 1 0 50%;
      padding: 4vh 40px 4vh 0;
      box-sizing: border-box;
   }

   .post-title-content {
      width: 100%;
      margin: 0;
   }

   /* --- Title: two-line split via JS --- */
   .post-title .pm-title-model,
   .post-title .pm-title-photog {
      display: block;
      white-space: nowrap;
   }

   /* --- Tags: uppercase micro, slash separated (style B) --- */
   .post-header .post-tags {
      margin-top: 12px;
      margin-bottom: 3vh;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0;
   }

   .post-header .post-tags a {
      margin: 0;
      padding: 0;
      border-radius: 0;
      background: none;
      color: var(--ghost-accent-color);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      border: none;
      border-bottom: none;
      transition: color 0.15s ease;
   }

   .post-header .post-tags a:hover {
      color: var(--color-font-one);
   }

   /* Slash separators between tags (CSS-only) */
   .post-header .post-tags a + a::before {
      content: '/';
      display: inline-block;
      margin: 0 8px;
      color: rgba(146, 172, 185, 0.2);
      font-size: 11px;
      font-weight: 400;
      letter-spacing: 0;
      text-transform: none;
      pointer-events: none;
   }

   /* --- Excerpt --- */
   .post-header .post-excerpt {
      max-width: 480px;
   }

   /* --- Share icons: circular, in header --- */
   .post-title-content .post-share-section {
      padding-top: 2vh;
   }

   .post-title-content .post-share-wrap {
      display: inline-flex;
      width: auto;
   }

   .post-title-content .post-share-wrap a {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      background-color: var(--color-one);
      margin: 0 3px;
      transition: background-color 0.15s ease;
   }

   .post-title-content .post-share-wrap a:first-of-type {
      border-radius: 50%;
   }

   .post-title-content .post-share-wrap a:last-of-type {
      border-radius: 50%;
   }

   /* Share hover: accent bg, dark icon */
   .post-title-content .post-share-wrap a:hover {
      background-color: var(--ghost-accent-color);
   }

   .post-title-content .post-share-wrap svg {
      width: 16px;
      height: 16px;
      fill: var(--color-font-one);
      transition: fill 0.15s ease;
   }

   .post-title-content .post-share-wrap a:hover svg {
      fill: var(--color-body);
   }

   /* --- Post header: no bottom margin, divider handled by JS below fold --- */
   .post-header {
      margin-bottom: 0;
   }

   /* Divider element (injected by JS at the fold) */
   .pm-post-divider {
      border: none;
      height: 1px;
      background: linear-gradient(90deg, transparent 0%, rgba(146,172,185,0.3) 30%, rgba(146,172,185,0.3) 70%, transparent 100%);
      margin: 0;
      padding: 0;
   }

   /* Space between divider and body content — post pages only */
   body.post-template .post-content {
      padding-top: 8vh;
   }

} /* end @media min-width:769px */

/* --- Body content: more bottom padding before "you might also like" — post pages only --- */
body.post-template .post-content {
   margin-bottom: 18vh !important;
}

/* --- RWD: Tablet (769–1024) — viewport-filling hero, mirrors mobile/PWA --- */
@media (min-width:769px) and (max-width:1024px) {

   /* Container: flex column, exactly fills remaining viewport */
   body.post-template .post-header.is-image {
      display: flex;
      flex-direction: column;
      height: calc(100dvh - var(--pm-header-h, 100px) - env(safe-area-inset-top, 0px));
      min-height: 0;
      overflow: hidden;
      margin-bottom: 0;
      flex-wrap: nowrap;
   }

   /* Image: grows to fill all remaining space */
   body.post-template .post-header .post-image {
      order: 1;
      flex: 1 1 0%;
      min-height: 0;
      height: auto;
      position: relative;
      flex-basis: auto;
      padding: 0;
   }

   body.post-template .post-header .post-image img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 0;
   }

   body.post-template .post-header .post-image-caption {
      display: none;
   }

   /* Title wrap: fixed-height block pinned below image */
   body.post-template .post-title-wrap.is-image {
      order: 2;
      flex: 0 0 auto;
      padding: 0;
      margin: 0;
      width: 100%;
      max-width: 100%;
      box-sizing: border-box;
      align-items: stretch;
   }

   /* Text block: centered column */
   body.post-template .post-title-content {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 10px;
      padding: 22px 24px 26px;
      margin: 0;
      width: 100%;
      box-sizing: border-box;
   }

   /* Reorder children */
   body.post-template .post-title-content .post-tags          { order: 1; }
   body.post-template .post-title-content .post-title         { order: 2; }
   body.post-template .post-title-content .global-meta        { order: 3; }
   body.post-template .post-title-content .post-excerpt       { order: 4; }
   body.post-template .post-title-content .post-share-section { order: 5; }

   /* Tags: centered */
   body.post-template .post-header .post-tags {
      margin: 0;
      display: flex;
      flex-wrap: nowrap;
      align-items: center;
      justify-content: center;
      gap: 0;
      overflow: hidden;
   }

   /* Title */
   body.post-template .post-header .post-title {
      font-size: 34px;
      margin: 0;
      line-height: 1.15;
   }

   /* Meta */
   body.post-template .post-title-content .global-meta {
      margin: 0;
      font-size: 13px;
      opacity: 0.55;
   }

   /* Excerpt: hidden on tablet */
   body.post-template .post-header .post-excerpt {
      display: none;
   }

   /* Share icons: centered row */
   body.post-template .post-title-content .post-share-section {
      padding: 0;
      width: auto;
   }

   body.post-template .post-title-content .post-share-wrap {
      display: inline-flex;
      justify-content: center;
      width: auto;
      gap: 6px;
   }

   body.post-template .post-title-content .post-share-wrap a {
      width: 36px;
      height: 36px;
      border-radius: 50%;
      background-color: var(--color-one);
      margin: 0;
   }

   body.post-template .post-title-content .post-share-wrap a:first-of-type,
   body.post-template .post-title-content .post-share-wrap a:last-of-type {
      border-radius: 50%;
   }

   body.post-template .post-title-content .post-share-wrap svg {
      width: 15px;
      height: 15px;
   }

   /* Kill hover on share buttons — touch devices */
   body.post-template .post-title-content .post-share-wrap a:hover {
      background-color: var(--color-one);
   }

   body.post-template .post-title-content .post-share-wrap a:hover svg {
      fill: var(--color-font-one);
   }

   body.post-template .post-title-content .post-share-wrap a:active {
      background-color: var(--ghost-accent-color);
   }

   body.post-template .post-title-content .post-share-wrap a:active svg {
      fill: var(--color-body);
   }

   /* Post content spacing below fold */
   body.post-template .post-content {
      padding-top: 5vh;
   }

}

/* --- RWD: Large desktop (1281+) --- */
@media (min-width:1281px) {
   .post-title-wrap.is-image {
      padding-right: 60px;
   }
}

/* ==========================================================================
   MOBILE POST HERO — 100dvh viewport-filling header (centered variant A)
   Requires tiny JS in custom.js to set --pm-header-h CSS variable.
   ========================================================================== */

@media (max-width:768px) {

   /* --- Container: flex column, exactly fills remaining viewport --- */
   body.post-template .post-header.is-image {
      display: flex;
      flex-direction: column;
      height: calc(100dvh - var(--pm-header-h, 100px) - env(safe-area-inset-top, 0px));
      min-height: 0;
      overflow: hidden;
      margin-bottom: 0;
      flex-wrap: nowrap;
   }

   /* --- Feature image: grows to fill all remaining space --- */
   body.post-template .post-header .post-image {
      order: 1;
      flex: 1 1 0%;
      min-height: 0;
      height: auto;
      position: relative;
      flex-basis: auto;
   }

   body.post-template .post-header .post-image img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 0;
   }

   body.post-template .post-header .post-image-caption {
      display: none;
   }

   /* --- Title wrap: fixed-height block pinned below image --- */
   body.post-template .post-title-wrap.is-image {
      order: 2;
      flex: 0 0 auto;
      padding: 0;
      margin: 0;
      width: 100%;
      box-sizing: border-box;
      align-items: stretch;
   }

   /* --- Text block: centered column --- */
   body.post-template .post-title-content {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 8px;
      padding: 18px 16px 20px;
      margin: 0;
      width: 100%;
      box-sizing: border-box;
   }

   /* --- Reorder children within .post-title-content --- */
   body.post-template .post-title-content .post-tags      { order: 1; }
   body.post-template .post-title-content .pm-tags-fade    { order: 1; }
   body.post-template .post-title-content .post-title      { order: 2; }
   body.post-template .post-title-content .global-meta     { order: 3; }
   body.post-template .post-title-content .post-excerpt    { order: 4; }
   body.post-template .post-title-content .post-share-section { order: 5; }

   /* --- Tags: centered flex by default; JS wraps in .pm-tags-fade only on overflow --- */
   body.post-template .post-header .post-tags {
      margin: 0;
      display: flex;
      flex-wrap: nowrap;
      align-items: center;
      justify-content: center;
      gap: 0;
      overflow: hidden;
   }

   /* Wrapper only exists when tags overflow (injected by JS) */
   body.post-template .post-title-content .pm-tags-fade {
      position: relative;
      display: flex;
      align-items: center;
      width: calc(100% + 32px);
      margin-left: -16px;
      overflow-x: auto;
      overflow-y: hidden;
      scrollbar-width: none;
      -webkit-overflow-scrolling: touch;
      -ms-overflow-style: none;
   }

   body.post-template .post-title-content .pm-tags-fade::-webkit-scrollbar {
      display: none;
   }

   /* Inside the wrapper, tags become inline-flex (no centering, natural width) */
   body.post-template .pm-tags-fade .post-tags {
      display: inline-flex;
      justify-content: flex-start;
      overflow: visible;
      padding: 0 16px;
   }

   /* Left fade (hidden at start, shown once scrolled) */
   body.post-template .post-title-content .pm-tags-fade::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      width: 24px;
      background: linear-gradient(90deg, var(--color-body) 0%, transparent 100%);
      z-index: 2;
      pointer-events: none;
      opacity: 0;
      transition: opacity 0.2s ease;
   }

   body.post-template .post-title-content .pm-tags-fade.is-scrolled-start::before {
      opacity: 1;
   }

   /* Right fade (shown by default, hidden at end) */
   body.post-template .post-title-content .pm-tags-fade::after {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      width: 24px;
      background: linear-gradient(270deg, var(--color-body) 0%, transparent 100%);
      z-index: 2;
      pointer-events: none;
      transition: opacity 0.2s ease;
   }

   body.post-template .post-title-content .pm-tags-fade.is-scrolled-end::after {
      opacity: 0;
   }

   body.post-template .post-header .post-tags a {
      margin: 0;
      padding: 0;
      border-radius: 0;
      background: none;
      border: none;
      color: var(--ghost-accent-color);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      white-space: nowrap;
      flex-shrink: 0;
   }

   body.post-template .post-header .post-tags a + a::before {
      content: '/';
      display: inline-block;
      margin: 0 7px;
      color: rgba(146, 172, 185, 0.25);
      font-size: 10px;
      font-weight: 400;
      letter-spacing: 0;
      text-transform: none;
      pointer-events: none;
   }

   /* --- Title: two equal lines, centered --- */
   body.post-template .post-header .post-title {
      font-size: 28px;
      margin: 0;
      line-height: 1.12;
   }

   body.post-template .post-title .pm-title-model,
   body.post-template .post-title .pm-title-photog {
      display: block;
      white-space: nowrap;
      font-size: inherit;
      font-weight: inherit;
      color: inherit;
   }

   /* --- Meta: date · author · read time --- */
   body.post-template .post-title-content .global-meta {
      margin: 0;
      font-size: 12px;
      opacity: 0.55;
   }

   /* --- Excerpt: hidden on mobile; freed space goes to info block padding --- */
   body.post-template .post-header .post-excerpt {
      display: none;
   }

   /* --- Share buttons: circular, centered row --- */
   body.post-template .post-title-content .post-share-section {
      padding: 0;
      width: auto;
   }

   body.post-template .post-title-content .post-share-wrap {
      display: inline-flex;
      justify-content: center;
      width: auto;
      gap: 6px;
   }

   body.post-template .post-title-content .post-share-wrap a {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background-color: var(--color-one);
      margin: 0;
   }

   body.post-template .post-title-content .post-share-wrap a:first-of-type {
      border-radius: 50%;
   }

   body.post-template .post-title-content .post-share-wrap a:last-of-type {
      border-radius: 50%;
   }

   body.post-template .post-title-content .post-share-wrap svg {
      width: 14px;
      height: 14px;
   }

   /* Kill hover on all share buttons — mobile Safari sticky hover fix */
   body.post-template .post-title-content .post-share-wrap a:hover {
      background-color: var(--color-one);
   }

   body.post-template .post-title-content .post-share-wrap a:hover svg {
      fill: var(--color-font-one);
   }

   /* All share buttons: active flash on tap */
   body.post-template .post-title-content .post-share-wrap a:active {
      background-color: var(--ghost-accent-color);
   }

   body.post-template .post-title-content .post-share-wrap a:active svg {
      fill: var(--color-body);
   }

   /* --- Post content: breathing room below fold --- */
   body.post-template .post-content {
      padding-top: 4vh;
   }

} /* end @media max-width:768px — mobile post hero */

/* --------------------------------------------------------------------------
   Membership tiers — description line-height
   -------------------------------------------------------------------------- */
.membership-card-description {
   line-height: 1.4;
}

/* --------------------------------------------------------------------------
   Membership tiers — benefit list checkmarks
   Replicates Ghost Portal's checkmark styling for logged-in members,
   who see the raw theme template rather than the Portal iframe overlay.
   -------------------------------------------------------------------------- */
.membership-card-options ul li {
   position: relative;
   padding-left: 1.6em;
   text-align: left;
}

.membership-card-options ul li::before {
   content: "";
   position: absolute;
   left: 0;
   top: 0.35em;
   width: 5px;
   height: 9px;
   border-right: 1.5px solid #92ACB9;
   border-bottom: 1.5px solid #92ACB9;
   transform: rotate(45deg);
}

/* Loop card feature images — portrait aspect ratio on mobile + iPad mini
   Scoped to homepage, archive, and featured pages only */
@media (max-width:768px) {
   .pm-home .loop-item-image,
   .pm-archive .loop-item-image,
   .pm-featured .loop-item-image,
   .pm-author .loop-item-image,
   body.tag-template .loop-item-image {
      aspect-ratio: 4 / 5;
      height: auto;
      min-height: 0;
      max-height: none;
   }
}

@media (min-width:769px) and (max-width:1024px) {
   .pm-home .loop-item-image,
   .pm-archive .loop-item-image,
   .pm-featured .loop-item-image,
   .pm-author .loop-item-image,
   body.tag-template .loop-item-image {
      aspect-ratio: 4 / 5;
      height: auto;
      min-height: 0;
      max-height: none;
   }
}

/* ==========================================================================
   Latest badge — flame glyph on homepage hero (post #1, initial load only)
   True bookend mirror of the Portraits pill on the opposite side.
   Uses the same padding system as .global-tags a so the badge height
   automatically matches the pill height at every breakpoint:
     desktop: 15px padding × 13px icon = 43px tall
     ≤480px:  10px padding × 12px icon = 32px tall
   The :first-child selector ensures the badge only shows on the original
   page 1 hero, never on Load More appended heroes.
   ========================================================================== */
.loop-wrap > .loop-item:first-child .loop-item-latest {
   position: absolute;
   right: 25px;
   bottom: 25px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   padding: 15px;
   line-height: 1;
   box-sizing: content-box;
   background: #C9A96E;
   color: #2a1d0a;
   border-radius: var(--border-radius-big);
   z-index: 2;
   pointer-events: none;
}

.loop-item-latest-icon {
   width: 13px;
   height: 13px;
   display: block;
   animation: pmFlameColorFlicker 1.8s ease-in-out infinite;
}

/* Match the .loop-item-tags a margin override at this breakpoint */
@media (max-width: 1280px) {
   .loop-wrap > .loop-item:first-child .loop-item-latest {
      right: 15px;
      bottom: 15px;
   }
}

/* Match the .global-tags a padding override at this breakpoint */
@media (max-width: 480px) {
   .loop-wrap > .loop-item:first-child .loop-item-latest {
      padding: 10px;
   }
   .loop-item-latest-icon {
      width: 12px;
      height: 12px;
   }
}

.loop-wrap > .loop-item:not(:first-child) .loop-item-latest {
   display: none;
}

@keyframes pmFlameColorFlicker {
   0%, 100% { color: #2a1d0a; }
   20%      { color: #4a2a08; }
   40%      { color: #2a1d0a; }
   60%      { color: #5a3508; }
   80%      { color: #2a1d0a; }
}

@media (prefers-reduced-motion: reduce) {
   .loop-item-latest-icon {
      animation: none;
   }
}

/* ==========================================================================
   Hero treatment on tag and author pages
   Each batch's first post (initial load + every Load More) gets the same
   hero treatment as the homepage: spans 50% width on desktop, flex-grows to
   push the next 2 posts onto the same row. Math: 1 hero (2 cols) + 6 squares
   (4 cols + 2 cols) = exactly 2 rows of 4 column-units. No orphans.
   The .is-first class is added by both tag.hbs and loop.hbs (via @first),
   so this works for initial load AND for Load More appended batches.
   ========================================================================== */
body.tag-template .loop-wrap .loop-item.is-first.is-image,
body.author-template .loop-wrap .loop-item.is-first.is-image {
   flex-basis: calc(50% - var(--margin-items)) !important;
   flex-grow: 999 !important;
}

@media (max-width: 768px) {
   body.tag-template .loop-wrap .loop-item.is-first.is-image,
   body.author-template .loop-wrap .loop-item.is-first.is-image {
      flex-basis: calc(100% - var(--margin-items)) !important;
      flex-grow: 1 !important;
   }
}

/* When a placeholder card is present (posts < 4), suppress the hero treatment
   so the first post sits as a standard 25%-width card alongside the placeholder.
   Prevents the lone hero from stretching to 100% width on low-count tag pages. */
body.tag-template .loop-wrap:has(.tag-loop-placeholder) .loop-item.is-first.is-image {
   flex-basis: calc(25% - var(--margin-items)) !important;
   flex-grow: 0 !important;
}
@media (min-width: 769px) and (max-width: 1024px) {
   body.tag-template .loop-wrap:has(.tag-loop-placeholder) .loop-item.is-first.is-image {
      flex-basis: calc(33.333% - var(--margin-items)) !important;
   }
}
@media (min-width: 481px) and (max-width: 768px) {
   body.tag-template .loop-wrap:has(.tag-loop-placeholder) .loop-item.is-first.is-image {
      flex-basis: calc(50% - var(--margin-items)) !important;
      flex-grow: 0 !important;
   }
}
@media (max-width: 480px) {
   body.tag-template .loop-wrap:has(.tag-loop-placeholder) .loop-item.is-first.is-image {
      flex-basis: calc(100% - var(--margin-items)) !important;
      flex-grow: 0 !important;
   }
}

/* ─────────────────────────────────────────────────────────────
   POST ARTICLE BODY: JetBrains Mono
   Scopes mono font to the writeup area only (.post-content from post.hbs).
   Does NOT affect title, tags, meta, excerpt, share icons, related posts,
   homepage cards, tag pages, static pages, or any other site area.
   Headings inside posts remain in Alata for hierarchy contrast.
───────────────────────────────────────────────────────────── */
.post-content,
.post-content p,
.post-content li,
.post-content blockquote,
.post-content figcaption,
.post-content .kg-card figcaption {
   font-family: 'JetBrains Mono', monospace !important;
   font-size: 0.85em !important;
}

/* ─────────────────────────────────────────────────────────────
   SUPPORTERS PAGE BODY COPY: JetBrains Mono
   Mono treatment for the "Why this matters" paragraphs only.
   CTA block, headings, and supporter cards stay in their original fonts.
   Explicit size (not em) so mono visual weight stays proportional
   to surrounding chrome on this page.
───────────────────────────────────────────────────────────── */
.supporters-why p {
   font-family: 'JetBrains Mono', monospace !important;
   font-size: 13px !important;
}

/* ─────────────────────────────────────────────────────────────
   EXPOSURE MODAL: JetBrains Mono
   Body paragraphs + CTA lines in the 30-second first-visit modal.
   Modal HTML is generated by JS in Site Footer injection; CSS scopes
   here so all JetBrains Mono rules live in one file.
   Headline (.pm-exp-headline) stays in default heading font.
───────────────────────────────────────────────────────────── */
.pm-exp-body,
.pm-exp-cta {
   font-family: 'JetBrains Mono', monospace !important;
   font-size: 0.7em !important;
}