/*
Theme Name: racunaj.me
Theme URI: https://racunaj.me
Author: racunaj.me
Author URI: https://racunaj.me
Description: Premium, futuristic custom theme for racunaj.me — a dark, neon, glassmorphic math-learning platform. No page builders, pure custom PHP/CSS/JS. Built for a 2026 premium tech feel (Apple × Stripe × Linear × Vercel × Brilliant).
Version: 0.9.5
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: racunajme
Tags: education, dark, custom-colors, custom-menu, custom-logo, featured-images, translation-ready
*/

/*
  NOTE:
  This style.css exists mainly for WordPress theme metadata (the header above)
  and a minimal reset. All real styling lives in /assets/css/main.css,
  which is enqueued in functions.php for cleaner separation and caching.
*/

:root {
    --rm-bg: #06060f;
}

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--rm-bg);
    color: #e7e9ff;
    /* System stack only — the theme loads no webfonts. */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

* {
    box-sizing: border-box;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
    text-decoration: none;
}

/* ---------------------------------------------------------------------
   FOOTER SOCIAL
   ---------------------------------------------------------------------
   Icons only, in one row. The handle used to sit beside each mark, which
   on a phone pushed three links past the column width and let the text
   ride over the icons. The name lives in aria-label now, where it costs
   no width.
   --------------------------------------------------------------------- */

.footer-social {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 14px;
}

.footer-social__link {
	display: inline-grid;
	place-items: center;
	/* Square, and never smaller than a thumb. flex: none stops the row from
	   squeezing them when the column narrows — squeezing is what made them
	   collide with the text. */
	flex: none;
	width: 44px;
	height: 44px;
	padding: 0;
	border-radius: 14px;
	color: var(--text-soft, #c3c7e8);
	border: 1px solid var(--glass-brd, rgba(255, 255, 255, 0.1));
	background: rgba(15, 12, 42, 0.7);
	transition: color 0.22s ease, border-color 0.22s ease, transform 0.22s ease;
}

.footer-social__link svg {
	width: 20px;
	height: 20px;
	display: block;
}

.footer-social__link:hover {
	color: var(--neon-cyan, #52e2fb);
	border-color: rgba(82, 226, 251, 0.5);
	transform: translateY(-2px);
}

.footer-social__link:focus-visible {
	outline: 2px solid var(--neon-cyan, #52e2fb);
	outline-offset: 3px;
}

@media (max-width: 640px) {

	/* Centred under the column, on its own line — not floated beside text
	   that has nowhere left to go. */
	.footer-social {
		justify-content: center;
		gap: 12px;
		margin-top: 18px;
	}
}

@media (prefers-reduced-motion: reduce) {

	.footer-social__link { transition: none; }
	.footer-social__link:hover { transform: none; }
}