/* ==========================================================
   nickbachan.com — writerly, minimal, images forward
   Type: Newsreader (one family, optical sizes)
   ========================================================== */
@import url('https://fonts-api.wp.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,400;1,6..72,500&display=swap');

:root {
	--paper: #ffffff;
	--ink: #1b1e23;
	--muted: #5f656d;
	--rule: #e7e5e0;
	--accent: #22409a;
	--measure: 40rem;
	--wide: 68.75rem; /* 1100px: the theme's grid is built for this */
	--serif: 'Newsreader', 'Iowan Old Style', Georgia, serif;
}

/* ---------- Page canvas: drop the dark frame, go full paper ---------- */
html { font-size: 16px; }
html, body, body.body-borders, body.custom-colors {
	background: var(--paper) !important;
}
body, button, input, select, textarea {
	font-family: var(--serif);
	color: var(--ink);
}
body {
	font-size: 20px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
body.body-borders .site-border,
body.body-borders::before,
body.body-borders::after { display: none !important; }
#page, .site {
	background: var(--paper) !important;
	max-width: none;
	width: auto;
	margin: 0 !important;
	padding: 0;
	box-shadow: none;
	border: 0;
}

/* ---------- Header: name left, menu right ---------- */
.site-header {
	max-width: var(--wide);
	margin: 0 auto;
	padding: 2.25rem 1.5rem 1.5rem;
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: .5rem 2rem;
	text-align: left;
	border-bottom: 1px solid var(--rule);
	background: none;
}
.site-header::before, .site-header::after,
.site-branding::before, .site-branding::after { display: none; }
.site-branding { margin: 0; padding: 0; text-align: left; width: auto; max-width: none; float: none; }
.site-title { margin: 0; line-height: 1; }
.site-title a {
	font-family: var(--serif);
	font-size: 1.9rem;
	font-weight: 500;
	text-transform: none;
	letter-spacing: -0.01em;
	color: var(--ink) !important;
	text-decoration: none;
}
.site-description, .site-logo-link, .site-header img { display: none; }
.site-header, .site-content, .site-footer { box-sizing: content-box; }
.main-navigation a { line-height: 1.2; }

.main-navigation { margin: 0; padding: 0; width: auto; clear: none; text-align: left; border: 0; }
.main-navigation::before, .main-navigation::after, .menu-wrapper::before { display: none; }
.main-navigation ul { margin: 0; }
.main-navigation li { margin: 0 0 0 1.4rem; }
.main-navigation > div > ul > li:first-child { margin-left: 0; }
.main-navigation a {
	font-family: var(--serif);
	font-size: 1.05rem;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	color: var(--muted) !important;
	padding: .25rem 0;
}
.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a,
.main-navigation .current-menu-ancestor > a {
	color: var(--ink) !important;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: .3em;
}
.main-navigation ul ul {
	background: var(--paper);
	border: 1px solid var(--rule);
	box-shadow: 0 12px 30px -16px rgba(27, 30, 35, .25);
	padding: .5rem 0;
}
.main-navigation ul ul li { margin: 0; }
.main-navigation ul ul a { padding: .35rem 1rem; font-size: 1rem; white-space: nowrap; }
.main-navigation ul ul::before, .main-navigation ul ul::after { display: none; }
.menu-toggle {
	font-family: var(--serif);
	text-transform: none;
	font-weight: 400;
	color: var(--ink) !important;
	background: none;
	border: 1px solid var(--rule);
}

/* ---------- Content frame ---------- */
.site-content {
	max-width: var(--wide);
	margin: 0 auto;
	padding: 3.5rem 1.5rem 5rem;
	background: none;
}
.content-area, .site-main { width: auto; float: none; margin: 0; }
.site-main > .hentry, .single .site-main .hentry, .page .site-main .hentry, .entry-content, .page-content {
	max-width: none;
	width: auto;
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
	border: 0;
}
.main-navigation ul, .main-navigation .menu-wrapper { padding: 0; margin-top: 0; }
.entry-meta, .entry-footer { border: 0 !important; }
.entry-meta::before, .entry-meta::after { display: none; }
.home .entry-meta { display: none; }

/* Reading column; media can step wider */
.entry-header, .page-header,
.entry-content > *,
.entry-meta, .comments-area, .post-navigation .nav-links {
	max-width: var(--measure);
	margin-left: auto;
	margin-right: auto;
}
.entry-content > figure,
.entry-content > .wp-block-image,
.entry-content > .wp-block-gallery,
.entry-content > .tiled-gallery,
.entry-content > .wp-block-embed,
.entry-content > .wp-block-video,
.entry-content > .wp-block-file,
.entry-content > .wp-block-media-text,
.entry-content > .wp-block-columns:has(> .wp-block-column + .wp-block-column),
.entry-content > .nb-hits,
.entry-content > .alignwide,
.entry-content > .jetpack-slideshow {
	max-width: var(--wide);
}
.entry-content > .wp-block-image.alignleft,
.entry-content > .wp-block-image.alignright { max-width: var(--measure); }

/* ---------- Type ---------- */
body h1, body h2, body h3, body h4, body h5, body h6,
body .entry-title, body .page-title, body .widget-title, body .comments-title, body .comment-reply-title {
	font-family: var(--serif) !important;
	color: var(--ink);
	text-transform: none;
	letter-spacing: -0.012em;
	font-weight: 500;
}
.site-main .entry-title, .site-main .page-title {
	font-size: clamp(2.1rem, 4.2vw, 3rem);
	line-height: 1.12;
	margin: 0 auto 1.75rem;
	text-align: left;
}
.entry-header, .page-header { text-align: left; border: 0; padding: 0; margin-bottom: 0; width: auto; }
.entry-header::after, .page-header::after { display: none; }
.site-main .entry-content h2 { font-size: 1.65rem; line-height: 1.25; margin: 2.75rem auto .75rem; }
.site-main .entry-content h3 { font-size: 1.3rem; line-height: 1.3; margin: 2.25rem auto .5rem; }
.site-main .entry-content h4 { font-size: 1.1rem; margin: 1.75rem auto .4rem; }
.entry-content p, .entry-content li { font-size: 1.1875rem; line-height: 1.65; color: var(--ink); }
.entry-content p { margin-bottom: 1.15em; }
.entry-content ul, .entry-content ol { padding-left: 1.3em; margin-left: auto; list-style-position: outside; }
.entry-content li { margin-bottom: .4em; padding-left: .2em; }
.entry-content li::before { display: none; }
.entry-content ul { list-style-type: disc; }
.entry-content strong, .entry-content b { font-weight: 600; }
.entry-content blockquote {
	border-left: 2px solid var(--ink);
	padding: .1rem 0 .1rem 1.25rem;
	font-style: italic;
	font-size: 1.25rem;
	color: var(--ink);
	background: none;
}
.entry-content hr, .wp-block-separator {
	border: 0;
	border-top: 1px solid var(--rule);
	max-width: var(--measure);
	margin: 2.5rem auto;
}

/* Links */
a { color: var(--accent); }
.entry-content a, .page-content a, .comment-content a {
	color: var(--accent) !important;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: .18em;
	border: 0;
}
.entry-content a:hover, .entry-content a:focus { text-decoration-thickness: 2px; }
a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* ---------- Images: let them carry the color ---------- */
.entry-content img { border-radius: 2px; }
.entry-content figure img,
.entry-content .wp-block-image img,
.entry-content > p > img,
.entry-content > p > a > img {
	box-shadow: 0 0 0 1px rgba(27, 30, 35, .06), 0 14px 34px -18px rgba(27, 30, 35, .35);
}
.entry-content figure, .entry-content .wp-block-image { margin-top: 2.5rem; margin-bottom: 2.5rem; }
.entry-content figcaption, .wp-caption-text, .wp-element-caption {
	font-family: var(--serif);
	font-style: italic;
	font-size: .95rem;
	line-height: 1.45;
	color: var(--muted);
	text-align: left;
	margin-top: .75rem;
}
.wp-block-gallery { gap: 1.25rem; }
.wp-block-gallery figure img { box-shadow: 0 0 0 1px rgba(27, 30, 35, .06), 0 10px 26px -16px rgba(27, 30, 35, .3); }

/* ---------- Portfolio grids ---------- */
.portfolio-wrapper { max-width: none; margin-left: -20px; margin-right: -20px; } /* theme gutters are 20px each side */
.archive .page-header, .blog .page-header, .search .page-header { max-width: var(--wide); }
.archive .page-title { margin-bottom: 2.5rem; }
.portfolio-entry-header { padding: 0; text-align: left; }
.site-main .portfolio-wrapper .entry-title,
.site-main .portfolio-entry-header .entry-title {
	font-size: 1.2rem;
	line-height: 1.3;
	font-weight: 500;
	letter-spacing: -0.005em;
	margin: .85rem 0 .3rem;
	text-align: left;
}
.portfolio-wrapper .entry-title a { color: var(--ink) !important; text-decoration: none; }
.portfolio-wrapper .entry-title a:hover { text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: 1px; }
.portfolio-entry-meta, .portfolio-entry-meta a {
	font-family: var(--serif);
	font-style: italic;
	font-size: .95rem;
	text-transform: none;
	letter-spacing: 0;
	color: var(--muted) !important;
	text-decoration: none;
}
.portfolio-thumbnail img { border-radius: 2px; }
body .site-main .portfolio-wrapper .portfolio-entry-header .entry-title,
body .site-main .portfolio-wrapper .portfolio-entry-header .entry-title a {
	font-size: 1.15rem;
	line-height: 1.3;
}
body .site-main .portfolio-wrapper .portfolio-entry-header .entry-title { min-height: calc(3.9em + 4px); }
body.term-illustration .site-main .portfolio-wrapper .portfolio-entry-header .entry-title { min-height: 0; }
.portfolio-wrapper .portfolio-entry-meta { text-align: left; margin: 0; }
.portfolio-wrapper .portfolio-entry-header { text-align: left; }

/* ---------- Entry meta, share, likes ---------- */
.entry-meta, .entry-meta a, .entry-footer {
	font-family: var(--serif);
	font-style: italic;
	font-size: .95rem;
	text-transform: none;
	letter-spacing: 0;
	color: var(--muted) !important;
}
.entry-header .entry-meta { margin-top: -1rem; margin-bottom: 2rem; }
.single-jetpack-portfolio .entry-header .entry-meta,
.single-jetpack-portfolio .entry-header .entry-meta a { font-size: 1rem; }
.sd-like, .jetpack-likes-widget-wrapper { display: none !important; }
.sharedaddy .sd-title {
	font-family: var(--serif) !important;
	font-weight: 500 !important;
	font-size: .95rem !important;
	text-transform: none !important;
}
.sharedaddy .sd-title::before { display: none !important; }

/* Portfolio pages are for looking, not commenting */
.single-jetpack-portfolio .comments-area,
.single-jetpack-portfolio .comments-link { display: none; }

/* ---------- Previous / next ---------- */
.post-navigation, .posts-navigation, .paging-navigation {
	max-width: var(--wide);
	margin: 4rem auto 0;
	padding: 1.75rem 0 0;
	border-top: 1px solid var(--rule);
	background: none;
}
.post-navigation .nav-links { display: flex; justify-content: space-between; gap: 2rem; }
.post-navigation a {
	font-family: var(--serif);
	font-size: 1.1rem;
	text-transform: none;
	color: var(--ink) !important;
	text-decoration: none;
}
.post-navigation a:hover { text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: 1px; }
.post-navigation .nav-next { text-align: right; }

/* ---------- Home: intro + carousel ---------- */
.home .entry-header { display: none; }
.home .wp-block-media-text { gap: 0 3rem; align-items: start; }
.home .wp-block-media-text__media img { border-radius: 2px; box-shadow: none; }
.home .wp-block-media-text__content { padding: 0 !important; }
.home .wp-block-media-text__content p {
	font-size: 1.3rem;
	line-height: 1.5;
	letter-spacing: -0.005em;
}
.nb-hits { margin-top: 4.5rem !important; }
.nb-hits .nb-hits__head { border-top: 1px solid var(--rule); padding-top: 1.5rem; margin-bottom: 1.5rem !important; }
.nb-hits .nb-hits__head h2 {
	margin: 0 !important;
	font-family: var(--serif);
	font-size: 1.65rem;
	font-weight: 500;
	color: var(--ink);
}
.nb-hits .nb-hits__nav button {
	color: var(--ink);
	border-color: var(--rule);
	font-family: var(--serif);
}
.nb-hits .nb-hits__nav button:hover:not(:disabled) { border-color: var(--ink); }
.nb-hits .nb-hits__card a { color: var(--ink) !important; text-decoration: none; }
.nb-hits .nb-hits__card img { border-radius: 2px; box-shadow: 0 0 0 1px rgba(27, 30, 35, .06); margin-bottom: .85rem; }
.nb-hits .nb-hits__tag {
	text-transform: none;
	letter-spacing: 0;
	font-style: italic;
	font-size: .95rem;
	opacity: 1;
	color: var(--muted);
	margin-bottom: .15rem;
}
.nb-hits .nb-hits__title { font-weight: 500; font-size: 1.15rem; line-height: 1.3; }
.nb-hits .nb-hits__card a:hover .nb-hits__title { text-decoration-thickness: 1px; text-underline-offset: .2em; }

/* ---------- Footer ---------- */
.site-footer {
	max-width: var(--wide);
	margin: 0 auto;
	padding: 1.75rem 1.5rem 3rem;
	background: none !important;
	border-top: 1px solid var(--rule);
	color: var(--muted);
	font-size: .95rem;
	text-align: left;
}
.site-footer a { color: var(--muted) !important; }
.footer-area { background: none; }

/* ---------- Small screens ---------- */
@media (max-width: 767px) {
	body { font-size: 18px; }
	.site-header { padding: 1.5rem 1.25rem 1rem; }
	.site-title a { font-size: 1.6rem; }
	.site-content { padding: 2.25rem 1.25rem 3.5rem; }
	.entry-content p, .entry-content li { font-size: 1.0625rem; }
	.home .wp-block-media-text__media { max-width: 14rem; }
	.home .wp-block-media-text__content { margin-top: 1.5rem; }
	.site-header { align-items: center; }
	.site-header { position: relative; }
	.main-navigation { position: static; }
	.site-header .main-navigation .menu-toggle { left: auto !important; right: 1.25rem !important; top: 1.45rem !important; margin: 0 !important; }
	.main-navigation.toggled { flex: 1 0 100%; }
	.main-navigation.toggled .menu-toggle { background: var(--ink) !important; color: var(--paper) !important; }
	.main-navigation.toggled .menu-wrapper { margin-top: 1rem; }
	.main-navigation.toggled li { margin: 0; }
	.main-navigation.toggled a { font-size: 1.25rem; padding: .6rem 0; }
	.home .wp-block-media-text__content p { font-size: 1.15rem; }
	.post-navigation .nav-links { flex-direction: column; gap: 1rem; }
	.post-navigation .nav-next { text-align: left; }
}

/* Keep from the previous custom CSS */
.home .portfolio-entry-meta { display: none; }


/* ---------- Resume + working together ---------- */
.nb-resume-links { font-style: italic; color: var(--muted); }
.nb-work-together { margin-top: 4.5rem !important; padding-top: 2.25rem; border-top: 1px solid var(--rule); }
.nb-work-together > h2:first-child, .nb-work-together .wp-block-group__inner-container > h2:first-child { margin-top: 0; }
#work-together { scroll-margin-top: 2rem; }

/* ---------- Contact ---------- */
.entry-content > .nb-contact { max-width: var(--measure); gap: 0 2.75rem; margin-bottom: 3.5rem; }
.nb-contact .wp-block-media-text__media img {
	max-width: 15rem;
	background: var(--paper);
	padding: .55rem .55rem 1.6rem;
	border-radius: 1px;
	box-shadow: 0 0 0 1px rgba(27, 30, 35, .07), 0 18px 36px -20px rgba(27, 30, 35, .45);
	transform: rotate(-2deg);
}
.nb-contact .wp-block-media-text__content { padding: 0 !important; }
.nb-contact .wp-block-media-text__content p { font-size: 1.3rem; margin: 0 0 .4rem; }
.nb-contact .wp-block-media-text__content p a { text-decoration-thickness: 1px; }

/* Contact form */
.contact-form input[type="text"], .contact-form input[type="email"], .contact-form input[type="url"], .contact-form textarea,
.wp-block-jetpack-contact-form input, .wp-block-jetpack-contact-form textarea {
	font-family: var(--serif) !important;
	font-size: 1.05rem !important;
	color: var(--ink);
	background: var(--paper);
	border: 1px solid #cfccc5 !important;
	border-radius: 2px !important;
	padding: .65rem .8rem !important;
	box-shadow: none !important;
	width: 100%;
	max-width: 100%;
}
.contact-form input:focus, .contact-form textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent) !important; }
.contact-form label, .grunion-field-label {
	font-family: var(--serif) !important;
	font-weight: 500 !important;
	font-size: 1rem !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	color: var(--ink) !important;
}
.contact-form .pushbutton-wide, .contact-form button, .contact-form input[type="submit"], .wp-block-jetpack-contact-form .wp-block-button__link {
	font-family: var(--serif) !important;
	font-size: 1.05rem !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	background: var(--ink) !important;
	color: var(--paper) !important;
	border: 0 !important;
	border-radius: 2px !important;
	padding: .7rem 1.4rem !important;
}
@media (max-width: 767px) {
	.nb-contact .wp-block-media-text__media img { max-width: 11rem; }
	.nb-contact .wp-block-media-text__content { margin-top: 1.75rem; }
}

.nb-contact .wp-block-media-text__content p.nb-contact-intro { font-size: 1.2rem; line-height: 1.5; margin-bottom: 1rem; }/* Illustration page: uniform, height-aligned grid */
.tax-jetpack-portfolio-type.term-illustration .portfolio-wrapper {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 48px 40px;
  width: auto !important;
  max-width: 1100px;
  height: auto !important; /* overrides masonry's inline height */
  margin: 0 auto;
  padding-top: 40px;
}
.tax-jetpack-portfolio-type.term-illustration .portfolio-wrapper .portfolio-entry {
  position: static !important; /* undo masonry positioning */
  left: auto !important;
  top: auto !important;
  transform: none !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
}
.tax-jetpack-portfolio-type.term-illustration .portfolio-thumbnail {
  margin-bottom: 16px;
}
.tax-jetpack-portfolio-type.term-illustration .portfolio-thumbnail a {
  display: block;
  background: #f1f2f3;
}
.tax-jetpack-portfolio-type.term-illustration .portfolio-thumbnail img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: contain;
}
@media screen and (max-width: 959px) {
  .tax-jetpack-portfolio-type.term-illustration .portfolio-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media screen and (max-width: 767px) {
  .tax-jetpack-portfolio-type.term-illustration .portfolio-wrapper {
    grid-template-columns: 1fr;
  }
}

/* ---------- Elsewhere: LinkedIn + Letterboxd ---------- */
.nb-elsewhere { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 0 0 1rem; }
.site-footer .nb-elsewhere a {
	font-family: var(--serif);
	font-size: 1.05rem;
	color: var(--ink) !important;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: .2em;
}
.nb-contact .wp-block-media-text__content p.nb-contact-social { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; font-size: 1.1rem; margin-top: .6rem; }

/* Home photo: centered once the intro stacks on phones */
@media (max-width: 600px) {
	.home .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media { margin-left: auto; margin-right: auto; justify-self: center; }
}


/* ---------- Illustrations page: Lumpenpockets tile uses the homepage carousel image (Zines page keeps the featured image) ---------- */
.term-illustration .post-3659 .portfolio-thumbnail a {
	display: block;
	background: url(https://nickbachan.com/wp-content/uploads/2023/01/simple-scanned.png) center / cover no-repeat;
}
.term-illustration .post-3659 .portfolio-thumbnail img { opacity: 0; }

/* Illustrations page: Kajal Mag tile shows the illustrated pages (Zines page keeps the cover) */
.term-illustration .post-2651 .portfolio-thumbnail a {
	display: block;
	background: url(https://nickbachan.com/wp-content/uploads/2026/10/kajal-mag-illustrated-pages-cover.png) center / cover no-repeat;
}
.term-illustration .post-2651 .portfolio-thumbnail img { opacity: 0; }