/* Elephant design reconstruction based on supplied Figma Make composition.
   Scoped overrides cancel legacy reader layout instead of layering incompatible grids.
   Preserves original reader block typography and both themes. */
.reader-shell{max-inline-size:1340px;width:calc(100% - 112px);padding-inline:0!important}
.editorial-breadcrumb{display:flex;gap:14px;align-items:center;padding:26px 0 0;font-size:11px;color:var(--muted)}
.editorial-breadcrumb span:last-child{color:var(--accent)}
.reader-intro{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(24px,6vw,85px);padding:48px 0 64px;border:none!important;min-block-size:0!important;align-items:center}
.reader-intro:after{display:none!important}
.reader-intro .intro-copy{min-inline-size:0}
.reader-intro h1{font-size:clamp(42px,5.5vw,78px);font-weight:600;line-height:1.35;color:var(--accent);margin:22px 0;letter-spacing:-1px;max-inline-size:none}
.reader-intro .eyebrow{font-size:11px}
.reader-intro .intro-deck{font-size:14px;line-height:2.15;max-inline-size:650px;color:var(--muted)}
.intro-action{display:inline-flex;align-items:center;color:var(--accent);font-size:12px;margin-top:22px;min-block-size:44px;gap:16px}
.intro-topics{display:flex;gap:18px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:24px;padding-top:17px;font-size:10px;color:var(--muted)}
.identity-panel{min-block-size:405px;background:var(--burgundy);border:1px solid var(--bronze);padding:25px;position:relative;color:#f5efe4;display:flex;flex-direction:column;overflow:hidden;isolation:isolate}
.identity-panel:before{content:"";position:absolute;inset:7px;border:1px solid #fff2;z-index:2;pointer-events:none}
.identity-panel .hero-photograph{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover;z-index:-2;filter:saturate(.6)}
.identity-panel:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#390d1dcc,#43192132 48%,#390d1def);z-index:-1}
.panel-head,.panel-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;position:relative}
.panel-head{font-size:10px;padding-bottom:12px;border-bottom:1px solid #fff5}
.panel-bottom{padding-top:15px;border-top:1px solid #fff5;font-size:11px}
.panel-bottom strong{color:#fff;font-weight:600}.panel-bottom p{line-height:1.9}.panel-cross{font-size:27px;color:#d8b27d}
.emblem-wrap{display:flex;align-items:flex-start;justify-content:flex-end;flex:1;padding:26px 0}
.hero-emblem{display:grid;place-items:center;inline-size:70px;block-size:80px;background:#740d32d9;border:1px solid #d8b17e9c}
.hero-emblem img{inline-size:48px;block-size:60px;object-fit:contain;filter:brightness(0) invert(1)}
.writing-section>.section-heading{padding-block:50px 17px}
.writing-section>.section-heading h2{font-size:clamp(24px,2.3vw,34px)}
.section-kicker{font-size:11px;color:var(--muted);display:flex;justify-content:space-between;gap:12px}
.featured-section{margin-block:0 40px}
.featured{position:relative;display:grid;grid-template-columns:minmax(220px,280px) minmax(0,1fr);border:1px solid var(--line);background:var(--surface);padding:0;min-block-size:270px;gap:28px}
.featured::before{content:"";position:absolute;inset-inline-start:-1px;inset-block:0;inline-size:3px;background:var(--burgundy)}
.featured-photo{display:block;block-size:100%;min-block-size:270px;overflow:hidden}
.featured-photo img{display:block;inline-size:100%;block-size:100%;object-fit:cover}
.featured-copy{display:flex;flex-direction:column;justify-content:center;padding:28px 30px 28px 0;gap:10px}
.featured-copy .post-kind{color:var(--accent);font-size:11px}
.featured-copy h2{font-size:clamp(20px,2.2vw,31px);line-height:1.65;font-weight:500}
.featured-copy p:not(.post-kind){color:var(--muted);font-size:13px;line-height:2}
.featured-copy .read-link{font-size:12px;color:var(--accent);margin-top:7px}
.editorial-paths{display:grid;grid-template-columns:1.05fr repeat(3,minmax(0,1fr));border-block:1px solid var(--line);margin-block:44px 48px}
.editorial-paths-heading{padding:24px;display:flex;flex-direction:column;justify-content:center}
.editorial-paths-heading h2{font-size:23px;font-weight:500;margin-top:13px}
.editorial-paths>a{display:flex;flex-direction:column;gap:9px;min-inline-size:0;border-inline-start:1px solid var(--line);padding:24px;text-decoration:none;transition:background .2s}
.editorial-paths>a:hover{background:var(--surface)}.editorial-paths>a>span{font-size:12px;color:var(--bronze)}
.editorial-paths strong{font-size:16px;font-weight:500}.editorial-paths small{font-size:11px;color:var(--muted);line-height:1.8}
.editorial-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin:18px 0}
.editorial-filters{display:flex;gap:20px;flex-wrap:wrap}.editorial-filters button{border:0;border-bottom:2px solid transparent;background:none;color:var(--muted);padding:12px 3px;font-size:12px;min-block-size:42px}
.editorial-filters button[aria-pressed="true"]{color:var(--accent);border-color:var(--accent);background:none}
.editorial-search{display:block;max-inline-size:280px;flex:1}.editorial-search input{inline-size:100%;border:1px solid var(--line);background:transparent;padding:10px 13px;color:var(--ink);font-size:12px}
.editorial-filter-note{font-size:11px;color:var(--muted);margin:8px 0 20px}
.post-list.editorial-post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-block-start:1px solid var(--line);border-inline-start:1px solid var(--line);background:transparent}
.editorial-post-grid .post-card{display:flex;flex-direction:column;gap:12px;min-inline-size:0;min-block-size:0;padding:0 24px 24px;margin:0;background:transparent;border:0;border-inline-end:1px solid var(--line);border-block-end:1px solid var(--line)}
.editorial-post-grid .post-card[hidden]{display:none}
.editorial-post-grid .card-photograph{display:block;position:relative;block-size:195px;margin-inline:-24px;overflow:hidden}
.editorial-post-grid .card-photograph img{inline-size:100%;block-size:100%;object-fit:cover}
.editorial-post-grid .image-reading-label{position:absolute;inset-inline:12px;inset-block-end:12px;color:#fff;font-size:11px;background:#740d32b8;padding:4px 8px}
.editorial-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:6px}
.editorial-card-top .post-kind{margin:0;font-size:11px;color:var(--accent)}
.editorial-save{display:grid;place-items:center;min-inline-size:40px;min-block-size:40px;font-size:23px;border:0;background:none}
.editorial-save[aria-pressed="true"]{color:var(--accent)}
.editorial-post-grid .post-card h3{font-size:clamp(17px,1.6vw,23px);line-height:1.7;font-weight:500;margin:0}
.editorial-post-grid .post-excerpt{font-size:12px;line-height:2;color:var(--muted);margin:0;flex:1}
.editorial-post-grid .byline{font-size:11px;color:var(--muted);margin-top:auto}
.editorial-post-grid .reading-action{font-size:12px;color:var(--accent);margin-top:4px;align-self:flex-start}
.editorial-reader-tools{display:flex;gap:10px;border-block:1px solid var(--line);padding:13px 0;margin:20px 0}
.editorial-reader-tools button{border:1px solid var(--line);background:var(--surface);padding:8px 14px;font-size:12px;min-block-size:44px}
.editorial-reader-tools button[aria-pressed="true"]{color:var(--accent);border-color:var(--bronze)}
.post-body.editorial-large-text{font-size:1.18em}
.editorial-closing{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.9fr);gap:55px;margin-top:55px;padding:46px 0 52px;border-top:1px solid var(--line)}
.editorial-closing h2{font-size:clamp(25px,3vw,35px);line-height:1.6;color:var(--ink);font-weight:500;margin-block:15px}
.editorial-closing p{font-size:12px;color:var(--muted);line-height:2}
.editorial-closing a{display:inline-flex;align-items:center;min-block-size:44px;margin-top:13px;font-size:12px;color:var(--accent)}
.editorial-closing aside{background:var(--surface);border:1px solid var(--line);padding:26px}
.editorial-closing aside>span{font-size:30px;color:var(--accent)}.editorial-closing h3{font-size:19px;margin:12px 0}
.editorial-reading-progress{position:fixed;z-index:100;inset-block-start:0;inset-inline-start:0;block-size:3px;inline-size:0;background:var(--accent);pointer-events:none}
@media(max-width:1050px){.reader-shell{width:calc(100% - 60px)}.reader-intro{gap:30px}.editorial-paths{grid-template-columns:repeat(3,minmax(0,1fr))}.editorial-paths-heading{grid-column:1/-1;padding:22px 0;border-bottom:1px solid var(--line)}.post-list.editorial-post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.reader-shell{width:calc(100% - 36px)}.reader-intro{grid-template-columns:1fr;gap:28px;padding:32px 0 42px}.reader-intro h1{font-size:clamp(38px,10vw,56px)}.identity-panel{min-block-size:300px}.featured{grid-template-columns:1fr;gap:0}.featured-photo{min-block-size:185px;block-size:185px}.featured-copy{padding:20px}.editorial-paths{grid-template-columns:1fr}.editorial-paths>a{border-inline-start:0;border-block-start:1px solid var(--line);padding:18px 15px}.editorial-toolbar{align-items:stretch}.editorial-filters{gap:12px;inline-size:100%}.editorial-search{max-inline-size:none;inline-size:100%;flex:auto}.post-list.editorial-post-grid{grid-template-columns:1fr}.editorial-post-grid .card-photograph{block-size:210px}.editorial-closing{grid-template-columns:1fr;gap:25px}.intro-topics{gap:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Approved G2 identity, retained navigation and reader typography */
.site-header .brand-mark,.site-footer .brand-mark{object-fit:contain;block-size:46px;inline-size:46px}
:root[data-theme="dark"] .site-header .brand-mark,:root[data-theme="dark"] .site-footer .brand-mark{filter:brightness(0) invert(1)}
@media(prefers-color-scheme:dark){:root:not([data-theme]) .site-header .brand-mark,:root:not([data-theme]) .site-footer .brand-mark{filter:brightness(0) invert(1)}}
/* BLOG-ELEPHANT-HERO-02 | 11 Oct 2026
   Correct the actual server-rendered reader header and homepage hero.
   The shared routes, article reader, forms, CSS tokens and light/dark behaviors remain intact. */
.site-header {
  inline-size:min(calc(100% - 112px),1340px);
  block-size:84px;
  padding-block:10px;
  grid-template-columns:minmax(190px,1fr) auto minmax(190px,1fr);
  column-gap:clamp(18px,2.3vw,36px);
}
.site-header .header-brand-row { display:contents; }
.site-header .site-name { grid-column:1;grid-row:1;gap:11px; }
.site-header .brand-symbol {
  inline-size:42px;block-size:42px;flex-basis:42px;
  padding:3px;background:#fffdf8;border:1px solid #a5794570;
}
.site-header .brand-mark {inline-size:34px;block-size:34px;filter:none!important;}
.site-header .brand-parent {font-size:13px;line-height:1.4;}
.site-header .brand-statement {font-size:9px;line-height:1.6;max-inline-size:38ch;}
.site-header .site-nav {grid-column:2;grid-row:1;justify-content:center;flex-wrap:nowrap;gap:clamp(15px,2vw,30px);}
.site-header .site-nav a {
  min-block-size:40px;padding:8px 0;
  font-size:12px;white-space:nowrap;
}
.site-header .header-tools {
  grid-column:3;grid-row:1;justify-self:end;
  display:flex;align-items:center;justify-content:flex-end;
  flex-wrap:nowrap;gap:9px;
}
.site-header .locale-switch button,
.site-header .theme-toggle {
  min-block-size:36px;min-inline-size:36px;
  padding:7px 10px;font-size:11px;border-radius:0;
  border:1px solid var(--line);font-weight:500;
}
.site-header .theme-toggle {gap:8px;}
.site-header .header-contact-link {
  min-block-size:36px;display:inline-flex;align-items:center;justify-content:center;
  gap:14px;padding:4px 13px;white-space:nowrap;
  font-size:11px;border:1px solid var(--bronze);
  transition:background .2s ease,color .2s ease;
}
.site-header .header-contact-link span:last-child {color:var(--bronze);font-size:16px;}
.site-header .header-contact-link:hover {background:var(--burgundy);color:#fff;text-decoration:none;}
.site-header .menu-toggle {min-block-size:36px;border-radius:0;}
.site-footer .reader-account-menu {
  margin-block-start:18px;padding-block-start:16px;border-block-start:1px solid var(--line);
  font-size:12px;color:var(--muted);
}
.site-footer .reader-account-menu summary {
  display:list-item;width:fit-content;min-block-size:36px;
  cursor:pointer;color:var(--accent);font-weight:500;
}
.site-footer .reader-account-menu summary:focus-visible {outline:2px solid var(--focus);outline-offset:3px;}
.site-footer .reader-account-panel {padding-block:8px 12px;}
.site-footer .reader-account-menu .reader-account {min-block-size:36px;font-size:12px;}
.site-footer .reader-account-menu .reader-account.authenticated {justify-content:flex-start;}

/* Home-only spacing: preserve the article/archive reading layouts. */
.reader-shell:has(> .editorial-breadcrumb) {padding-block-start:0;}
.reader-shell > .editorial-breadcrumb {padding-block-start:18px;}
.reader-shell > .reader-intro {
  inline-size:100%;max-inline-size:none;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(32px,5vw,72px);padding:26px 0 51px;
  align-items:center;margin-block-end:0;
}
.reader-intro .intro-copy {align-self:center;min-inline-size:0;padding-block-start:8px;}
.reader-intro h1 {margin:18px 0;line-height:1.28;letter-spacing:-.025em;}
.reader-intro .intro-deck {max-inline-size:640px;line-height:2.05;}
.reader-intro .intro-action {margin-block-start:22px;}
.reader-intro .intro-topics {margin-block-start:28px;padding-block-start:16px;gap:12px 18px;}
.identity-panel.photographic-panel {
  position:relative;min-block-size:0;
  aspect-ratio:.96;max-block-size:560px;
  inline-size:100%;padding:24px 25px 21px;
  align-self:start;overflow:hidden;isolation:isolate;
}
.identity-panel.photographic-panel .hero-photograph {
  inset:0;inline-size:100%;block-size:100%;
  object-fit:cover;object-position:50% 42%;
  transform:scale(1.04);transform-origin:50% 42%;
  filter:saturate(.73) contrast(1.07);
}
.identity-panel.photographic-panel::after {
  background:linear-gradient(180deg,rgba(42,14,28,.62),rgba(48,18,35,.07) 42%,rgba(39,14,28,.78) 100%);
}
.identity-panel.photographic-panel .panel-head,
.identity-panel.photographic-panel .panel-bottom {position:relative;z-index:3;}
.identity-panel.photographic-panel .panel-head {
  border-block-end:1px solid rgba(255,255,255,.4);
  padding-block-end:13px;
}
.identity-panel.photographic-panel .panel-bottom {
  padding-block-start:15px;border-block-start:1px solid rgba(255,255,255,.4);
}
.identity-panel.photographic-panel .emblem-wrap {
  position:relative;flex:1;z-index:2;padding:22px 0;
}
.identity-panel.photographic-panel .hero-emblem {
  inline-size:64px;block-size:75px;
  background:rgba(116,13,50,.88);border-color:rgba(216,177,126,.65);
}
.identity-panel.photographic-panel .hero-emblem img {inline-size:43px;block-size:55px;}

/* Mobile menu remains progressive: visible without JS and toggled with JS. */
@media (max-width:1019px) {
  .site-header {
    inline-size:calc(100% - 60px);
    block-size:auto;min-block-size:72px;padding-block:12px;
    grid-template-columns:minmax(0,1fr) auto;
    column-gap:10px;row-gap:0;
  }
  .site-header .header-brand-row {display:contents;}
  .site-header .site-name {grid-column:1;grid-row:1;min-inline-size:0;}
  .site-header .site-nav {
    grid-column:1/-1;grid-row:2;flex-wrap:wrap;justify-content:flex-start;
    gap:6px;margin-top:10px;border-block-start:1px solid var(--line);padding-block:8px;
  }
  .js-enabled .site-header .site-nav {display:none;}
  .js-enabled .site-header.menu-open .site-nav {display:flex;}
  .site-header .header-tools {grid-column:2;grid-row:1;gap:6px;}
  .site-header .menu-toggle {display:none;min-inline-size:36px;padding:6px 8px;}
  .js-enabled .site-header .menu-toggle {display:inline-flex;}
  .site-header .header-contact-link {padding-inline:9px;gap:7px;}
  .reader-shell > .reader-intro {gap:30px;}
}
@media (max-width:720px) {
  .site-header {
    inline-size:calc(100% - 36px);min-block-size:70px;
    padding-block:9px;
  }
  .site-header .brand-symbol {inline-size:36px;block-size:36px;flex-basis:36px;}
  .site-header .brand-mark {inline-size:29px;block-size:29px;}
  .site-header .brand-parent {font-size:12px;}
  .site-header .brand-statement {font-size:9px;}
  .site-header .header-tools {gap:5px;}
  .site-header .header-contact-link {display:none;}
  .site-header .theme-toggle,
  .site-header .locale-switch button,
  .site-header .menu-toggle {min-block-size:35px;min-inline-size:35px;padding:4px 7px;font-size:10px;}
  .site-header .theme-toggle {gap:0;}
  .site-header .theme-toggle [data-theme-label] {position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
  .site-header .menu-toggle {gap:0;}
  .site-header .menu-toggle span:last-child {display:none;}
  .reader-shell > .editorial-breadcrumb {padding-block-start:17px;}
  .reader-shell > .reader-intro {
    grid-template-columns:minmax(0,1fr);gap:27px;
    padding:25px 0 42px;
  }
  .reader-intro .intro-copy {padding-block-start:0;}
  .reader-intro h1 {font-size:clamp(38px,10vw,56px);line-height:1.3;}
  .reader-intro .intro-deck {line-height:2;}
  .reader-intro .intro-topics {gap:10px 15px;margin-block-start:24px;}
  .identity-panel.photographic-panel {
    aspect-ratio:1.04;max-block-size:490px;
    padding:19px 21px 20px;
  }
  .identity-panel.photographic-panel .hero-emblem {inline-size:57px;block-size:67px;}
  .identity-panel.photographic-panel .hero-emblem img {inline-size:37px;block-size:48px;}
}
@media (max-width:390px) {
  .site-header .brand-statement {display:none;}
  .site-header .site-name {gap:7px;}
  .site-header .locale-switch button,
  .site-header .theme-toggle,
  .site-header .menu-toggle {min-inline-size:32px;min-block-size:34px;}
  .site-header .header-tools {gap:4px;}
}
@media (prefers-reduced-motion:reduce) {
  .identity-panel.photographic-panel .hero-photograph {transform:none;}
}

/* Personal Blog S2 reader: pair an existing hero image with its editorial
   introduction on desktop, preserving the publication's native direction.
   Text-only articles retain their established single-column reading measure. */
@media (min-width: 901px) {
  .post-detail .article-hero:not(.article-hero--text-only) {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
    gap: clamp(24px, 4vw, 64px);
    align-items: center;
    inline-size: 100%;
  }
  .post-detail .article-hero:not(.article-hero--text-only) > .article-hero-copy {
    min-inline-size: 0;
  }
  .post-detail .article-hero:not(.article-hero--text-only) > .article-hero-media {
    min-inline-size: 0;
    inline-size: 100%;
    max-inline-size: 100%;
    margin: 0;
  }
  .post-detail .article-hero:not(.article-hero--text-only) > .article-hero-media img {
    inline-size: 100%;
    block-size: auto;
    max-block-size: 300px;
    object-fit: contain;
  }
}
@media (max-width: 900px) {
  .post-detail .article-hero:not(.article-hero--text-only) {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
}