/*
Theme Name: New News
Theme URI: https://example.com/new-news
Author: New News
Description: A premium, modern block theme for news publishers. Centered masthead, ticker, hero top stories, latest feed, category sections, a video strip, and a refined article layout. Fully editable in the Site Editor.
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.2.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: new-news
Tags: news, blog, block-patterns, full-site-editing, wide-blocks, custom-colors, editor-style, translation-ready
*/

:root {
	--nn-pad: clamp(1rem, 4vw, 2.5rem);
	--nn-gap: clamp(1.5rem, 3vw, 2.75rem);
	--nn-radius: 4px;
	--nn-radius-lg: 10px;
}

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden; }
img { height: auto; max-width: 100%; }
.wp-site-blocks > * + * { margin-block-start: 0; }
:focus-visible { outline: 3px solid var(--wp--preset--color--cobalt); outline-offset: 2px; }

/* ---------- Shared bits ---------- */
.wp-block-post-date { font-size: .8125rem; color: var(--wp--preset--color--muted); margin: 0; }
.nn-kicker { margin: 0; font-size: .8125rem; font-weight: 700; letter-spacing: .01em; }
.nn-kicker a { color: var(--wp--preset--color--cobalt); text-decoration: none; }
.nn-kicker a:hover { text-decoration: underline; }
.wp-block-post-featured-image { margin: 0; overflow: hidden; border-radius: var(--nn-radius); }
.wp-block-post-featured-image img { display: block; width: 100%; }
.wp-block-post-title a { color: inherit; text-decoration: none; }
.wp-block-post-title a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.wp-block-post-excerpt { color: var(--wp--preset--color--muted); }
.wp-block-post-excerpt__excerpt { margin: 0; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	.wp-block-post-featured-image img { transition: transform .6s cubic-bezier(.2,.6,.2,1); }
	.wp-block-post-featured-image a:hover img { transform: scale(1.035); }
}

/* ---------- Header: centered masthead (not sticky) ---------- */
.nn-masthead { background: var(--wp--preset--color--surface); padding-inline: var(--nn-pad); }
.nn-masthead-row { padding-block: 1.5rem 1.35rem; gap: 1rem; }
.nn-masthead-row > .wp-block-search { flex: 1 1 0; display: flex; justify-content: flex-start; margin: 0; }
.nn-masthead-row > .nn-live { flex: 1 1 0; justify-content: flex-end; margin: 0; }
.nn-brand { gap: .35rem; text-align: center; flex: 0 1 auto; }
.nn-logo { margin: 0; font-size: clamp(1.9rem, 1.2rem + 3vw, 3.1rem); font-weight: 900; letter-spacing: -.055em; line-height: 1; }
.nn-logo a { color: var(--wp--preset--color--navy); text-decoration: none; }
.nn-brand .nn-tagline { margin: 0; font-size: .8125rem; color: var(--wp--preset--color--muted); letter-spacing: .01em; }
.nn-masthead .wp-block-search__button { background: transparent; color: var(--wp--preset--color--ink); padding: .5rem; margin: 0; }
.nn-masthead .wp-block-search__inside-wrapper { border: 0; padding: 0; }

.nn-live .wp-block-button__link {
	position: relative; background: var(--wp--preset--color--live); color: #fff;
	padding: .4rem 1rem .4rem 1.85rem; font-size: .8125rem; font-weight: 700;
	line-height: 1.4; border-radius: 999px; text-decoration: none; white-space: nowrap;
}
.nn-live .wp-block-button__link::before {
	content: ""; position: absolute; left: .85rem; top: 50%; width: .5rem; height: .5rem;
	margin-top: -.25rem; border-radius: 50%; background: #fff;
}
@media (prefers-reduced-motion: no-preference) {
	.nn-live .wp-block-button__link::before { animation: nn-pulse 1.8s ease-out infinite; }
}
@keyframes nn-pulse {
	0% { box-shadow: 0 0 0 0 rgba(255,255,255,.75); }
	70%, 100% { box-shadow: 0 0 0 .5rem rgba(255,255,255,0); }
}

.nn-navbar { background: var(--wp--preset--color--navy); border-bottom: 3px solid var(--wp--preset--color--gold); padding-inline: var(--nn-pad); }
.nn-navbar .wp-block-navigation { width: 100%; min-height: 3rem; }
.nn-navbar .wp-block-navigation__container { gap: .25rem 1.75rem; }
.nn-navbar .wp-block-navigation-item__content {
	padding: .85rem .1rem; font-weight: 600; font-size: .9375rem; letter-spacing: .005em;
	color: #fff; text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -2px;
}
.nn-navbar .wp-block-navigation-item__content:hover { border-bottom-color: var(--wp--preset--color--gold); }
.nn-navbar .wp-block-navigation__responsive-container-open,
.nn-navbar .wp-block-navigation__responsive-container-close { color: #fff; }
.nn-navbar .wp-block-navigation__responsive-container.is-menu-open { padding: 1.5rem var(--nn-pad); }
.nn-navbar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.25rem; padding-block: .6rem; }

@media (max-width: 599px) {
	.nn-masthead-row { padding-block: 1rem; }
	.nn-brand .nn-tagline { display: none; }
	.nn-navbar .wp-block-navigation { justify-content: flex-start; }
	.nn-live .wp-block-button__link { padding: .3rem .75rem .3rem 1.6rem; }
	.nn-live .wp-block-button__link::before { left: .7rem; }
}

/* ---------- Ticker ---------- */
.nn-ticker { background: var(--wp--preset--color--surface); border-bottom: 1px solid var(--wp--preset--color--line); padding-inline: var(--nn-pad); }
.nn-ticker-row { gap: 1.25rem; padding-block: .7rem; }
.nn-ticker-label { margin: 0; flex: none; font-weight: 800; font-size: .8125rem; color: var(--wp--preset--color--live); padding-inline-end: 1.25rem; border-inline-end: 1px solid var(--wp--preset--color--line); }
.nn-ticker-q { min-width: 0; flex: 1; }
.nn-ticker .wp-block-post-template { display: flex; gap: 2.25rem; list-style: none; margin: 0; padding: 0; overflow-x: auto; scrollbar-width: none; }
.nn-ticker .wp-block-post-template::-webkit-scrollbar { display: none; }
.nn-ticker .wp-block-post-template > li { flex: none; margin: 0; }
.nn-ticker-title { margin: 0; font-size: .875rem; font-weight: 600; white-space: nowrap; }

/* ---------- Main + sections ---------- */
.nn-main { padding-inline: var(--nn-pad); padding-block: 2.5rem 4rem; }
.nn-section { margin-block-start: 4.5rem; }
.nn-section-head { position: relative; border-top: 1px solid var(--wp--preset--color--line); padding-top: 1rem; margin-block-end: 1.5rem; gap: 1rem; }
.nn-section-head::before { content: ""; position: absolute; top: -2px; left: 0; width: 3.5rem; height: 3px; background: var(--wp--preset--color--gold); }
.nn-section-title { margin: 0; font-size: 1.5rem; color: var(--wp--preset--color--navy); }
.nn-more { margin: 0; font-size: .875rem; font-weight: 600; }
.nn-more a { text-decoration: none; }
.nn-more a:hover { text-decoration: underline; }
.wp-block-columns.nn-section-cols,
.wp-block-columns.nn-hero,
.wp-block-columns.nn-latest-cols { gap: var(--nn-gap); }

/* Hero */
.nn-hero-lead .wp-block-post-featured-image { border-radius: var(--nn-radius-lg); }
.nn-hero-title { margin-block: .7rem .75rem; font-size: clamp(2.1rem, 1.3rem + 3vw, 3.5rem); line-height: 1.06; letter-spacing: -.04em; }
.nn-hero-lead .wp-block-post-excerpt { font-family: var(--wp--preset--font-family--serif); font-size: 1.1875rem; line-height: 1.6; margin-bottom: .6rem; }
.nn-hero-side { border-inline-start: 1px solid var(--wp--preset--color--line); padding-inline-start: var(--nn-gap); }
.nn-hero-side .nn-section-title { font-size: 1.125rem; padding-bottom: .9rem; border-bottom: 1px solid var(--wp--preset--color--line); margin-bottom: 0; }
@media (max-width: 781px) {
	.nn-hero-side { border: 0; padding: 0; margin-top: 1rem; }
	.nn-section { margin-block-start: 3rem; }
	.nn-main { padding-block: 1.5rem 3rem; }
}

/* Lead cards and rows */
.nn-lead-title { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.1rem); line-height: 1.12; margin-block: .5rem .6rem; letter-spacing: -.035em; }
.nn-lead .wp-block-post-excerpt { margin-bottom: .6rem; }
.nn-row { gap: 1.1rem; padding-block: 1.15rem; border-bottom: 1px solid var(--wp--preset--color--line); }
.wp-block-post-template > li:last-child .nn-row { border-bottom: 0; }
.nn-row .wp-block-post-featured-image { flex: 0 0 120px; max-width: 120px; }
.nn-row-body { flex: 1; min-width: 0; gap: .35rem; }
.nn-row-title { margin: 0; font-size: 1.0625rem; line-height: 1.3; letter-spacing: -.015em; font-weight: 700; }
.nn-feed .nn-row { padding-block: 1.4rem; }
.nn-feed .nn-row .wp-block-post-featured-image { flex-basis: 200px; max-width: 200px; }
.nn-feed .nn-row-title { font-size: 1.375rem; letter-spacing: -.025em; }
@media (max-width: 600px) {
	.nn-row .wp-block-post-featured-image { flex-basis: 104px; max-width: 104px; }
	.nn-feed .nn-row .wp-block-post-featured-image { flex-basis: 104px; max-width: 104px; }
	.nn-feed .nn-row-title { font-size: 1.0625rem; }
	.nn-feed .wp-block-post-excerpt { display: none; }
}
.nn-compact-item { padding-block: 1rem; border-bottom: 1px solid var(--wp--preset--color--line); gap: .3rem; }
.nn-compact .wp-block-post-template > li:last-child .nn-compact-item { border-bottom: 0; }
.nn-side { border-inline-start: 1px solid var(--wp--preset--color--line); padding-inline-start: var(--nn-gap); }
@media (max-width: 781px) { .nn-side { border: 0; padding: 0; } }

/* Watch strip */
.nn-watch { background: var(--wp--preset--color--navy); color: #fff; border-radius: var(--nn-radius-lg); padding: clamp(1.5rem, 4vw, 2.5rem); }
.nn-watch a, .nn-watch .wp-block-post-date, .nn-watch .nn-section-title { color: #fff; }
.nn-watch .wp-block-post-date { opacity: .7; }
.nn-watch .nn-section-head { border-top-color: rgba(255,255,255,.2); }
.nn-watch .nn-watch-title { margin: .6rem 0 .25rem; font-size: 1.0625rem; line-height: 1.3; }

/* Cards (archive, search, index, keep reading) */
.nn-card { gap: .5rem; }
.nn-card .wp-block-post-title { margin: .15rem 0 0; font-size: 1.3rem; letter-spacing: -.025em; }
.nn-card .wp-block-post-excerpt { font-size: .95rem; }
.nn-archive-head { position: relative; border-bottom: 1px solid var(--wp--preset--color--line); padding-bottom: 1.5rem; margin-bottom: 2.5rem; }
.nn-archive-head::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 3.5rem; height: 3px; background: var(--wp--preset--color--gold); }
.nn-archive-head .wp-block-query-title { margin: 0; font-size: clamp(2.2rem, 1.4rem + 3vw, 3.4rem); letter-spacing: -.04em; color: var(--wp--preset--color--navy); }
.nn-archive-head .wp-block-term-description { color: var(--wp--preset--color--muted); margin-top: .6rem; }

/* Pagination */
.wp-block-query-pagination { margin-top: 3rem; gap: .5rem; font-weight: 600; }
.wp-block-query-pagination a { text-decoration: none; color: var(--wp--preset--color--ink); }
.wp-block-query-pagination .page-numbers { padding: .4rem .8rem; border-radius: 999px; }
.wp-block-query-pagination .page-numbers.current { background: var(--wp--preset--color--navy); color: #fff; }

/* Search */
.wp-block-search__button { background: var(--wp--preset--color--navy); color: #fff; border: 0; border-radius: 999px; }
.wp-block-search__input { border: 1px solid var(--wp--preset--color--line); border-radius: 999px; padding: .6rem 1.1rem; background: var(--wp--preset--color--surface); }

/* ---------- Single article ---------- */
.nn-single { padding-block-start: .5rem; }
.nn-single .wp-block-post-title { margin: .5rem 0 1.25rem; letter-spacing: -.04em; line-height: 1.06; color: var(--wp--preset--color--navy); }
.nn-byline { gap: .35rem 1.5rem; color: var(--wp--preset--color--muted); font-size: .9rem; border-block: 1px solid var(--wp--preset--color--line); padding-block: .85rem; margin-bottom: 2rem; }
.nn-byline p, .nn-byline .wp-block-post-author-name { margin: 0; font-size: inherit; }
.nn-byline-by { display: flex; gap: .3rem; }
.nn-byline .wp-block-post-author-name { color: var(--wp--preset--color--ink); font-weight: 600; }
.nn-single .wp-block-post-featured-image { border-radius: var(--nn-radius-lg); }
.nn-article { font-family: var(--wp--preset--font-family--serif); font-size: 1.1875rem; line-height: 1.8; margin-top: 2.25rem; }
.nn-article a { text-decoration: underline; text-underline-offset: .18em; }
.nn-article > p:first-child::first-letter { font-size: 3.4em; font-weight: 700; float: left; line-height: .85; padding: .08em .1em 0 0; color: var(--wp--preset--color--navy); }
.nn-article blockquote { border-inline-start: 3px solid var(--wp--preset--color--gold); margin-inline: 0; padding-inline-start: 1.5rem; font-size: 1.35rem; font-style: italic; }
.nn-article h2, .nn-article h3 { font-family: var(--wp--preset--font-family--sans); color: var(--wp--preset--color--navy); }
.nn-tags { margin-top: 2.25rem; font-size: .9rem; }
.nn-postnav { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--wp--preset--color--line); gap: 1.5rem; font-weight: 600; }
.nn-postnav a { text-decoration: none; }
.wp-block-comments { margin-top: 3.5rem; }

/* ---------- Footer ---------- */
.nn-footer { background: var(--wp--preset--color--navy); color: #bcc8e3; border-top: 4px solid var(--wp--preset--color--gold); padding: 4rem var(--nn-pad) 2rem; margin-top: 5rem; }
.nn-footer a { color: #fff; text-decoration: none; }
.nn-footer a:hover { text-decoration: underline; }
.nn-footer .wp-block-columns { gap: var(--nn-gap); }
.nn-footer .nn-logo { font-size: 2.2rem; }
.nn-footer .nn-logo a { color: #fff; }
.nn-foot-title { font-size: .95rem; color: #fff; margin: 0 0 1rem; }
.nn-foot-about { max-width: 34ch; margin: .9rem 0 1.25rem; }
.nn-foot-nav .wp-block-navigation-item__content { padding: .25rem 0; }
.nn-footer-base { border-top: 1px solid rgba(255,255,255,.16); margin-top: 3rem; padding-top: 1.5rem; font-size: .8125rem; }
.nn-footer-base p { margin: 0; }

@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }

/* ---------- Homepage slideshow ---------- */
.nn-slider { position: relative; }
.nn-slider .wp-block-post-template {
	display: flex; gap: 0; margin: 0; padding: 0; list-style: none;
	overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
	overscroll-behavior-x: contain; border-radius: var(--nn-radius-lg);
}
.nn-slider .wp-block-post-template::-webkit-scrollbar { display: none; }
.nn-slider .wp-block-post-template > li { flex: 0 0 100%; min-width: 0; margin: 0; scroll-snap-align: start; scroll-snap-stop: always; }
.nn-slide { position: relative; background: var(--wp--preset--color--navy); min-height: min(60vw, 22rem); }
.nn-slide .wp-block-post-featured-image { border-radius: 0; margin: 0; }
.nn-slide .wp-block-post-featured-image a { display: block; }
.nn-slide .wp-block-post-featured-image img { aspect-ratio: 16 / 10 !important; height: 100%; object-fit: cover; }
.nn-slide-caption {
	position: absolute; inset: auto 0 0 0; gap: .4rem; color: #fff;
	padding: 4.5rem clamp(1.1rem, 3vw, 2rem) 3.75rem;
	background: linear-gradient(to top, rgba(6,18,48,.92) 0%, rgba(6,18,48,.55) 55%, rgba(6,18,48,0) 100%);
}
.nn-slide .nn-kicker a { color: var(--wp--preset--color--gold); }
.nn-slide .nn-slide-title { margin: 0; color: #fff; font-size: clamp(1.5rem, 1rem + 2.2vw, 2.6rem); line-height: 1.1; letter-spacing: -.035em; text-wrap: balance; }
.nn-slide .nn-slide-title a { color: #fff; }
.nn-slide .wp-block-post-date { color: rgba(255,255,255,.8); }

.nn-slider-ui {
	position: absolute; inset: auto 0 0 0; z-index: 2; display: flex; align-items: center;
	justify-content: space-between; gap: 1rem; padding: 0 clamp(1.1rem, 3vw, 2rem) 1rem; pointer-events: none;
}
.nn-slider-ui > * { pointer-events: auto; }
.nn-slider-dots { display: flex; gap: .5rem; }
.nn-slider-dot {
	position: relative; width: .55rem; height: .55rem; padding: 0; border: 0; border-radius: 999px;
	background: rgba(255,255,255,.55); cursor: pointer;
}
.nn-slider-dot::before { content: ""; position: absolute; inset: -.7rem -.25rem; }
.nn-slider-dot[aria-current="true"] { width: 1.7rem; background: var(--wp--preset--color--gold); }
.nn-slider-arrows { display: flex; gap: .5rem; }
.nn-slider-btn {
	display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; padding: 0;
	border: 1px solid rgba(255,255,255,.35); border-radius: 50%; color: #fff; cursor: pointer;
	background: rgba(6,18,48,.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.nn-slider-btn:hover { background: var(--wp--preset--color--gold); border-color: var(--wp--preset--color--gold); color: var(--wp--preset--color--navy); }
@media (prefers-reduced-motion: no-preference) {
	.nn-slider-dot { transition: width .3s ease, background .3s ease; }
	.nn-slider-btn { transition: background .2s ease, color .2s ease; }
}
@media (max-width: 599px) {
	.nn-slide .wp-block-post-featured-image img { aspect-ratio: 4 / 5 !important; }
	.nn-slider-prev, .nn-slider-next { display: none; }
	.nn-slide-caption { padding-top: 3.5rem; }
}

/* ---------- Share buttons ---------- */
.nn-share { gap: .6rem 1rem; margin-block: 1.5rem; }
.nn-share-label { margin: 0; font-size: .875rem; font-weight: 700; color: var(--wp--preset--color--navy); }
.nn-share .wp-block-social-links { gap: .5rem; margin: 0; }
.nn-share .wp-block-social-links .wp-social-link {
	background: transparent !important; color: var(--wp--preset--color--navy) !important;
	border: 1px solid var(--wp--preset--color--line); border-radius: 50%; margin: 0;
}
.nn-share .wp-block-social-links .wp-social-link a { padding: .6rem; color: inherit; }
.nn-share .wp-block-social-links .wp-social-link:hover { background: var(--wp--preset--color--navy) !important; color: #fff !important; border-color: var(--wp--preset--color--navy); }
.nn-share .nn-copy { margin: 0; }
.nn-copy-link .wp-block-button__link {
	background: transparent; color: var(--wp--preset--color--navy); border: 1px solid var(--wp--preset--color--line);
	padding: .6rem 1.1rem; line-height: 1.2;
}
.nn-copy-link .wp-block-button__link:hover { background: var(--wp--preset--color--navy); color: #fff; border-color: var(--wp--preset--color--navy); }
@media (prefers-reduced-motion: no-preference) {
	.nn-share .wp-social-link, .nn-copy-link .wp-block-button__link { transition: background .2s ease, color .2s ease; }
}
