/* ==========================================================================
   Shuviro — global publication shell (default.hbs, index.hbs, post.hbs, page.hbs)
   Own token namespace (--sv-*) — never shares tokens/classes with Baby TEMBO
   (.bt-* / --ink-navy etc., which live only in screen.css under .bt-root).
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,wght@0,400;0,500;0,600;1,400&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --sv-ink:#1a1814;--sv-ink-soft:#4a453e;--sv-paper:#f5f0e8;--sv-paper-warm:#ece3d2;--sv-line:rgba(26,24,20,0.18);--sv-line-strong:rgba(26,24,20,0.4);
  --sv-accent:#4a453e;--sv-gold:#d4a017;
  --sv-font-serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sv-font-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --sv-space-1:4px;--sv-space-2:8px;--sv-space-3:12px;--sv-space-4:16px;--sv-space-5:24px;--sv-space-6:32px;--sv-space-7:48px;--sv-space-8:64px;--sv-space-9:96px;
  --sv-max:1200px;
}

*{box-sizing:border-box}
body{margin:0;font-family:var(--sv-font-serif);background:var(--sv-paper);color:var(--sv-ink);font-size:18px;line-height:1.5}
h1,h2,h3,h4{font-family:var(--sv-font-serif);font-weight:500;margin:0;letter-spacing:-0.005em}
a{color:var(--sv-ink);text-decoration:none}
a:hover{color:var(--sv-accent)}
:focus-visible{outline:2px solid var(--sv-ink);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation-duration:0.01ms!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}}

.sv-eyebrow{font-family:var(--sv-font-mono);font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--sv-ink-soft)}
.sv-wrap{max-width:var(--sv-max);margin:0 auto;padding:0 var(--sv-space-6)}
@media (max-width:700px){.sv-wrap{padding:0 var(--sv-space-4)}}

/* Header */
.sv-header{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:var(--sv-space-6);padding:var(--sv-space-4) var(--sv-space-6);border-bottom:1px solid var(--sv-ink)}
.sv-header__mark{display:flex;align-items:center;gap:10px}
.sv-header__mark-icon{height:26px;width:26px;display:block}
.sv-header__mark-text{font-family:var(--sv-font-serif);font-size:21px;font-weight:500;letter-spacing:0.01em}
.sv-header__nav{display:flex;gap:var(--sv-space-5);justify-self:center}
.nav-link{font-family:var(--sv-font-mono);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--sv-ink-soft);border-bottom:1px solid transparent;padding-bottom:3px}
.nav-link--active,.sv-header__nav .nav-link:hover{color:var(--sv-ink);border-bottom-color:var(--sv-gold)}
.sv-header__join{font-family:var(--sv-font-mono);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;border:1px solid var(--sv-ink);padding:8px 16px;color:var(--sv-ink)}
.sv-header__join:hover{background:var(--sv-ink);color:var(--sv-paper)}
.sv-header__toggle{display:none;min-height:44px;min-width:44px;background:transparent;border:1px solid var(--sv-line-strong);font-family:var(--sv-font-mono);font-size:12px;text-transform:uppercase;letter-spacing:0.08em;cursor:pointer}
.sv-header__mobile-nav{display:none}
@media (max-width:820px){
  .sv-header{grid-template-columns:1fr auto}
  .sv-header__nav,.sv-header__join{display:none}
  .sv-header__toggle{display:block}
  .sv-header__mobile-nav{grid-column:1/-1;flex-direction:column;padding-top:var(--sv-space-3)}
  .sv-header__mobile-nav[hidden]{display:none}
  .sv-header__mobile-nav:not([hidden]){display:flex}
  .sv-header__mobile-nav .nav-link{min-height:44px;display:flex;align-items:center;border-top:1px solid var(--sv-line)}
}

/* Hero — asymmetric editorial split */
.sv-hero{padding:var(--sv-space-8) var(--sv-space-6);border-bottom:1px solid var(--sv-line)}
.sv-hero__grid{display:grid;grid-template-columns:58% 1fr;gap:var(--sv-space-7);align-items:center}
.sv-hero__mark{display:flex;align-items:center;gap:10px;margin-bottom:var(--sv-space-4)}
.sv-hero__mark-bar{width:28px;height:3px;background:var(--sv-gold);display:block}
.sv-hero__headline{font-size:clamp(2.9rem,3.6vw + 1.8rem,5.6rem);font-weight:500;line-height:1.02;letter-spacing:-0.01em;margin-bottom:var(--sv-space-6);max-width:11.5em}
.sv-hero__deck{font-size:19px;color:var(--sv-ink-soft);max-width:480px;line-height:1.5;padding-top:var(--sv-space-4);border-top:1px solid var(--sv-line)}
.sv-hero__frame{aspect-ratio:4/5;border:1px solid var(--sv-ink);position:relative;background:
  repeating-linear-gradient(135deg,transparent,transparent 10px,var(--sv-line) 10px,var(--sv-line) 11px);
  display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--sv-space-4)}
.sv-hero__frame-label{font-family:var(--sv-font-mono);font-size:11px;letter-spacing:0.06em;text-transform:uppercase;color:var(--sv-ink-soft);background:var(--sv-paper);padding:6px 10px;border:1px solid var(--sv-line-strong)}
@media (max-width:820px){.sv-hero__grid{grid-template-columns:1fr}.sv-hero__frame{aspect-ratio:16/10}.sv-hero__headline{max-width:none}}

/* Editorial index strip — publication contents, not utility nav */
.sv-index{display:flex;border-top:2px solid var(--sv-ink);border-bottom:2px solid var(--sv-ink)}
.sv-index__item{flex:1;display:flex;align-items:baseline;gap:var(--sv-space-4);padding:var(--sv-space-5) var(--sv-space-5);border-left:1px solid var(--sv-line)}
.sv-index__item:first-child{border-left:none}
.sv-index__num{font-family:var(--sv-font-mono);font-size:15px;color:var(--sv-gold);font-weight:500}
.sv-index__title{font-family:var(--sv-font-serif);font-size:25px;font-weight:500;flex:1}
.sv-index__link{font-family:var(--sv-font-mono);font-size:12px;letter-spacing:0.1em;text-transform:uppercase;color:var(--sv-ink-soft)}
.sv-index__item:hover .sv-index__link{color:var(--sv-ink)}
.sv-index__item:hover .sv-index__title{color:var(--sv-gold)}
@media (max-width:820px){.sv-index{flex-direction:column}.sv-index__item{border-left:none;border-top:1px solid var(--sv-line);padding:var(--sv-space-4)}.sv-index__item:first-child{border-top:none}.sv-index__title{font-size:21px}}

/* Section shell */
.sv-section{padding:var(--sv-space-8) var(--sv-space-6);border-bottom:1px solid var(--sv-line)}
.sv-section__head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sv-space-4);margin-bottom:var(--sv-space-6);flex-wrap:wrap}
.sv-section__title{font-size:28px}
.sv-section__all{font-family:var(--sv-font-mono);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;color:var(--sv-ink-soft)}
.sv-section__all:hover{color:var(--sv-accent)}

/* Entry points */
.sv-entries{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sv-space-6)}
.sv-entry{border-top:1px solid var(--sv-line-strong);padding-top:var(--sv-space-4)}
.sv-entry__num{font-family:var(--sv-font-mono);font-size:12px;color:var(--sv-gold)}
.sv-entry__title{font-size:22px;margin:var(--sv-space-2) 0 var(--sv-space-2)}
.sv-entry__desc{color:var(--sv-ink-soft);font-size:16px;line-height:1.5;margin-bottom:var(--sv-space-3)}
.sv-entry__link{font-family:var(--sv-font-mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;border-bottom:1px solid var(--sv-ink)}
@media (max-width:820px){.sv-entries{grid-template-columns:1fr;gap:var(--sv-space-5)}}

/* Placeholder plates (used for featured image / register / profile art) */
.sv-plate{aspect-ratio:4/3;background:var(--sv-paper-warm);border:1px solid var(--sv-line-strong);display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--sv-space-4)}
.sv-plate__label{font-family:var(--sv-font-mono);font-size:11px;letter-spacing:0.06em;text-transform:uppercase;color:var(--sv-ink-soft)}
.sv-plate--tall{aspect-ratio:3/4}
.sv-plate--square{aspect-ratio:1/1}

/* Featured story */
.sv-featured{display:grid;grid-template-columns:1fr 1fr;gap:var(--sv-space-8);align-items:center}
.sv-featured__eyebrow{margin-bottom:var(--sv-space-3)}
.sv-featured__headline{font-size:34px;line-height:1.15;margin-bottom:var(--sv-space-3)}
.sv-featured__deck{color:var(--sv-ink-soft);font-size:17px;line-height:1.55;margin-bottom:var(--sv-space-4)}
.sv-featured__cta{font-family:var(--sv-font-mono);font-size:12px;letter-spacing:0.06em;text-transform:uppercase;border-bottom:1px solid var(--sv-ink)}
@media (max-width:820px){.sv-featured{grid-template-columns:1fr}}

/* People & Practice */
.sv-spotlight{display:grid;grid-template-columns:280px 1fr;gap:var(--sv-space-7);margin-bottom:var(--sv-space-7);align-items:center}
.sv-spotlight__eyebrow{margin-bottom:var(--sv-space-2)}
.sv-spotlight__name{font-size:26px;margin-bottom:var(--sv-space-2)}
.sv-spotlight__desc{color:var(--sv-ink-soft);font-size:16px;line-height:1.55}
@media (max-width:820px){.sv-spotlight{grid-template-columns:1fr}}
.sv-profiles{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sv-space-5)}
.sv-profile__name{font-size:16px;margin-top:var(--sv-space-3)}
.sv-profile__role{font-family:var(--sv-font-mono);font-size:11px;letter-spacing:0.05em;text-transform:uppercase;color:var(--sv-ink-soft);margin-top:2px}
@media (max-width:820px){.sv-profiles{grid-template-columns:1fr 1fr}}

/* Projects */
.sv-projects{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sv-space-5)}
.sv-project{border:1px solid var(--sv-line-strong);display:flex;flex-direction:column}
.sv-project__plate{aspect-ratio:16/10}
.sv-project__body{padding:var(--sv-space-4)}
.sv-project__lineage{font-family:var(--sv-font-mono);font-size:11px;letter-spacing:0.04em;color:var(--sv-ink-soft);margin-bottom:var(--sv-space-2)}
.sv-project__name{font-size:20px;margin-bottom:var(--sv-space-2)}
.sv-project__desc{color:var(--sv-ink-soft);font-size:15px;line-height:1.5}
.sv-project--link{cursor:pointer}
.sv-project--link:hover{border-color:var(--sv-ink)}
@media (max-width:820px){.sv-projects{grid-template-columns:1fr}}

/* From the Register */
.sv-register{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sv-space-4)}
.sv-register__item{border:1px solid var(--sv-line)}
.sv-register__plate{aspect-ratio:1/1}
.sv-register__caption{font-family:var(--sv-font-mono);font-size:11px;letter-spacing:0.03em;color:var(--sv-ink-soft);padding:var(--sv-space-2) var(--sv-space-3)}
@media (max-width:820px){.sv-register{grid-template-columns:1fr 1fr}}

/* Latest from Shuviro */
.sv-latest__row{display:grid;grid-template-columns:100px 1fr auto;gap:var(--sv-space-4);align-items:baseline;padding:var(--sv-space-4) 0;border-top:1px solid var(--sv-line)}
.sv-latest__date{font-family:var(--sv-font-mono);font-size:11px;letter-spacing:0.04em;color:var(--sv-ink-soft)}
.sv-latest__title{font-size:19px}
.sv-latest__tag{font-family:var(--sv-font-mono);font-size:11px;letter-spacing:0.04em;text-transform:uppercase;color:var(--sv-ink-soft)}
.sv-latest__empty{color:var(--sv-ink-soft);padding:var(--sv-space-4) 0;border-top:1px solid var(--sv-line)}
.sv-pagination{margin-top:var(--sv-space-5);font-family:var(--sv-font-mono);font-size:12px}
.sv-pagination a{border-bottom:1px solid var(--sv-ink)}

/* Footer */
.sv-footer{padding:var(--sv-space-7) var(--sv-space-6) var(--sv-space-6);border-top:1px solid var(--sv-ink)}
.sv-footer__top{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sv-space-4);flex-wrap:wrap;margin-bottom:var(--sv-space-5)}
.sv-footer__mark{font-size:24px}
.sv-footer__tagline{color:var(--sv-ink-soft);font-size:15px}
.sv-footer__nav{display:flex;gap:var(--sv-space-5);flex-wrap:wrap;padding-bottom:var(--sv-space-5);border-bottom:1px solid var(--sv-line);margin-bottom:var(--sv-space-4)}
.sv-footer__nav .nav-link{color:var(--sv-ink-soft)}
.sv-footer__bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--sv-space-3);font-family:var(--sv-font-mono);font-size:12px;color:var(--sv-ink-soft)}
.sv-footer__contact{border-bottom:1px solid var(--sv-line-strong)}

/* Ordinary post/page content */
.sv-post{padding:var(--sv-space-8) var(--sv-space-6)}
.sv-post__header{max-width:720px;margin:0 auto var(--sv-space-6)}
.sv-post__title{font-size:clamp(1.8rem,1vw + 1.5rem,3rem);margin-bottom:var(--sv-space-3)}
.sv-post__meta{font-family:var(--sv-font-mono);font-size:12px;color:var(--sv-ink-soft)}
.sv-post__feature-img{width:100%;max-width:960px;margin:0 auto var(--sv-space-6);display:block}
.sv-post-content,.sv-article__content{max-width:720px;margin:0 auto;font-size:19px;line-height:1.65}
.sv-post-content h2,.sv-article__content h2{font-size:26px;margin:var(--sv-space-6) 0 var(--sv-space-3)}
.sv-post-content h3,.sv-article__content h3{font-size:21px;margin:var(--sv-space-5) 0 var(--sv-space-2)}
.sv-post-content p,.sv-article__content p{margin:0 0 var(--sv-space-4)}
.sv-post-content img,.sv-article__content img{max-width:100%}
.sv-post-content a,.sv-article__content a{border-bottom:1px solid var(--sv-ink)}
.sv-post-content blockquote,.sv-article__content blockquote{border-left:2px solid var(--sv-line-strong);padding-left:var(--sv-space-4);margin:0 0 var(--sv-space-4);font-style:italic;color:var(--sv-ink-soft)}
.sv-post-content .kg-width-wide{max-width:960px;width:calc(100vw - var(--sv-space-6) * 2);margin-left:calc(50% - 50vw + var(--sv-space-6));margin-right:calc(50% - 50vw + var(--sv-space-6))}
.sv-post-content .kg-width-full{max-width:100vw;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.sv-post-content .kg-width-full img{width:100%;display:block}
.sv-article{padding:var(--sv-space-8) var(--sv-space-6)}
.sv-article header h1{max-width:720px;margin:0 auto var(--sv-space-6);font-size:clamp(1.8rem,1vw + 1.5rem,3rem)}