/*
Theme Name: BuruDomain
Theme URI: https://burudomain.com
Author: TokoDesign
Author URI: https://tokodesign.co.id
Description: BuruDomain official theme.
Version: 1.0.0
License: GNU General Public License v2 or later
License URL: http://gnu.org
Text Domain: burudomain
*/

/* =====================================================================
   BuruDomain — base design tokens & custom CSS
   Colors, fonts & shadows live in the inline Tailwind config (header).
   This file only covers what Tailwind utilities cannot express cleanly.
   ===================================================================== */

body { font-family: 'Plus Jakarta Sans', sans-serif; }
.font-display { font-family: 'Bricolage Grotesque', sans-serif; }

/* Grain / noise overlay for atmosphere */
.noise::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  opacity: .04; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Gradient text */
.text-gradient { background: linear-gradient(100deg,#4a46e0,#1890f0); -webkit-background-clip: text; background-clip: text; color: transparent; }

::selection { background: #4a46e0; color: #fff; }
html { scrollbar-gutter: stable; }

/* Custom scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(74,70,224,.22); border-radius: 9999px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: rgba(74,70,224,.4); background-clip: padding-box; }

/* White logo wordmark -> render as dark ink on light surfaces (mobile drawer/footer fallback) */
.logo-dark { filter: brightness(0) saturate(100%) invert(9%) sepia(63%) saturate(2600%) hue-rotate(232deg) brightness(95%) contrast(101%); }

/* ---------------------------------------------------------------------
   Post / Page content styling (.entry-content)
   Tailwind Typography plugin is not bundled with the Play CDN, so we
   style native WordPress output to match the base design system.
   --------------------------------------------------------------------- */
.entry-content { color: rgba(10,10,60,.72); line-height: 1.75; font-size: 1.0625rem; }
.entry-content > * + * { margin-top: 1.25rem; }
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 { font-family: 'Bricolage Grotesque', sans-serif; color: #0a0a3c; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; }
.entry-content h1 { font-size: 2.25rem; margin-top: 2.5rem; }
.entry-content h2 { font-size: 1.875rem; margin-top: 2.25rem; }
.entry-content h3 { font-size: 1.5rem; margin-top: 2rem; }
.entry-content h4 { font-size: 1.25rem; margin-top: 1.75rem; }
.entry-content p { margin-top: 1.25rem; }
.entry-content a { color: #4a46e0; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; transition: color .2s; }
.entry-content a:hover { color: #1890f0; }
.entry-content ul,
.entry-content ol { margin-top: 1.25rem; padding-left: 1.5rem; }
.entry-content ul { list-style: disc; }
.entry-content ol { list-style: decimal; }
.entry-content li { margin-top: .5rem; }
.entry-content li::marker { color: #4a46e0; }
.entry-content img { border-radius: 1.25rem; box-shadow: 0 12px 32px -12px rgba(74,70,224,.18); height: auto; }
.entry-content figure { margin-top: 1.75rem; }
.entry-content figcaption { margin-top: .5rem; font-size: .8125rem; color: rgba(10,10,60,.45); text-align: center; }
.entry-content blockquote {
  margin-top: 1.75rem; padding: 1.25rem 1.5rem; border-left: 4px solid #4a46e0;
  background: #eeedfd; border-radius: 0 1rem 1rem 0; font-style: italic; color: #11114d;
}
.entry-content pre {
  margin-top: 1.5rem; padding: 1.25rem; background: #0a0a3c; color: #f5f6fc;
  border-radius: 1rem; overflow-x: auto; font-size: .875rem;
}
.entry-content code { font-family: ui-monospace, monospace; font-size: .875em; }
.entry-content :not(pre) > code { background: #eeedfd; color: #352fb8; padding: .15em .4em; border-radius: .35rem; }
.entry-content table { width: 100%; margin-top: 1.5rem; border-collapse: collapse; font-size: .9375rem; }
.entry-content th, .entry-content td { border: 1px solid rgba(10,10,60,.1); padding: .65rem .9rem; text-align: left; }
.entry-content th { background: #f5f6fc; font-weight: 700; color: #0a0a3c; }
.entry-content hr { margin: 2.5rem 0; border: 0; border-top: 1px solid rgba(10,10,60,.1); }

/* WP core alignment helpers */
.alignleft { float: left; margin: .5rem 1.5rem 1rem 0; }
.alignright { float: right; margin: .5rem 0 1rem 1.5rem; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { max-width: 100%; }
.sticky, .gallery-caption, .bypostauthor { } /* required by Theme Check */

/* ---------------------------------------------------------------------
   Widget styling (footer + single-post sidebar)
   --------------------------------------------------------------------- */
.widget { margin-bottom: 1.75rem; }
.widget:last-child { margin-bottom: 0; }
.widget ul { list-style: none; margin: 0; padding: 0; }
.widget ul li { margin-top: .65rem; }
.widget a { transition: color .2s; }

/* Footer widgets (on dark ink background) */
.footer-widgets .widget-title { font-family: 'Bricolage Grotesque', sans-serif; font-size: .8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #fff; margin-bottom: 1.25rem; }
.footer-widgets .widget { color: rgba(255,255,255,.55); font-size: .9375rem; }
.footer-widgets .widget a { color: rgba(255,255,255,.55); }
.footer-widgets .widget a:hover { color: #fff; }

/* Sidebar widgets (single post, light surface) */
.sidebar-widgets .widget { background: #fff; border: 1px solid rgba(10,10,60,.05); border-radius: 1.5rem; padding: 1.5rem; box-shadow: 0 1px 2px rgba(10,10,60,.04), 0 12px 32px -12px rgba(74,70,224,.18); }
.sidebar-widgets .widget-title { font-family: 'Bricolage Grotesque', sans-serif; font-size: 1.125rem; font-weight: 800; letter-spacing: -0.01em; color: #0a0a3c; margin-bottom: 1.25rem; }
.sidebar-widgets .widget a { color: rgba(10,10,60,.7); font-weight: 600; line-height: 1.45; transition: color .2s; }
.sidebar-widgets .widget a:hover { color: #4a46e0; }
.sidebar-widgets .widget ul li { margin-top: 1rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(10,10,60,.07); }
.sidebar-widgets .widget ul li:first-child { margin-top: 0; }
.sidebar-widgets .widget ul li:last-child { border-bottom: 0; padding-bottom: 0; }
/* Post date (Recent Posts widget) -> on its own line, smaller, lighter */
.sidebar-widgets .widget .post-date { display: block; margin-top: .35rem; font-size: .75rem; font-weight: 500; color: rgba(10,10,60,.4); }

/* Search form */
.search-form { display: flex; gap: .5rem; }
.search-form .search-field { flex: 1 1 auto; min-width: 0; border: 1px solid rgba(10,10,60,.1); background: #f5f6fc; border-radius: .75rem; padding: .6rem .9rem; font-size: .875rem; outline: none; transition: border-color .2s, box-shadow .2s; }
.search-form .search-field:focus { border-color: #4a46e0; background: #fff; box-shadow: 0 0 0 4px rgba(74,70,224,.1); }
.search-form .search-submit { flex: 0 0 auto; border-radius: .75rem; background: #4a46e0; color: #fff; font-weight: 700; font-size: .8125rem; padding: .6rem 1rem; border: 0; cursor: pointer; transition: background-color .2s; }
.search-form .search-submit:hover { background: #4038d6; }

/* ---------------------------------------------------------------------
   Navigation menus (wp_nav_menu output styled to match base design)
   --------------------------------------------------------------------- */
.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { left: 1rem; top: 1rem; z-index: 100; width: auto; height: auto; padding: .65rem 1rem; background: #fff; color: #4a46e0; border-radius: .5rem; font-weight: 700; box-shadow: 0 12px 32px -12px rgba(74,70,224,.4); }

.nav-menu { list-style: none; margin: 0; padding: 0; }

/* Desktop menu links (on brand background) */
.nav-menu--desktop > li > a {
	display: inline-block; padding: .5rem .875rem; font-size: 13px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .025em; border-radius: .5rem;
	color: rgba(255,255,255,.85); transition: color .2s, background-color .2s;
}
.nav-menu--desktop > li > a:hover { color: #fff; background: rgba(255,255,255,.1); }
.nav-menu--desktop > li.current-menu-item > a,
.nav-menu--desktop > li.current_page_item > a { color: #fff; background: rgba(255,255,255,.12); }

/* Mobile drawer menu links (on cream background) */
.nav-menu--mobile > li > a {
	display: block; padding: .875rem 1rem; font-size: .875rem; font-weight: 700;
	text-transform: uppercase; letter-spacing: .025em; border-radius: .75rem;
	color: #0a0a3c; transition: color .2s, background-color .2s;
}
.nav-menu--mobile > li > a:hover,
.nav-menu--mobile > li.current-menu-item > a { background: #eeedfd; color: #4a46e0; }

/* Footer menu */
.footer-menu { list-style: none; margin: 0; padding: 0; }
.footer-menu a { color: rgba(255,255,255,.55); font-size: .875rem; font-weight: 600; transition: color .2s; }
.footer-menu a:hover { color: #fff; }

/* ---------------------------------------------------------------------
   Scroll reveal
   --------------------------------------------------------------------- */
[data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
[data-reveal].in { opacity: 1; transform: none; }