/*
Theme Name: BigFish Journal
Theme URI: https://bigfish.deals/blog/
Author: BigFish
Author URI: https://bigfish.deals/
Description: The BigFish landing's typography, rounded cards, soft gradients and floating navigation, adapted for a native WordPress publication.
Version: 1.0.1
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bigfish-journal
Tags: blog, full-site-editing, block-patterns, wide-blocks, custom-colors, custom-logo, featured-images, editor-style, translation-ready
*/

* { box-sizing: border-box; }
html { scroll-padding-top: 104px; }
body {
  margin: 0;
  background: radial-gradient(1100px 560px at 88% -80px, #e3ebff 0%, transparent 70%), radial-gradient(800px 480px at 105% 260px, #fff2e4 0%, transparent 70%), var(--wp--preset--color--canvas);
  -webkit-font-smoothing: antialiased;
  font-variant-numeric: tabular-nums;
}
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block-start: 0; }
:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible { outline: 3px solid #2f5ad6; outline-offset: 4px; }
a { text-underline-offset: .18em; }
img { max-inline-size: 100%; height: auto; }
.bfjr-shell { inline-size: min(100% - 48px, 1280px); margin-inline: auto; }
.bfjr-header { position: sticky; inset-block-start: 0; z-index: 30; padding-block-start: 16px; }
.admin-bar .bfjr-header { inset-block-start: 32px; }
.bfjr-nav {
  min-block-size: 60px; padding: 10px 12px 10px 22px; gap: 24px;
  background: rgb(255 255 255 / 90%); backdrop-filter: blur(12px);
  border-radius: 999px; box-shadow: 0 1px 2px rgb(20 40 90 / 5%), 0 8px 24px rgb(20 40 90 / 6%);
}
.bfjr-logo { flex: 0 0 auto; margin: 0; }
.bfjr-logo img { display: block; inline-size: 136px; block-size: 30px; }
.bfjr-nav .wp-block-navigation { margin-inline-end: auto; font-size: 14px; font-weight: 600; }
.bfjr-nav .wp-block-navigation__container { gap: 24px; }
.bfjr-nav .wp-block-navigation a { text-decoration: none; }
.bfjr-nav .wp-block-navigation a:hover { color: var(--wp--preset--color--link); }
.bfjr-nav .bfjr-current { color: var(--wp--preset--color--link); }
.bfjr-nav .wp-block-button__link { border-radius: 999px; padding: 10px 18px; font-size: 14px; white-space: nowrap; }
.bfjr-home { padding-block-start: 56px; }
.bfjr-hero { gap: 40px; align-items: center !important; }
.bfjr-hero-copy > * + * { margin-block-start: 24px; }
.bfjr-eyebrow { display: inline-block; inline-size: fit-content; padding: 6px 12px; background: #fff; color: #2f5ad6; border-radius: 999px; font-size: 13px; line-height: 1.5; font-weight: 700; box-shadow: 0 1px 2px rgb(20 40 90 / 5%); }
.bfjr-hero h1 { font-size: clamp(44px, 5.2vw, 72px); line-height: 1.05; letter-spacing: -.045em; font-weight: 800; text-wrap: balance; }
.bfjr-hero h1 span { color: var(--wp--preset--color--link); }
.bfjr-intro { max-inline-size: 46ch; color: var(--wp--preset--color--muted); font-size: 18px; line-height: 1.65; text-wrap: pretty; }
.bfjr-hero-image { margin: 0; }
.bfjr-hero-image img { inline-size: 100%; display: block; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 28px; background: #edf2ff; box-shadow: 0 1px 2px rgb(20 40 90 / 5%), 0 20px 48px rgb(20 40 90 / 8%); }
.bfjr-topics { margin-block-start: 40px; padding: 18px 22px; gap: 10px 24px; background: #fff; border-radius: 20px; font-size: 13px; }
.bfjr-topics p { margin: 0; }
.bfjr-topics strong { color: var(--wp--preset--color--ink); }
.bfjr-section { padding-block-start: 72px; }
.bfjr-section-heading { gap: 20px; align-items: center; margin-block-end: 24px; }
.bfjr-section-heading h2 { margin: 0; font-size: clamp(28px, 3.2vw, 36px); letter-spacing: -.035em; }
.bfjr-section-heading .wp-block-search { inline-size: min(100%, 320px); }
.wp-block-search__inside-wrapper { padding: 4px; background: #fff; border: 1px solid #d3dbea; border-radius: 999px; }
.wp-block-search__input { min-inline-size: 0; border: 0; background: transparent; border-radius: 999px; padding-inline: 12px; font: inherit; font-size: 14px; color: #121a2b; }
.wp-block-search__button { margin-inline-start: 4px; padding: 8px 16px; border: 0; border-radius: 999px; font-size: 13px; font-weight: 700; }
.bfjr-posts { gap: 20px !important; }
.bfjr-posts > li { min-inline-size: 0; padding: 26px; background: #fff; border-radius: 24px; box-shadow: 0 1px 2px rgb(20 40 90 / 5%); transition: box-shadow .18s ease; }
.bfjr-posts > li:hover { box-shadow: 0 1px 2px rgb(20 40 90 / 5%), 0 16px 32px rgb(20 40 90 / 8%); }
.bfjr-posts .wp-block-post-featured-image { margin-block: 0 22px; }
.bfjr-posts .wp-block-post-featured-image img { aspect-ratio: 16 / 10; object-fit: cover; border-radius: 16px; }
.bfjr-posts .wp-block-post-title { font-size: 25px; line-height: 1.25; letter-spacing: -.025em; margin-block: 16px 12px; overflow-wrap: anywhere; }
.bfjr-posts .wp-block-post-title a { color: var(--wp--preset--color--ink); text-decoration: none; }
.bfjr-posts .wp-block-post-title a:hover { color: var(--wp--preset--color--link); text-decoration: underline; }
.bfjr-posts .wp-block-post-excerpt { color: var(--wp--preset--color--muted); font-size: 15px; line-height: 1.7; }
.bfjr-posts .wp-block-post-excerpt p { margin-block: 0; }
.bfjr-posts .wp-block-post-date { color: var(--wp--preset--color--muted); font-size: 12px; font-weight: 600; }
.wp-block-post-terms { font-size: 12px; font-weight: 700; }
.wp-block-post-terms a { display: inline-block; border-radius: 999px; background: #e6edff; color: #1e3fb8; padding: 4px 10px; }
.bfjr-posts .wp-block-read-more { display: inline-block; margin-block-start: 20px; color: #2f5ad6; font-size: 14px; font-weight: 700; text-decoration: underline; }
.wp-block-query-pagination { margin-block: 32px; gap: 12px; font-size: 14px; }
.wp-block-query-pagination .page-numbers { padding: 8px 12px; border-radius: 10px; background: #fff; }
.wp-block-query-pagination .current { background: var(--wp--preset--color--ink); color: #fff; }
.bfjr-cta { margin-block: 64px 0; padding: 32px; border-radius: 24px; background: var(--wp--preset--color--ink); color: #fff; gap: 20px; }
.bfjr-cta h2 { font-size: clamp(24px, 3vw, 32px); letter-spacing: -.025em; margin: 0; }
.bfjr-cta p { margin-block: 8px 0; color: #d2d9e8; font-size: 15px; }
.bfjr-cta .wp-block-button__link { background: #fff; color: #121a2b; white-space: normal; }
.bfjr-cta .wp-block-button__link:hover { background: #e6edff; }
.bfjr-footer { padding-block: 64px 32px; color: var(--wp--preset--color--muted); font-size: 13px; }
.bfjr-footer-row { gap: 20px 24px; }
.bfjr-footer-logo img { inline-size: 118px; block-size: 26px; display: block; }
.bfjr-footer p { margin: 0; }
.bfjr-footer nav { margin-inline-start: auto; }
.bfjr-footer a { color: var(--wp--preset--color--muted); }
.bfjr-footer-nav { display: flex; flex-wrap: wrap; gap: 18px; }
.bfjr-footer-note { margin-block-start: 24px !important; font-size: 12px; }
.bfjr-document { padding-block-start: 64px; }
.bfjr-entry-head { max-inline-size: 920px; margin-inline: auto; padding-block-end: 32px; }
.bfjr-entry-head h1 { margin-block: 20px; font-size: clamp(36px, 5.2vw, 64px); line-height: 1.1; letter-spacing: -.04em; overflow-wrap: anywhere; text-wrap: balance; }
.bfjr-entry-meta { color: var(--wp--preset--color--muted); font-size: 13px; gap: 16px; }
.bfjr-article { max-inline-size: 1040px; margin-inline: auto; padding: clamp(24px, 4vw, 64px); background: #fff; border-radius: 28px; box-shadow: 0 1px 2px rgb(20 40 90 / 5%); }
.bfjr-article > .wp-block-post-featured-image { margin-block: 0 36px; }
.bfjr-article .wp-block-post-featured-image img { border-radius: 20px; }
.wp-block-post-content { overflow-wrap: anywhere; }
.wp-block-post-content > *:first-child { margin-block-start: 0; }
.wp-block-post-content h2 { margin-block-start: 2em; font-size: clamp(26px, 3vw, 36px); }
.wp-block-post-content h3 { font-size: clamp(22px, 2.6vw, 28px); }
.wp-block-post-content p, .wp-block-post-content li { line-height: 1.85; }
.wp-block-post-content a, .wp-block-comment-content a { text-decoration: underline; }
.wp-block-post-content pre { max-inline-size: 100%; overflow: auto; padding: 24px; border-radius: 16px; background: #f3f6fc; font-size: 14px; }
.wp-block-post-content blockquote { margin-inline: 0; padding: 16px 24px; border-inline-start: 3px solid #3b6cf6; background: #f3f6fc; border-radius: 0 16px 16px 0; }
.wp-block-post-content table { border-collapse: collapse; }
.wp-block-post-content :where(td, th) { border: 1px solid #d3dbea; padding: 12px; }
.wp-block-post-content .wp-block-table { max-inline-size: 100%; overflow-x: auto; }
.bfjr-post-bottom { margin-block-start: 40px; padding-block-start: 28px; border-block-start: 1px solid #e3e9f5; }
.bfjr-comments { max-inline-size: 920px; margin: 48px auto 0; padding: clamp(24px, 4vw, 40px); background: #fff; border-radius: 24px; }
.bfjr-comments h2 { font-size: 26px; }
.bfjr-comments h3 { font-size: 22px; }
.bfjr-comments .wp-block-comment-template { padding: 0; }
.bfjr-comments .comment { padding-block: 16px; }
.bfjr-comments .comment-reply-link { font-size: 13px; }
.bfjr-comments label { display: block; font-size: 14px; font-weight: 600; margin-block-end: 8px; }
.bfjr-comments :where(input:not([type=submit]):not([type=checkbox]), textarea) { inline-size: 100%; border: 1px solid #a4aec0; border-radius: 12px; padding: 12px; background: #f3f6fc; font: inherit; }
.bfjr-comments input[type=submit] { padding: 14px 22px; border: 0; border-radius: 14px; background: #3b6cf6; color: #fff; font: 700 15px Manrope, sans-serif; cursor: pointer; }
.bfjr-comments .comment-form-cookies-consent label { display: inline; }
.bfjr-archive-head { padding-block: 64px 32px; }
.bfjr-archive-head h1 { font-size: clamp(36px, 5vw, 56px); line-height: 1.1; letter-spacing: -.04em; }
.bfjr-empty { padding: 32px; background: #fff; border-radius: 24px; }
.bfjr-404 { max-inline-size: 800px; margin: 64px auto 0; padding: clamp(28px, 5vw, 64px); background: #fff; border-radius: 28px; }
.bfjr-404 h1 { font-size: clamp(36px, 5vw, 60px); letter-spacing: -.04em; line-height: 1.1; }
.bfjr-404 .wp-block-search { margin-block: 28px; }
@media (min-width: 782px) {
  .bfjr-hero h1 { font-size: clamp(30px, 4.6vw, 68px); white-space: nowrap; }
  .bfjr-hero h1 span { display: block; }
}
@media (max-width: 1000px) {
  .bfjr-nav { gap: 18px; }
  .bfjr-nav .wp-block-navigation__container { gap: 16px; }
  .bfjr-nav > .wp-block-buttons { display: none; }
  .bfjr-posts { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 781px) {
  .admin-bar .bfjr-header { inset-block-start: 46px; }
  .bfjr-hero { gap: 32px; }
  .bfjr-hero-image img { max-block-size: 400px; }
}
@media (max-width: 599px) {
  .bfjr-shell { inline-size: calc(100% - 32px); }
  .bfjr-header { padding-block-start: 12px; }
  .bfjr-nav { min-block-size: 56px; padding: 10px 18px; }
  .bfjr-nav .wp-block-navigation { margin-inline: auto 0; }
  .bfjr-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 32px; background: #f3f6fc; }
  .bfjr-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 24px; font-size: 22px; }
  .bfjr-home { padding-block-start: 36px; }
  .bfjr-hero h1 { font-size: clamp(40px, 10.5vw, 56px); }
  .bfjr-intro { font-size: 16px; }
  .bfjr-hero-copy > * + * { margin-block-start: 20px; }
  .bfjr-topics { margin-block-start: 24px; padding: 18px; gap: 10px; }
  .bfjr-section { padding-block-start: 40px; }
  .bfjr-section-heading { align-items: stretch; flex-direction: column; }
  .bfjr-section-heading .wp-block-search { inline-size: 100%; }
  .bfjr-posts { grid-template-columns: minmax(0, 1fr) !important; }
  .bfjr-posts > li { padding: 24px; }
  .bfjr-cta { margin-block-start: 40px; padding: 26px; }
  .bfjr-footer { padding-block-start: 40px; }
  .bfjr-footer-row { align-items: flex-start; flex-direction: column; }
  .bfjr-footer nav { margin-inline-start: 0; }
  .bfjr-document { padding-block-start: 40px; }
  .bfjr-article { padding: 24px; border-radius: 24px; }
  .bfjr-entry-head h1 { font-size: 38px; }
  .bfjr-comments { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}