/*
Theme Name: Nebula
Theme URI: https://stargatedev.ovh/
Author: StarGate Dev
Author URI: https://stargatedev.ovh/
Description: Premium clean blog theme with GeneratePress-like spacing, stable header/footer and featured image fallbacks.
Version: 3.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
Text Domain: nebula
*/

:root {
  --twpf-primary: #101828;
  --twpf-accent: #4f46e5;
  --twpf-accent-soft: #e8e7ff;
  --twpf-bg: #f5f7fb;
  --twpf-surface: #ffffff;
  --twpf-text: #101828;
  --twpf-muted: #667085;
  --twpf-border: rgba(15, 23, 42, 0.08);
  --twpf-shadow: 0 16px 42px rgba(15, 23, 42, 0.08);
  --twpf-radius: 24px;
  --twpf-radius-sm: 18px;
  --twpf-content-max: 860px;
  --twpf-wide-max: 1380px;
  --twpf-shell-width: min(var(--twpf-wide-max), calc(100vw - 32px));
  --twpf-archive-columns: 1;
  --twpf-sidebar-width: 320px;
  --twpf-card-ratio: 16 / 9;
  --twpf-hero-max-height: 520px;
  --twpf-footer-cols: repeat(3, minmax(0, 1fr));
}

html { scroll-behavior: smooth; }
body { background: var(--twpf-bg); color: var(--twpf-text); }
a { color: var(--twpf-accent); text-decoration: none; }
a:hover { color: var(--twpf-primary); }
.wp-site-blocks { min-height: 100vh; display: flex; flex-direction: column; }
.twpf-container { width: var(--twpf-shell-width); max-width: 100%; margin: 0 auto; padding-inline: clamp(8px, 1.6vw, 22px); box-sizing: border-box; }
.twpf-shell { flex: 1; padding-top: clamp(18px, 3vw, 34px); padding-bottom: clamp(40px, 6vw, 84px); }
.twpf-shell > * + * { margin-top: 0; }
.twpf-surface { background: color-mix(in srgb, var(--twpf-surface) 98%, transparent); }

.twpf-header { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid var(--twpf-border); backdrop-filter: saturate(140%) blur(10px); }
.twpf-header-inner { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 24px; min-height: 76px; }
.twpf-brand { display: inline-flex; align-items: center; gap: 12px; min-width: 0; }
.twpf-brand .wp-block-site-logo { margin: 0; flex: 0 0 auto; }
.twpf-brand .wp-block-site-title { margin: 0; font-size: clamp(1.25rem, 2vw, 1.65rem); font-weight: 700; line-height: 1.1; }
.twpf-primary-nav { justify-self: end; min-width: 0; width: 100%; }
.twpf-primary-nav .wp-block-navigation__container { gap: 8px 18px; justify-content: flex-end; flex-wrap: wrap; align-items: center; }
.twpf-primary-nav .wp-block-navigation-item__content { padding: 8px 12px; border-radius: 999px; font-size: 0.96rem; font-weight: 500; transition: background-color .2s ease, color .2s ease, border-color .2s ease; white-space: nowrap; }
body.twpf-menu-style-clean .twpf-primary-nav .wp-block-navigation-item__content:hover,
body.twpf-menu-style-compact .twpf-primary-nav .wp-block-navigation-item__content:hover { background: var(--twpf-accent-soft); }
body.twpf-menu-style-pills .twpf-primary-nav .wp-block-navigation-item__content { background: var(--twpf-accent-soft); }
body.twpf-menu-style-pills .twpf-primary-nav .wp-block-navigation-item__content:hover { background: color-mix(in srgb, var(--twpf-accent-soft) 74%, #fff); }
body.twpf-menu-style-underline .twpf-primary-nav .wp-block-navigation-item__content { border-bottom: 2px solid transparent; border-radius: 0; padding-inline: 8px; }
body.twpf-menu-style-underline .twpf-primary-nav .wp-block-navigation-item__content:hover { border-bottom-color: color-mix(in srgb, var(--twpf-accent) 45%, transparent); }
body.twpf-menu-style-solid .twpf-primary-nav .wp-block-navigation-item__content { background: var(--twpf-primary); color: #fff; }
body.twpf-menu-style-solid .twpf-primary-nav .wp-block-navigation-item__content:hover { background: color-mix(in srgb, var(--twpf-primary) 90%, #fff); }
body.twpf-menu-align-left .twpf-header-inner { grid-template-columns: minmax(0,1fr) auto; }
body.twpf-menu-align-left .twpf-brand { order: 2; justify-self: end; }
body.twpf-menu-align-left .twpf-primary-nav { order: 1; justify-self: start; }
body.twpf-menu-align-center .twpf-primary-nav .wp-block-navigation__container { justify-content: center; }
body.twpf-menu-align-right .twpf-primary-nav .wp-block-navigation__container { justify-content: flex-end; }

.twpf-page-header { margin-bottom: 22px; }
.twpf-page-header .wp-block-query-title,
.twpf-page-header h1 { margin: 0 0 10px; font-size: clamp(2rem, 5vw, 3.2rem); line-height: 1.05; }
.twpf-page-header p { margin: 0; color: var(--twpf-muted); font-size: 1rem; }
.twpf-layout-shell { display: grid !important; grid-template-columns: minmax(0, 1fr) var(--twpf-sidebar-width); gap: clamp(22px, 3vw, 36px); align-items: start; }
.twpf-layout-shell > .wp-block-column { min-width: 0; margin: 0 !important; }
.twpf-main-content { min-width: 0; }
.twpf-main-content > * + * { margin-block-start: 0; }
.twpf-sidebar-shell { min-width: 0; }
.twpf-sidebar-shell .twpf-sidebar { position: sticky; top: 96px; display: grid; gap: 16px; }
.twpf-sidebar-shell .twpf-sidebar > * { margin: 0; padding: 18px; background: var(--twpf-surface); border: 1px solid var(--twpf-border); border-radius: var(--twpf-radius-sm); box-shadow: var(--twpf-shadow); }
body.twpf-layout-no-sidebar .twpf-layout-shell { grid-template-columns: minmax(0,1fr); }
body.twpf-layout-no-sidebar .twpf-sidebar-shell { display: none; }
body.twpf-layout-sidebar-left .twpf-layout-shell { grid-template-columns: var(--twpf-sidebar-width) minmax(0, 1fr); }
body.twpf-layout-sidebar-left .twpf-sidebar-shell { order: 1; }
body.twpf-layout-sidebar-left .twpf-main-content { order: 2; }
body.twpf-layout-sidebar-right .twpf-sidebar-shell { order: 2; }
body.twpf-layout-sidebar-right .twpf-main-content { order: 1; }

.twpf-query .wp-block-post-template { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(var(--twpf-archive-columns), minmax(0, 1fr)); gap: clamp(18px, 2vw, 28px); }
body.twpf-archive-columns-1 { --twpf-archive-columns: 1; }
body.twpf-archive-columns-2 { --twpf-archive-columns: 2; }
body.twpf-archive-columns-3 { --twpf-archive-columns: 3; }
.twpf-post-card { height: 100%; display: grid; grid-template-rows: auto auto 1fr; gap: 14px; padding: clamp(16px, 2vw, 24px); background: var(--twpf-surface); border: 1px solid var(--twpf-border); border-radius: var(--twpf-radius); box-shadow: var(--twpf-shadow); overflow: hidden; }
.twpf-post-card .wp-block-post-featured-image { margin: 0; }
.twpf-post-card .wp-block-post-featured-image a,
.twpf-post-card .twpf-fallback-thumb { display: block; width: 100%; border-radius: 18px; overflow: hidden; background: linear-gradient(180deg, #eef2ff, color-mix(in srgb, var(--twpf-accent-soft) 75%, #fff)); }
.twpf-post-card .wp-block-post-featured-image img,
.twpf-post-card .twpf-fallback-thumb img { display: block; width: 100%; aspect-ratio: var(--twpf-card-ratio); object-fit: cover; }
.twpf-post-card .wp-block-post-title { margin: 0; font-size: clamp(1.3rem, 2vw, 1.85rem); line-height: 1.12; }
.twpf-post-card .wp-block-post-excerpt,
.twpf-post-card .wp-block-post-excerpt p { color: var(--twpf-muted); margin-bottom: 0; }
.twpf-post-meta { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 0.92rem; color: var(--twpf-muted); }
body.twpf-excerpt-image-contain .twpf-post-card .wp-block-post-featured-image img,
body.twpf-excerpt-image-contain .twpf-post-card .twpf-fallback-thumb img { object-fit: contain; background: #edf2f7; }
body.twpf-excerpt-image-natural .twpf-post-card .wp-block-post-featured-image img,
body.twpf-excerpt-image-natural .twpf-post-card .twpf-fallback-thumb img { aspect-ratio: auto; height: auto; object-fit: contain; }
body.twpf-excerpt-image-hidden .twpf-post-card .wp-block-post-featured-image,
body.twpf-excerpt-image-hidden .twpf-post-card .twpf-featured-fallback { display: none; }
body.twpf-excerpt-ratio-landscape { --twpf-card-ratio: 4 / 3; }
body.twpf-excerpt-ratio-wide { --twpf-card-ratio: 16 / 9; }
body.twpf-excerpt-ratio-square { --twpf-card-ratio: 1 / 1; }
body.twpf-excerpt-ratio-portrait { --twpf-card-ratio: 4 / 5; }
.twpf-pagination { margin-top: 22px; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.twpf-pagination .wp-block-query-pagination-numbers { display: flex; gap: 8px; flex-wrap: wrap; }

.twpf-entry { padding: clamp(20px, 3vw, 34px); background: var(--twpf-surface); border: 1px solid var(--twpf-border); border-radius: clamp(22px, 3vw, 30px); box-shadow: var(--twpf-shadow); }
.twpf-entry > *:first-child { margin-top: 0; }
.twpf-entry-hero { margin: 0 0 24px; }
.twpf-entry-hero .wp-block-post-featured-image,
.twpf-entry-hero .twpf-featured-fallback { margin: 0; }
.twpf-entry-hero .wp-block-post-featured-image img,
.twpf-entry-hero .twpf-fallback-thumb img { display: block; width: 100%; aspect-ratio: 16 / 9; max-height: var(--twpf-hero-max-height); object-fit: cover; background: #edf2f7; border-radius: 24px; overflow: hidden; }
body.twpf-hero-image-contain .twpf-entry-hero .wp-block-post-featured-image img,
body.twpf-hero-image-contain .twpf-entry-hero .twpf-fallback-thumb img { object-fit: contain; }
body.twpf-hero-image-natural .twpf-entry-hero .wp-block-post-featured-image img,
body.twpf-hero-image-natural .twpf-entry-hero .twpf-fallback-thumb img { aspect-ratio: auto; max-height: none; object-fit: contain; }
body.twpf-hero-image-hidden .twpf-entry-hero { display: none; }
body.twpf-hero-height-small { --twpf-hero-max-height: 320px; }
body.twpf-hero-height-medium { --twpf-hero-max-height: 520px; }
body.twpf-hero-height-large { --twpf-hero-max-height: 680px; }

.twpf-footer { margin-top: auto; padding: clamp(30px, 5vw, 56px) 0 24px; border-top: 1px solid var(--twpf-border); }
.twpf-footer-grid { display: grid; grid-template-columns: var(--twpf-footer-cols); gap: clamp(16px, 2vw, 28px); }
body.twpf-footer-columns-2 { --twpf-footer-cols: repeat(2, minmax(0, 1fr)); }
body.twpf-footer-columns-3 { --twpf-footer-cols: repeat(3, minmax(0, 1fr)); }
body.twpf-footer-columns-4 { --twpf-footer-cols: repeat(4, minmax(0, 1fr)); }
.twpf-footer-card { min-width: 0; padding: 18px; background: var(--twpf-surface); border: 1px solid var(--twpf-border); border-radius: 20px; box-shadow: var(--twpf-shadow); }
.twpf-footer-card h6, .twpf-footer-card p { margin-top: 0; }
.twpf-footer-card .wp-block-navigation__container { gap: 8px 12px; }
.twpf-footer-card form,
.twpf-footer-card .tnp-subscription,
.twpf-footer-card .wpforms-container,
.twpf-footer-card .mc4wp-form,
.twpf-footer-card .wp-block-shortcode,
.twpf-footer-card .wp-block-search,
.twpf-footer-card .wp-block-group { max-width: 100%; width: 100%; min-width: 0; box-sizing: border-box; }
.twpf-footer-card input[type="email"], .twpf-footer-card input[type="text"], .twpf-footer-card input[type="search"], .twpf-footer-card textarea, .twpf-footer-card button, .twpf-footer-card input[type="submit"] { width: 100%; max-width: 100%; box-sizing: border-box; }
.twpf-footer-bottom { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--twpf-border); display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; color: var(--twpf-muted); font-size: 0.95rem; }

.twpf-topbar { font-size: 0.92rem; color: var(--twpf-muted); }
.twpf-search-lite .wp-block-search__inside-wrapper { border-radius: 999px; overflow: hidden; }

@media (max-width: 1100px) {
  body.twpf-archive-columns-3 { --twpf-archive-columns: 2; }
  .twpf-layout-shell { grid-template-columns: minmax(0, 1fr); }
  .twpf-sidebar-shell { display: none; }
}

@media (max-width: 820px) {
  .twpf-header-inner { grid-template-columns: 1fr; gap: 12px; }
  .twpf-primary-nav { justify-self: stretch; }
  .twpf-primary-nav .wp-block-navigation__container { justify-content: flex-start !important; }
  .twpf-footer-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 700px) {
  body.twpf-archive-columns-2, body.twpf-archive-columns-3 { --twpf-archive-columns: 1; }
  .twpf-container { width: min(var(--twpf-wide-max), calc(100vw - 18px)); padding-inline: 6px; }
  .twpf-post-card, .twpf-entry, .twpf-footer-card, .twpf-sidebar-shell .twpf-sidebar > * { border-radius: 18px; }
}
