/* ---------------------------------------------------------------------------
   besee.net HOME — linktree entrance
   Recreated from Claude design handoff (design_handoff_besee_home).
   Loaded only on the front page (see oaknut_home_enqueue in functions.php).
--------------------------------------------------------------------------- */

@font-face {
	font-family: "Red Hat Mono";
	src: url("../fonts/red-hat-mono.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

:root {
	--home-bg: linear-gradient(135deg, #FFCEEC 0%, #C3B8F4 50%, #9896F0 100%);
	--home-fg: #010014;
	--home-fg-muted: rgba(1, 0, 20, 0.6);
	--home-pink: #FFCEEC;
	--home-lavender: #9896F0;
	--home-font: "Red Hat Mono", ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;
}

@keyframes homeDrift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
@keyframes homeFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes homeGlow  { 0%, 100% { opacity: .45; transform: scale(1); } 50% { opacity: .8; transform: scale(1.12); } }
@keyframes homeOrb   { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(24px, -30px); } }
@keyframes homeOrb2  { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-30px, 26px); } }
@keyframes homeCaret { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes homeUp    { from { transform: translateY(18px); } to { transform: translateY(0); } }

* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }

body.oaknut-home {
	position: relative;
	min-height: 100vh;
	overflow-x: hidden;
	background: var(--home-bg);
	background-size: 220% 220%;
	animation: homeDrift 14s ease-in-out infinite;
	color: var(--home-fg);
	font-family: var(--home-font);
	font-weight: 500;
}
body.oaknut-home ::selection { background: var(--home-fg); color: var(--home-pink); }
body.oaknut-home a { -webkit-tap-highlight-color: transparent; }

/* floating background orbs */
.oaknut-home .orb { position: absolute; border-radius: 50%; pointer-events: none; will-change: transform; }
.oaknut-home .orb > i { position: absolute; inset: 0; display: block; }
.oaknut-home #orbA { top: -120px; right: -80px; width: 420px; height: 420px; background: radial-gradient(circle, rgba(255,206,236,.9), rgba(255,206,236,0) 70%); filter: blur(20px); }
.oaknut-home #orbA > i { animation: homeOrb 13s ease-in-out infinite; }
.oaknut-home #orbB { bottom: -140px; left: -100px; width: 480px; height: 480px; background: radial-gradient(circle, rgba(152,150,240,.85), rgba(152,150,240,0) 70%); filter: blur(24px); }
.oaknut-home #orbB > i { animation: homeOrb2 17s ease-in-out infinite; }
.oaknut-home #orbC { top: 30%; left: 55%; width: 300px; height: 300px; background: radial-gradient(circle, rgba(255,255,255,.5), rgba(255,255,255,0) 70%); filter: blur(30px); }

.oaknut-home main {
	position: relative; z-index: 1;
	min-height: 100vh;
	display: flex; flex-direction: column;
	align-items: center; justify-content: center;
	padding: 56px 24px; text-align: center;
}

.oaknut-home .logo-float { animation: homeFloat 6s ease-in-out infinite; }
.oaknut-home .logo { position: relative; display: grid; place-items: center; will-change: transform; }
.oaknut-home .logo .glow { position: absolute; width: 150px; height: 150px; border-radius: 50%; background: radial-gradient(circle, rgba(152,150,240,.85), rgba(152,150,240,0) 70%); filter: blur(18px); animation: homeGlow 5s ease-in-out infinite; }
.oaknut-home .logo img { position: relative; width: 132px; height: 132px; }

.oaknut-home h1 { margin: 30px 0 0; font-size: 38px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.1; animation: homeUp .7s ease .15s backwards; }

.oaknut-home .tagline { margin: 16px 0 0; font-size: 15px; color: var(--home-fg-muted); min-height: 1.4em; animation: homeUp .7s ease .3s backwards; }
.oaknut-home .caret { display: inline-block; width: .55em; height: 1.05em; background: var(--home-fg); margin-left: 2px; transform: translateY(.18em); animation: homeCaret 1.06s step-end infinite; }

.oaknut-home nav { width: 100%; max-width: 420px; margin-top: 44px; display: flex; flex-direction: column; gap: 18px; }
.oaknut-home nav a {
	display: block; background: #fff; color: var(--home-fg); text-decoration: none;
	border: 2px solid var(--home-fg); border-radius: 999px; padding: 15px; font-size: 16px;
	box-shadow: 0 6px 0 var(--home-fg);
	transition: transform .14s ease, box-shadow .14s ease, background .14s ease;
}
.oaknut-home nav a:nth-child(1) { animation: homeUp .6s ease .42s backwards; }
.oaknut-home nav a:nth-child(2) { animation: homeUp .6s ease .52s backwards; }
.oaknut-home nav a:nth-child(3) { animation: homeUp .6s ease .62s backwards; }
.oaknut-home nav a:nth-child(4) { animation: homeUp .6s ease .72s backwards; }
.oaknut-home nav a:hover { transform: translateY(4px); box-shadow: 0 2px 0 var(--home-fg); background: var(--home-pink); }
.oaknut-home nav a:active { transform: translateY(6px); box-shadow: 0 0 0 var(--home-fg); }

.oaknut-home .socials { display: flex; gap: 18px; margin-top: 40px; animation: homeUp .6s ease .85s backwards; }
.oaknut-home .socials a { width: 46px; height: 46px; border-radius: 50%; background: var(--home-fg); color: #fff; display: grid; place-items: center; text-decoration: none; font-size: 12px; font-weight: 700; transition: transform .16s ease; }
.oaknut-home .socials a:hover { transform: translateY(-3px) scale(1.08); }

.oaknut-home .foot { margin-top: 48px; font-size: 12px; letter-spacing: .08em; color: rgba(1,0,20,.5); animation: homeUp .6s ease 1s backwards; }

@media (prefers-reduced-motion: reduce) {
	.oaknut-home *, .oaknut-home *::before, .oaknut-home *::after { animation: none !important; transition: none !important; }
}