/* ─────────────────────────────────────────
   TOKENS
───────────────────────────────────────── */
:root {
	/* Background layers */
	--bg0: #06080f;
	/* deepest */
	--bg1: #0b0e17;
	/* main background */
	--bg2: #10141f;
	/* cards */
	--bg3: #151a27;
	/* elevated cards */
	--bg4: #1c2130;
	/* hover state */

	/* Borders */
	--b1: rgba(255, 255, 255, 0.06);
	--b2: rgba(255, 255, 255, 0.11);
	--b3: rgba(255, 255, 255, 0.18);

	/* Text */
	--t1: #eef0f6;
	/* primary */
	--t2: #d1d1d1;
	/* secondary */
	--t3: #b1b1b1;
	/* muted */

	/* Accent — electric indigo + cyan */
	--ac: #6c8eff;
	/* main accent – soft electric blue */
	--ac-lt: #93aaff;
	/* lighter */
	--ac-glow: rgba(108, 142, 255, 0.18);
	--ac-dim: rgba(108, 142, 255, 0.10);

	--cy: #38d9f5;
	/* cyan second accent */
	--cy-dim: rgba(56, 217, 245, 0.10);

	--rose: #ff6b81;
	/* for "new" badges */

	/* Font stacks */
	--serif: 'Fraunces', Georgia, serif;
	--sans: 'Plus Jakarta Sans', system-ui, sans-serif;
	--mono: 'JetBrains Mono', monospace;

	--nav-h: 68px;
	--r: 6px;
	--ease: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ─────────────────────────────────────────
   RESET
───────────────────────────────────────── */
*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0
}

html {
	scroll-behavior: smooth
}

body {
	background: var(--bg1);
	background-color: var(--bg1) ;
	color: var(--t1);
	font-family: var(--sans);
	font-weight: 400;
	font-size: 16px;
	line-height: 1.75;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
}

img {
	display: block;
	max-width: 100%
}

a {
	text-decoration: none
}

ul {
	list-style: none
}

button {
	background: none;
	border: 1px solid var(--b2);
	cursor: pointer
}

::-webkit-scrollbar {
	width: 3px
}

::-webkit-scrollbar-track {
	background: var(--bg0)
}

::-webkit-scrollbar-thumb {
	background: var(--ac);
	border-radius: 2px
}

::selection {
	background: var(--ac);
	color: #fff
}

/* ─────────────────────────────────────────
   NOISE + GRID TEXTURE
───────────────────────────────────────── */
body::before {
	content: '';
	position: fixed;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	opacity: .022;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	background-size: 180px;
}

/* subtle grid */
body::after {
	content: '';
	position: fixed;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background-image:
		linear-gradient(var(--b1) 1px, transparent 1px),
		linear-gradient(90deg, var(--b1) 1px, transparent 1px);
	background-size: 64px 64px;
	opacity: .4;
}

/* ─────────────────────────────────────────
   CURSOR
───────────────────────────────────────── */
#cur-dot {
	position: fixed;
	width: 7px;
	height: 7px;
	background: var(--ac);
	border-radius: 50%;
	pointer-events: none;
	z-index: 9999;
	transform: translate(-50%, -50%);
	transition: width .15s, height .15s
}

#cur-ring {
	position: fixed;
	width: 32px;
	height: 32px;
	border: 1.5px solid rgba(108, 142, 255, .4);
	border-radius: 50%;
	pointer-events: none;
	z-index: 9998;
	transform: translate(-50%, -50%);
	transition: transform .4s var(--ease), opacity .3s, border-color .3s
}

@media(hover:none) {

	#cur-dot,
	#cur-ring {
		display: none
	}
}

/* ─────────────────────────────────────────
   NAV
───────────────────────────────────────── */
.nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 500;
	height: var(--nav-h);
	display: flex;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	padding: 0 clamp(1.25rem, 5vw, 3.5rem);
	transition: background .35s, border-color .35s, backdrop-filter .35s;
	border-bottom: 1px solid transparent;
}

.nav-brand-wrap {
	margin-right: auto;
}

.admin-bar .nav {
	top: 32px;
}

.nav.stuck {
	background: rgba(6, 8, 15, .88);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-color: var(--b1);
}

.nav-brand {
	font-family: var(--brand-font, var(--serif));
	font-size: var(--brand-size, 1.55rem);
	font-weight: var(--brand-weight, 800);
	color: var(--brand-color, var(--t1));
	letter-spacing: -.02em;
	display: flex;
	align-items: center;
	gap: .35rem;
	justify-self: start;
	text-decoration: none;
}

.nav-logo--text {
	font-family: var(--brand-font, var(--serif));
	font-size: var(--brand-size, 1.55rem);
	font-weight: var(--brand-weight, 800);
	color: var(--brand-color, var(--t1));
	letter-spacing: -.02em;
	text-decoration: none;
}

.nav-brand span {
	color: var(--ac)
}

.nav-logo--text {
	color: var(--brand-color, var(--t1));
}

/* ── Nav links — supports both fallback <a> and WP menu <li><a> ── */
.nav-links {
	display: flex;
	gap: 0;
	justify-self: center;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

/* WP menu: li items */
.nav-links li {
	display: flex;
	align-items: center;
	position: relative;
}

/* Hide WP sub-menus (depth:1 set but safety) */
.nav-links li ul,
.nav-links .sub-menu {
	display: none !important;
}

/* All anchor links inside nav */
.nav-links li a,
.nav-links>a {
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--t2);
	position: relative;
	transition: color .2s;
	padding: 0 1.1rem;
	white-space: nowrap;
	text-decoration: none;
}

.nav-links li a::after,
.nav-links>a::after {
	content: '';
	position: absolute;
	bottom: -3px;
	left: 1.1rem;
	right: 1.1rem;
	width: 0;
	height: 1.5px;
	background: var(--ac);
	border-radius: 1px;
	transition: width .3s var(--ease);
}

.nav-links li a:hover,
.nav-links>a:hover {
	color: var(--t1)
}

.nav-links li a:hover::after,
.nav-links>a:hover::after {
	width: calc(100% - 2.2rem)
}

/* Active state — WP adds .current-menu-item, JS adds .active */
.nav-links li.current-menu-item>a,
.nav-links li.current_page_item>a,
.nav-links li.active>a,
.nav-links>a.active {
	color: var(--t1);
}

.nav-links li.current-menu-item>a::after,
.nav-links li.current_page_item>a::after,
.nav-links li.active>a::after,
.nav-links>a.active::after {
	width: calc(100% - 2.2rem);
}

.nav-right {
	display: flex;
	align-items: center;
	gap: 1rem;
	justify-self: end;
}

.nav-cta {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: #fff;
	background: var(--ac);
	padding: .52rem 1.3rem;
	border-radius: 100px;
	transition: background .2s, transform .2s, box-shadow .2s;
}

.nav-cta:hover {
	background: var(--ac-lt);
	transform: translateY(-4px) scale(1.02);
	box-shadow: 0 6px 24px var(--ac-glow)
}

.burger {
	display: none;
	gap: 5px;
	padding: 4px;
	flex-direction: column;
}

.burger span {
	display: block;
	width: 22px;
	height: 1.5px;
	background: var(--t1);
	border-radius: 2px;
	transition: transform .3s, opacity .3s
}

/* ─────────────────────────────────────────
   MOBILE MENU
───────────────────────────────────────── */
.m-menu {
    position: fixed;
    inset: 0;
    z-index: 490;
    background: var(--bg0);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    opacity: 0;
    pointer-events: none;
    transition: opacity .35s var(--ease);
}

.m-menu.open {
	opacity: 1;
	pointer-events: all
}

.m-menu a {
	font-family: var(--serif);
	font-size: 20px;
	font-weight: 600;
	color: var(--t1);
	padding: .2rem 0;
	display: block;
	transform: translateY(10px);
	opacity: 0;
	transition: transform .45s var(--ease), opacity .45s var(--ease), color .2s;
}

.m-menu.open a {
	transform: translateY(0);
	opacity: 1
}

.m-menu a:nth-child(1) {
	transition-delay: .06s
}

.m-menu a:nth-child(2) {
	transition-delay: .10s
}

.m-menu a:nth-child(3) {
	transition-delay: .14s
}

.m-menu a:nth-child(4) {
	transition-delay: .18s
}

.m-menu a:nth-child(5) {
	transition-delay: .22s
}

.m-menu a:hover {
	color: var(--ac)
}

/* ─────────────────────────────────────────
   SHARED LAYOUT
───────────────────────────────────────── */
.wrap {
	max-width: 1160px;
	margin: 0 auto;
	padding: 0 clamp(1.25rem, 5vw, 3.5rem);
	position: relative;
	z-index: 1
}

.sec {
	padding: clamp(5rem, 10vw, 5rem) 0;
	position: relative
}

.sec-badge {
	font-family: var(--mono);
	font-size: .65rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ac);
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	margin-bottom: 1rem;
	/* Always visible — no animation class needed */
	opacity: 1 !important;
	clip-path: none !important;
	transform: none !important;
}

.sec-badge::before {
	content: '';
	display: block;
	width: 20px;
	height: 1.5px;
	background: var(--ac);
	border-radius: 1px
}

.sec-h2 {
	font-family: var(--serif);
	font-size: clamp(2.4rem, 5vw, 4rem);
	font-weight: 600;
	line-height: 1.08;
	letter-spacing: -.025em;
	color: var(--t1);
}

.sec-h2 em {
	font-style: italic;
	font-weight: 300;
	color: var(--ac)
}

p.body-txt {
	font-size: .975rem;
	color: var(--t2);
	line-height: 1.85
}

/* ─────────────────────────────────────────
   BUTTONS
───────────────────────────────────────── */
.btn {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	font-family: var(--sans);
	font-size: .82rem;
	font-weight: 600;
	letter-spacing: .04em;
	padding: .78rem 1.7rem;
	border-radius: 100px;
	cursor: pointer;
	color: #fff;
	text-align: center;
	justify-content: center;
	text-transform:capitalize;
}

.btn-solid {
	background: var(--ac);
}


.btn:hover {
	transform: translateY(-4px) scale(1.02);
	color: #fff
}

.btn-solid:hover {
	background: var(--ac-lt);
	box-shadow: 0 8px 28px var(--ac-glow)
}

.btn-ghost {
	border: 1.5px solid var(--b2);
	color: var(--t2)
}

.btn-ghost:hover {
	border-color: var(--ac);
	color: var(--ac)
}

/* ─────────────────────────────────────────
   SCROLL PROGRESS BAR
───────────────────────────────────────── */
#scroll-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 2px;
	width: 0;
	background: linear-gradient(90deg, var(--ac), var(--cy));
	z-index: 9999;
	transition: width .1s linear;
	box-shadow: 0 0 8px var(--ac-glow);
}

/* ─────────────────────────────────────────
   REVEAL — base system
───────────────────────────────────────── */
.rv {
	opacity: 0;
	transition: opacity .75s var(--ease), transform .75s var(--ease), filter .75s var(--ease);
	will-change: opacity, transform;
}

.rv.visible {
	opacity: 1;
	transform: none !important;
	filter: none !important
}

/* Direction variants */
.rv.up {
	transform: translateY(36px)
}

.rv.left {
	transform: translateX(-36px)
}

.rv.right {
	transform: translateX(36px)
}

.rv.scale {
	transform: scale(.92);
	filter: blur(4px)
}

.rv.down {
	transform: translateY(-24px)
}

/* Clip-path wipe reveal */
.rv.clip {
	opacity: 1 !important;
	clip-path: inset(0 0 100% 0);
	transition: clip-path .85s var(--ease);
}

.rv.clip.visible {
	clip-path: inset(0 0 0% 0)
}

/* Delay utilities */
.rv.d1 {
	transition-delay: .08s
}

.rv.d2 {
	transition-delay: .18s
}

.rv.d3 {
	transition-delay: .28s
}

.rv.d4 {
	transition-delay: .38s
}

.rv.d5 {
	transition-delay: .48s
}

/* ─────────────────────────────────────────
   WORD SPLIT ANIMATION
   .sec-h2 headings get this automatically
───────────────────────────────────────── */
.split-words .word {
	display: inline-block;
	opacity: 0;
	transform: translateY(32px) rotate(-1deg);
	transition: opacity .65s var(--ease), transform .65s var(--ease);
}

.split-words.visible .word {
	opacity: 1;
	transform: none;
}

/* Active nav link */
.nav-links a.active {
	color: var(--t1)
}

.nav-links a.active::after {
	width: 100%
}

/* ─────────────────────────────────────────
   HERO SECTION
───────────────────────────────────────── */
.hero {
	display: grid;
	grid-template-rows: 1fr auto;
	padding-top: var(--nav-h);
	overflow: hidden;
	position: relative;
	min-height: 100svh;
}

/* radial glow behind */
.hero-glow {
	position: absolute;
	top: -10%;
	right: -5%;
	width: 65%;
	aspect-ratio: 1;
	background: radial-gradient(circle at 60% 40%, rgba(108, 142, 255, .13) 0%, transparent 65%);
	pointer-events: none;
}

.hero-glow2 {
	position: absolute;
	bottom: -5%;
	left: -5%;
	width: 50%;
	aspect-ratio: 1;
	background: radial-gradient(circle, rgba(56, 217, 245, .06) 0%, transparent 65%);
	pointer-events: none;
}

.hero-inner {
	display: grid;
	grid-template-columns: 1.1fr .9fr;
	gap: 3rem;
	align-items: center;
	padding: 50px 20px;
	max-width: 1160px;
	margin: 0 auto;
	width: 100%;
}

.hero-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .75rem;
	background: var(--ac-dim);
	border: 1px solid rgba(108, 142, 255, .2);
	padding: .38rem 1rem .38rem .75rem;
	border-radius: 100px;
	font-family: var(--mono);
	font-size: .67rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ac);
	margin-bottom: 1.8rem;
}

.hero-eyebrow .dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #3ddc97;
	flex-shrink: 0;
	box-shadow: 0 0 8px #3ddc97
}

.hero-name {
	font-family: var(--serif);
	font-size: clamp(3.4rem, 8.5vw, 7.2rem);
	font-weight: 800;
	line-height: .92;
	letter-spacing: -.035em;
	color: var(--t1);
	margin-bottom: 1.8rem;
}

.hero-name em {
	display: block;
	font-style: italic;
	font-weight: 300;
	color: var(--ac);
	letter-spacing: -.02em
}

.hero-desc {
	font-size: clamp(.92rem, 1.4vw, 1.05rem);
	color: var(--t2);
	max-width: 480px;
	line-height: 1.85;
	margin-bottom: 2.5rem;
}

.hero-btns {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap
}

/* portrait frame */
.hero-portrait {
	position: relative
}

.portrait-frame {
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid var(--b2);
	background: radial-gradient(80% 80% at 50% 20%, rgba(108, 142, 255, .18), transparent 60%), linear-gradient(180deg, rgba(16, 20, 31, .9), rgba(6, 8, 15, 1));
	box-shadow: 0 24px 80px rgba(0, 0, 0, .5), 0 0 0 1px var(--b1);
}

.portrait-frame img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: contain;
	display: block;
	filter: grayscale(4%) contrast(1.03);
	padding: 1.6rem 1.1rem 0;
	transition: filter .4s, transform .5s var(--ease);
	transform: translateY(-4px) scale(1.02);
}

.portrait-frame:hover img {
	filter: grayscale(0%);
	transform: translateY(-4px) scale(1.04)
}

/* floating name card */
.portrait-card {
	position: absolute;
	bottom: .8rem;
	left: .8rem;
	right: .8rem;
	background: rgba(6, 8, 15, .82);
	backdrop-filter: blur(16px);
	border: 1px solid var(--b2);
	border-radius: 10px;
	padding: calc(.9rem + 2px) 1.1rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: nowrap;
	gap: .6rem;
}

.portrait-card-l {
	display: flex;
	align-items: center;
	gap: .6rem;
	min-width: 0
}

.portrait-card-l .name {
	font-size: .92rem;
	font-weight: 600;
	color: var(--t1)
}

.portrait-card-l .role {
	font-family: var(--mono);
	font-size: calc(.6rem + 2px);
	letter-spacing: .08em;
	color: var(--ac);
	margin-top: .1rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}

.avail {
	white-space: nowrap;
	display: flex;
	align-items: center;
	gap: .45rem;
	font-size: calc(.7rem + 2px);
	color: #3ddc97;
	font-family: var(--mono)
}

.avail-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #3ddc97;
	box-shadow: 0 0 8px #3ddc97
}

/* stats bar */
.hero-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--b1);
	position: relative;
	z-index: 2;
}

.h-stat {
	padding: 1.6rem clamp(1.25rem, 4vw, 3rem);
	border-right: 1px solid var(--b1);
	display: flex;
	;
	gap: .35rem;
	align-items: center;
	transition: background .25s;
}

.h-stat:last-child {
	border-right: none
}

.h-stat:hover {
	background: var(--bg2)
}

.stat-n {
	font-family: var(--serif);
	font-size: clamp(1.8rem, 3.5vw, 2.6rem);
	font-weight: 800;
	color: var(--ac);
	line-height: 1;
}

.stat-l {
	font-size: calc(.7rem + 2px);
	font-weight: 500;
	letter-spacing: .05em;
	color: var(--t3);
	text-transform: uppercase;
	border-top: 1px solid var(--b1)
}

.about-grid {
	display: grid;
	grid-template-columns: 5fr 7fr;
	gap: clamp(2.5rem, 5vw, 5rem);
	align-items: start;
	margin-top: 50px;
}

.about-img-box {
	position: relative
}

.about-img-inner {
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid var(--b2);
	background: radial-gradient(80% 80% at 50% 20%, rgba(108, 142, 255, .18), transparent 60%), linear-gradient(180deg, rgba(16, 20, 31, .0), rgba(6, 8, 15, 1));
	box-shadow: 0 24px 80px rgba(0, 0, 0, .5), 0 0 0 1px var(--b1);
}

.about-img-inner img {
	width: 100%;
	aspect-ratio: 3/4;
	object-fit: cover;
	object-position: top;
	filter: grayscale(10%);
	transition: filter .4s, transform .5s var(--ease);
}

.about-img-inner:hover img {
	filter: grayscale(0%);
	transform: translateY(-4px) scale(1.02);
	font-size: clamp(1.15rem, 2.2vw, 1.5rem);
	font-weight: 400;
	font-style: italic;
	line-height: 1.55;
	color: var(--t1);
}

.about-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-top: 2rem
}


.tag:hover {
	border-color: var(--ac);
	color: var(--ac)
}

/* ─────────────────────────────────────────
   VENTURES
───────────────────────────────────────── */
.ventures {
	border-top: 1px solid var(--b1);
	overflow: hidden
}

.ventures-bg {
	position: absolute;
	top: 0;
	right: -4rem;
	font-family: var(--serif);
	font-size: clamp(10rem, 22vw, 22rem);
	font-weight: 800;
	color: transparent;
	-webkit-text-stroke: 1px rgba(108, 142, 255, .04);
	line-height: 1;
	pointer-events: none;
	user-select: none;
	z-index: 0;
}

.v-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: var(--b1);
	border: 1px solid var(--b1);
	border-radius: 10px;
	overflow: hidden;
	position: relative;
	z-index: 1;
	margin-top: 50px;
}

.v-card {
	background: var(--bg1);
	padding: clamp(1.5rem, 3vw, 2.2rem);
	/* display:flex; */
	gap: 0;
	transition: background .3s;
	cursor: default;
	position: relative;
	overflow: hidden;
}

.v-card:hover {
	background: var(--bg3)
}

.v-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(90deg, var(--ac), var(--cy));
	transform: translateY(-4px) scale(1.02);
	transform-origin: left;
	transition: transform .4s var(--ease);
}

.v-card:hover::before {
	transform: translateY(-4px) scale(1.02);
	font-size: clamp(2rem, 3.5vw, 2.8rem);
	font-weight: 800;
	color: var(--ac);
	opacity: .15;
	line-height: 1;
	margin-bottom: 1.1rem;
	transition: opacity .3s;
}

.v-card:hover .v-year {
	opacity: .55
}

/* org logo in card */
.v-logo {
	margin-bottom: 1rem;
	height: 28px;
	display: flex;
	align-items: center;
}

.v-logo img {
	max-height: 28px;
	width: auto;
	max-width: 110px;
	object-fit: contain;
}

.v-card:hover .v-logo img {
	opacity: .85
}

.v-sector {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-family: var(--mono);
	font-size: calc(.6rem + 2px);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--cy);
	border: 1px solid rgba(56, 217, 245, .2);
	padding: .2rem .6rem;
	border-radius: 100px;
	margin-bottom: .85rem;
	align-self: flex-start;
}

.v-title {
	font-family: var(--serif);
	font-size: 1.08rem;
	font-weight: 600;
	color: var(--t1);
	margin-bottom: .7rem;
	line-height: 1.3
}

.v-desc {
	font-size: .865rem;
	color: var(--t2);
	line-height: 1.78;
	flex: 1
}

.v-new {
	position: absolute;
	top: 1.1rem;
	right: 1.1rem;
	font-family: var(--mono);
	font-size: .55rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	background: var(--rose);
	color: #fff;
	padding: .22rem .55rem;
	border-radius: 100px;
}

/* ─────────────────────────────────────────
   SERVICES
───────────────────────────────────────── */
.services {
	background: var(--bg2);
	border-top: 1px solid var(--b1)
}

.s-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem
}

.s-card {
	background: var(--bg1);
	border: 1px solid var(--b1);
	border-radius: 10px;
	padding: clamp(1.8rem, 3.5vw, 2.5rem);
	/* display:flex; */
	gap: 0;
	transition: border-color .3s, transform .35s var(--ease), box-shadow .35s;
}

.s-card:hover {
	border-color: var(--b3);
	transform: translateY(-4px) scale(1.02);
	box-shadow: 0 20px 56px rgba(0, 0, 0, .35), 0 0 0 1px var(--b2);
}

.s-icon {
	width: 50px;
	height: 50px;
	background: var(--ac-dim);
	border: 1px solid rgba(108, 142, 255, .18);
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ac);
	margin-bottom: 1.5rem;
	transition: background .3s, transform .3s;
	padding: 5px;
}

.s-icon svg {
	fill: var(--ac);
	width:24px;
	height:24px;
}
.s-title,.s-desc{
    transition:background .3s,transform .3s;
}

.s-card:hover .s-icon {
	background: rgba(108, 142, 255, .2);
	transform: translateY(-4px) scale(1.02);
	font-size: 1.35rem;
	font-weight: 600;
	color: var(--t1);
	margin-bottom: .7rem
}

.s-desc {
	font-size: .92rem;
	color: var(--t2);
	line-height: 1.8;
	flex: 1
}

.s-link {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	margin-top: 1.4rem;
	font-size: .78rem;
	font-weight: 600;
	color: var(--ac);
	letter-spacing: .03em;
	transition: gap .25s var(--ease), opacity .25s;
	opacity: 0;
}

.s-card:hover .s-link {
	opacity: 1;
	gap: .7rem
}

/* ─────────────────────────────────────────
   SKILLS
───────────────────────────────────────── */
.skills {
	border-top: 1px solid var(--b1)
}

.skills-wrap {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(3rem, 6vw, 6rem);
	align-items: center;
}

/* .sk-list{display:flex;;gap:1.7rem} */
.sk-row {
	margin-bottom: 20px;
}

.sk-top {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: .55rem
}

.sk-name {
	font-size: .88rem;
	font-weight: 600;
	color: var(--t1);
	letter-spacing: .02em
}

.sk-pct {
	font-family: var(--mono);
	font-size: .68rem;
	color: var(--ac)
}

.sk-track {
	height: 2px;
	background: var(--b2);
	border-radius: 1px;
	overflow: hidden
}

.sk-bar {
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, var(--ac), var(--cy));
	border-radius: 1px;
	transition: width 1.3s var(--ease)
}

/* ─────────────────────────────────────────
   PRODUCTS
───────────────────────────────────────── */
.products {
	background: var(--bg2);
	border-top: 1px solid var(--b1)
}

.p-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.6rem
}

.p-card {
	background: var(--bg1);
	border: 1px solid var(--b1);
	border-radius: 10px;
	overflow: hidden;
	transition: border-color .3s, transform .35s var(--ease), box-shadow .35s;
}

.p-card:hover {
	border-color: var(--b2);
	transform: translateY(-4px) scale(1.02);
	box-shadow: 0 24px 56px rgba(0, 0, 0, .4);
}

.p-thumb {
	position: relative;
	overflow: hidden;
}

.p-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .55s var(--ease), filter .4s;
	filter: saturate(.85)
}

.p-card:hover .p-thumb img {
	transform: translateY(-4px) scale(1.02);
	filter: saturate(1)
}

.p-ov {
	position: absolute;
	inset: 0;
	background: rgba(6, 8, 15, .75);
	backdrop-filter: blur(4px);
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity .3s;
}

.p-card:hover .p-ov {
	opacity: 1
}

.p-btn {
	font-family: var(--mono);
	font-size: calc(.7rem + 2px);
	letter-spacing: .08em;
	color: var(--ac);
	border: 1.5px solid var(--ac);
	padding: .5rem 1.1rem;
	border-radius: 100px;
	transition: background .2s, color .2s;
}

.p-btn:hover {
	background: var(--ac);
	color: #fff
}

.p-info {
	padding: 1.1rem 1.2rem 1.4rem
}

.p-cat {
	font-family: var(--mono);
	font-size: .58rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ac);
	background: var(--ac-dim);
	border-radius: 100px;
	padding: .18rem .6rem;
	display: inline-block;
	margin-bottom: .6rem;
}

.p-name {
	font-size: .93rem;
	font-weight: 600;
	color: var(--t1);
	margin-bottom: .2rem;
	line-height: 1.3
}

.p-sub {
	font-size: .76rem;
	color: var(--t3)
}

.thvv-port  {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 50px;
    align-items: center;
}

/* ─────────────────────────────────────────
   BLOG
───────────────────────────────────────── */
.blog{border-top:1px solid var(--b1);background:var(--bg1)}
.blog .sec-head{margin-bottom:3rem}
.blog-sub{font-size:.95rem;color:var(--t2);margin-top:1rem;max-width:480px;line-height:1.75}

/* FEATURED */
.blog-featured{
  display:grid;grid-template-columns:1fr 1fr;
  gap:0;border:1px solid var(--b1);border-radius:14px;
  overflow:hidden;margin-bottom:2.5rem;
  background:var(--bg2);
  transition:border-color .3s,box-shadow .35s;
}
.blog-featured:hover{border-color:var(--b2);box-shadow:0 24px 64px rgba(0,0,0,.4)}
.blog-feat-img{
  position:relative;background:var(--bg3);
  display:flex;align-items:center;justify-content:center;
  min-height:320px;overflow:hidden;
}
.blog-feat-img::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 30% 40%,var(--ac-glow),transparent 60%),
             radial-gradient(ellipse at 70% 60%,var(--cy-dim),transparent 55%);
}
.blog-feat-placeholder{
  position:relative;z-index:1;color:var(--ac);
  display:flex;align-items:center;justify-content:center;
  width:100%;height:100%;
}
.blog-feat-tag{
  position:absolute;top:1.2rem;left:1.2rem;
  font-family:var(--mono);font-size:.55rem;letter-spacing:.1em;text-transform:uppercase;
  background:var(--ac);color:#fff;
  padding:.22rem .65rem;border-radius:100px;z-index:2;
}
.blog-feat-body{
  padding:clamp(2rem,4vw,3rem);
  display:flex;flex-direction:column;justify-content:center;gap:1.2rem;
}
.blog-feat-title{
  font-family:var(--serif);
  font-size:clamp(1.3rem,2.5vw,1.75rem);
  font-weight:600;line-height:1.2;letter-spacing:-.02em;color:var(--t1);
}
.blog-feat-excerpt{font-size:.92rem;color:var(--t2);line-height:1.82}
.blog-read-more{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.82rem;font-weight:600;letter-spacing:.04em;
  color:var(--ac);margin-top:.5rem;
  transition:gap .3s var(--ease),color .2s;
  width:fit-content;
}
.blog-read-more:hover{gap:.9rem;color:var(--ac-lt)}
.blog-read-more span{transition:transform .3s var(--ease)}
.blog-read-more:hover span{transform:translateX(3px)}

/* META */
.blog-meta{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap}
.blog-cat{
  font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cy);border:1px solid rgba(56,217,245,.2);
  padding:.18rem .55rem;border-radius:100px;
}
.blog-dot{color:var(--t3);font-size:.75rem}
.blog-date,.blog-read{font-family:var(--mono);font-size:.65rem;letter-spacing:.04em;color:var(--t3)}

/* CARD GRID */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-bottom:2.5rem}
.blog-card{
  background:var(--bg2);border:1px solid var(--b1);border-radius:12px;
  overflow:hidden;display:flex;flex-direction:column;
  transition:border-color .3s,transform .35s var(--ease),box-shadow .35s;
}
.blog-card:hover{border-color:var(--b2);transform:translateY(-5px);box-shadow:0 20px 48px rgba(0,0,0,.35)}
.blog-card-img-link{display:block}
.blog-card-img{height:160px;overflow:hidden;position:relative}
.blog-card-placeholder{
  width:100%;height:100%;
  background:radial-gradient(ellipse at 40% 50%,hsl(var(--hue,220) 60% 30% / .35),transparent 65%),var(--bg3);
  display:flex;align-items:center;justify-content:center;
  color:var(--ac);transition:transform .55s var(--ease);
}
.blog-card:hover .blog-card-placeholder{transform:scale(1.05)}
.blog-card-body{padding:1.4rem 1.5rem 1.6rem;display:flex;flex-direction:column;gap:.85rem;flex:1}
.blog-card-title{
  font-family:var(--serif);
  font-size:1rem;font-weight:600;line-height:1.35;
  letter-spacing:-.015em;color:var(--t1);transition:color .2s;
  text-decoration:none;display:block;
}
.blog-card:hover .blog-card-title{color:var(--ac-lt)}
.blog-card-excerpt{font-size:.855rem;color:var(--t2);line-height:1.78;flex:1}
.blog-card-foot{display:flex;align-items:center;justify-content:space-between;padding-top:.6rem;border-top:1px solid var(--b1)}
.blog-arrow{
  display:flex;align-items:center;justify-content:center;
  font-size:.8rem;color:var(--t2);
  transition:border-color .25s,color .25s,background .25s,transform .3s var(--ease);
}
/*.blog-card:hover .blog-arrow{border-color:var(--ac);color:var(--ac);background:var(--ac-dim);transform:rotate(-45deg)}*/.
.blog-arrow:hover{
    letter-spacing:1.2px;
    color:var(--ac);
}

/* CTA */
.blog-cta{display:flex;justify-content:center;padding-top:.5rem}
.rv.up.d3.skills-grid.thvv-port.visible {
    background: #ffffff;
    padding: 20px;
    border-radius: 22px;
}
.btn-appointment{
    position:fixed;
    bottom:25px;
    right:25px;
    z-index:9999;
}
.modal-content{
    background-color: #1a2034;
}
.modal-title {
    color:#fff;
}
.btn-cv{
    position:relative;
}
.btn-cv .wpcf7-spinner{
    position:absolute;
    right:20px;
    top:20px;
}
.btn-cv p{
    margin-bottom:0;
}
/*single blog page */
.bc-banner {
  padding: 80px 0 60px;
  background: linear-gradient(rgba(0,0,0,.65), rgba(0,0,0,.65)),
              url('https://himanshumehta.net/newport/wp-content/uploads/2018/02/Flux_Dev_ultra_realistic_photograph_of_a_modern_learning_and_t_3.jpg');
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  text-align: center;
  border-bottom: 3px solid var(--ac);
}
.bc-banner-title h1 {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(1.4rem, 3.2vw, 2.1rem);
  font-weight: 600;
  color: var(--white);
  text-transform: uppercase;
  letter-spacing: .07em;
  line-height: 1.28;
  max-width: 860px;
  margin: 0 auto;
}

/* Banner Wrapper */


/* Title */
.bc-banner-title {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 20px;
    line-height: 1.3;
}

/* Breadcrumb Container */
.pf-breadcrumb {
    display: flex;
    justify-content: center;
}

/* Breadcrumb List */
.bc-list {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(10px);
    list-style: none;
}

/* Breadcrumb Item */
.bc-item {
    font-size: 14px;
    display: flex;
    align-items: center;
}

/* Links */
.bc-link {
    color: #cbd5f5;
    text-decoration: none;
    padding: 6px 10px;
    border-radius: 8px;
    transition: all 0.3s ease;
}

/* Hover Effect */
.bc-link:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
}

/* Separator */
.bc-sep {
    color: #94a3b8;
    font-size: 14px;
}

/* Current Page */
.bc-current {
    color: #fff;
    font-weight: 600;
    padding: 6px 10px;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    border-radius: 8px;
}

/* Responsive */
@media (max-width: 768px) {
    .bc-banner-title {
        font-size: 22px;
    }

    .bc-list {
        flex-wrap: wrap;
        justify-content: center;
    }
}
/* ═══════════════════════════════════════════
   PAGE LAYOUT  (#primary style)
═══════════════════════════════════════════ */
#primary {
  max-width: 1100px;
  margin: 0 auto;
  padding: 48px 24px 80px;
  display: grid;
  grid-template-columns: 1fr 270px;
  gap: 32px;
  align-items: start;
}

/* ═══════════════════════════════════════════
   SINGLE POST WRAP
═══════════════════════════════════════════ */
.single-post-wrap {}

/* ── Hero ── */
.single-hero {
  overflow: hidden;
  border: 1px solid var(--border);
  border-bottom: none;
}
.single-hero-img { position: relative; line-height: 0; }
.single-hero-img img {
  width: 100%; height: 300px; object-fit: cover; display: block;
}
.single-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 50%, rgba(14,14,14,.6) 100%);
  pointer-events: none;
}

/* ── Container  (hentry pattern) ── */
.single-container {
  padding: 28px 30px 32px;
  background-color: var(--surface);
  border: 1px solid var(--border);
  word-wrap: break-word;
}

/* ── Meta ── */
.single-meta {
  display: flex; align-items: center;
  gap: 0; flex-wrap: wrap;
  margin-bottom: 14px;
  font-size: 15px;
  color: var(--white);
}
.single-cat {
  color: rgb(108 142 255 / 85%);
  font-size: 15px; font-weight: 400;
  transition: color .3s;
  margin-right: 8px;
}
.single-cat:hover { color: var(--ac); }
.single-date, .single-read { color: var(--muted); font-size: .85rem; }
.single-date::before, .single-read::before {
  content: '·'; margin: 0 8px; color: var(--border);
}

/* ── Title  (entry-title pattern) ── */
.single-title {
  font-family: 'Oswald', sans-serif;
  font-size: clamp(1.3rem, 2.6vw, 1.7rem);
  font-weight: 600;
  color: var(--white);
  text-transform: capitalize;
  line-height: 1.28;
  letter-spacing: .01em;
  margin-top: 0;
  margin-bottom: 18px;
  transition: color .3s;
}

/* ── Author row ── */
.single-author-row {
  display: flex; align-items: center; gap: 10px;
  padding-bottom: 20px; margin-bottom: 22px;
  border-bottom: 1px solid var(--border);
}
.single-avatar {
  width: 36px; height: 36px; border-radius: 50%;
  border: 2px solid var(--border); overflow: hidden; flex-shrink: 0;
}
.single-author-name { font-size: .8rem; color: var(--muted); font-weight: 400; }

/* ── Content  (entry-content pattern) ── */
.single-content { font-size: 15px; color: var(--fg); margin-bottom: 0; }
.single-content p { margin-bottom: 1.5em; }
.single-content p:last-child { margin-bottom: 0; }
.single-content a { color: rgba(108,142,255,.8); transition: color .3s; }
.single-content a:hover { color: var(--ac); }

/* ── Post Nav ── */
.single-nav {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
  margin-top: 28px; padding-top: 22px;
  border-top: 1px solid var(--border);
}
.single-nav-link {
  display: flex; align-items: center; gap: 12px;
  padding: 16px; background: var(--bg);
  border: 1px solid var(--border); text-decoration: none;
  transition: border-color .3s, background .3s;
}
.single-nav-link:hover { border-color: var(--ac); background: #1a1500; }
.single-nav-next { flex-direction: row-reverse; }
.single-nav-arrow {
  font-size: 1.1rem; color: var(--ac); flex-shrink: 0; line-height: 1;
}
.single-nav-info { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.single-nav-next .single-nav-info { align-items: flex-end; }
.single-nav-label {
  font-size: .62rem; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase; color: var(--ac);
}
.single-nav-ptitle {
  font-size: .8rem; font-weight: 400; color: var(--fg);
  line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
  transition: color .3s;
}
.single-nav-link:hover .single-nav-ptitle { color: var(--white); }

/* ═══════════════════════════════════════════
   COMMENTS  (cv_comment_form pattern)
═══════════════════════════════════════════ */
.single-comments-wrap {
  margin-top: 0;
}

.cmt-section {
  border: 1px solid var(--border);
  border-top: none;
  background: var(--surface);
}

/* Heading */
.cmt-heading {
  color: var(--white);
  text-decoration: none;
  text-transform: capitalize;
  font-family: 'Oswald', sans-serif;
  font-size: 22px; font-weight: 600;
  margin-top: 0; margin-bottom: 1.2em;
}
.cmt-count { color: var(--ac); }

/* List */
.cmt-list {
  list-style: none; margin: 0; padding: 0;
}
.cmt-item {
  border-bottom: 1px solid #222;
  padding: 14px 0; margin-bottom: 10px;
}
.cmt-item:last-child { border-bottom: none; margin-bottom: 0; }

/* Comment body */
.cmt-body {}
.cmt-meta-row {
  display: flex; align-items: flex-start;
  gap: 14px; margin-bottom: 10px; flex-wrap: wrap;
}
.cmt-avatar-wrap {
  flex-shrink: 0;
}
.cmt-avatar {
  width: 48px; height: 48px; border-radius: 50%;
  border: 2px solid var(--border);
}
.cmt-meta {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 3px;
}
.cmt-author {
  font-size: .9rem; font-weight: 600; color: var(--white);
}
.cmt-time {
  font-size: .75rem; color: var(--muted);
  display: block;
}
.cmt-reply {
  margin-left: auto; align-self: center; flex-shrink: 0;
}
.cmt-reply a {
  font-size: .75rem; font-weight: 600;
  letter-spacing: .04em; text-transform: uppercase;
  color: var(--ac); text-decoration: none;
  transition: color .3s;
}
.cmt-reply a:hover { color: var(--ac-lt); }
.cmt-text {
  font-size: 15px; color: var(--fg); line-height: 1.72;
  padding-left: 62px;       /* align under avatar */
}
.cmt-text p { margin-bottom: .8em; }
.cmt-text p:last-child { margin-bottom: 0; }
.cmt-text a { color: rgba(108,142,255,.8); }
.cmt-text a:hover { color: var(--ac); }

/* ── Comment Form (cv_comment_form pattern) ── */
.cmt-form-wrap {
  margin-top: 28px; padding-top: 24px;
  border-top: 1px solid var(--border);
}
.cmt-form-title {
  color: var(--white);
  font-family: 'Oswald', sans-serif;
  font-size: 22px; font-weight: 600;
  text-transform: capitalize;
  margin-top: 0; margin-bottom: 1.2em;
  display: flex; align-items: center; gap: 12px;
  flex-wrap: wrap;
}
.cmt-cancel a {
  font-size: .78rem; font-weight: 400;
  text-transform: none; color: var(--muted);
  transition: color .3s;
}
.cmt-cancel a:hover { color: var(--ac); }

.cmt-form {}
.cmt-field-wrap { margin-bottom: 24px; }
.cmt-label {
  display: block; font-size: .82rem; font-weight: 600;
  color: var(--white); margin-bottom: 8px; text-transform: capitalize;
}
.cmt-required { color: var(--ac); margin-left: 2px; }

/* Textarea – matches cv_comment_form textarea */
.cmt-textarea {
  width: 100%; border-radius: 0;
  padding: 10px 15px;
  margin-bottom: 0;
  height: 200px; resize: vertical; line-height: 1.5;
  background-color: #010101;
  border: 1px solid transparent;
  font-weight: 400; color: var(--white);
  font-family: 'Open Sans', sans-serif; font-size: 15px;
  transition: background-color .3s, border-color .3s;
  outline: none;
}
.cmt-textarea:hover,
.cmt-textarea:focus { background-color: #010101; border-color: var(--ac); }
.cmt-textarea::placeholder { color: var(--muted); }

/* Submit row */
.cmt-submit-row { display: flex; align-items: center; gap: 16px; margin-top: 8px; }

/* Submit button – matches input[type=submit].cv_btn */
.cmt-submit.btn-primary {
  height: 50px; line-height: 50px;
  color: var(--white); font-size: 15px; font-weight: 400;
  padding: 0 24px; border-radius: 0;
  min-width: 160px; outline: 0; cursor: pointer;
  display: inline-block; text-align: center;
  text-transform: capitalize;
  background-color: var(--ac);
  border: 1px solid var(--ac);
  font-family: 'Open Sans', sans-serif;
  transition: background .3s, color .3s;
}
.cmt-submit.btn-primary:hover {
  background: var(--surface);
  color: var(--ac);
  border-color: var(--ac);
}

/* ═══════════════════════════════════════════
   SIDEBAR  (cat_sidebar pattern)
═══════════════════════════════════════════ */
.cat_sidebar { display: flex; flex-direction: column; gap: 40px; }

.cat_sidebar .widget { margin-bottom: 0; }

.cat_sidebar .widget-title {
  color: var(--white);
  text-decoration: none;
  text-transform: capitalize;
  font-family: 'Oswald', sans-serif;
  font-size: 18px; font-weight: 600;
  margin-top: 0; padding-bottom: 10px;
  margin-bottom: 15px;
  position: relative;
}
.cat_sidebar .widget-title::after {
  position: absolute; content: '';
  bottom: 0; left: 0; width: 100%; height: 1px;
  background: var(--border);
}

/* Search widget */
.cat_sidebar .widget_search .search-form {
  display: flex; margin-top: 4px;
}
.cat_sidebar .widget_search .search-field {
  width: 100%; padding: 0 10px; height: 40px;
  background: var(--surface);
  border: 1px solid var(--border); border-right: none;
  border-radius: 0; color: var(--white);
  font-family: 'Open Sans', sans-serif; font-size: .82rem;
  outline: none; transition: border-color .3s;
}
.cat_sidebar .widget_search .search-field:focus { border-color: var(--ac); }
.cat_sidebar .widget_search .search-field::placeholder { color: var(--muted); }
.cat_sidebar .widget_search .search-submit {
  width: 75px; height: 40px; flex-shrink: 0;
  background: var(--ac); border: 1px solid var(--ac);
  border-radius: 0; color: var(--surface);
  font-size: 14px; font-weight: 600;
  font-family: 'Open Sans', sans-serif;
  cursor: pointer; letter-spacing: .04em;
  transition: background .3s, color .3s, border-color .3s;
}
.cat_sidebar .widget_search .search-submit:hover {
  background: transparent; border-color: var(--ac); color: var(--ac);
}

/* Recent posts */
.cat_sidebar .widget ul {
  list-style: none; margin: 0; padding: 0;
}
.cat_sidebar .widget ul li {
  padding: 5px 0; color: var(--fg);
  border-bottom: 1px solid var(--border);
}
.cat_sidebar .widget ul li:last-child { padding-bottom: 0; border-bottom: none; }
.cat_sidebar .widget ul li a {
  font-size: 15px; color: var(--fg);
  padding-right: 5px; transition: color .3s;
  text-decoration: none;
}
.cat_sidebar .widget ul li a:hover { color: var(--ac); }

/* ═══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
.site-footer {
  background: var(--surface);
  border-top: 1px solid var(--border);
  padding: 20px 32px;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px;
}
.footer-copy { font-size: .75rem; color: var(--muted); }
.social-links { display: flex; gap: 10px; }
.social-links a {
  width: 30px; height: 30px;
  border: 1px solid var(--border); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--muted); font-size: .68rem; font-weight: 600;
  transition: all .3s;
}
.social-links a:hover { border-color: var(--ac); color: var(--ac); background: rgba(212,160,23,.08); }

.single-post-wrap {
    max-width: 1100px;
    width: 100%;
    margin: auto;
}
/* ── Post Navigation ── */
.single-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid var(--border);
}

.single-nav-link {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 22px;
  background: #161616;
  border: 1px solid #2a2a2a;
  border-radius: 8px;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: border-color .25s, background .25s, transform .2s;
}

.single-nav-link::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(212,160,23,.06) 0%, transparent 60%);
  opacity: 0;
  transition: opacity .25s;
}

.single-nav-link:hover {
  border-color: var(--ac);
  background: #1a1500;
  transform: translateY(-2px);
}

.single-nav-link:hover::before { opacity: 1; }

.single-nav-next { flex-direction: row-reverse; }

.single-nav-arrow {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  background: #1e1e1e;
  border: 1px solid #2a2a2a;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  color: #666;
  transition: background .25s, border-color .25s, color .25s;
}

.single-nav-link:hover .single-nav-arrow {
  background: rgba(212,160,23,.12);
  border-color: var(--ac);
  color: var(--ac);
}

.single-nav-info {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
  flex: 1;
}

.single-nav-next .single-nav-info { align-items: flex-end; }

.single-nav-label {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ac);
  opacity: 0.75;
  transition: opacity .25s;
}

.single-nav-link:hover .single-nav-label { opacity: 1; }

.single-nav-ptitle {
  font-size: 0.85rem;
  font-weight: 500;
  color: #aaa;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color .25s;
}

.single-nav-link:hover .single-nav-ptitle { color: #fff; }

.single-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 40px;
  padding-top: 32px;
  border-top: 1px solid var(--border);
}

.single-nav-link {
  display: flex;
  align-items: center;
  gap: 0;
  text-decoration: none;
  background: #161616;
  border: 1px solid #2a2a2a;
  border-radius: 10px;
  overflow: hidden;
  min-height: 80px;
  transition: border-color .22s, transform .18s;
}
.single-nav-link:hover {
  border-color: var(--ac);
  transform: translateY(-2px);
}

/* ← flush left tab for prev */
.single-nav-arrow {
  flex-shrink: 0;
  width: 50px;
  height:50px;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #666;
  background: #1e1e1e;
  border-right: 1px solid #2a2a2a;
  transition: background .22s, color .22s, border-color .22s;
}

/* → flush right tab for next */
.single-nav-next .single-nav-arrow {
  border-right: none;
  border-left: 1px solid #2a2a2a;
}

.single-nav-link:hover .single-nav-arrow {
  background: rgba(212,160,23,.1);
  color: var(--ac);
  border-color: var(--ac);
}

.single-nav-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 0px 0;
  min-width: 0;
}
.single-nav-next .single-nav-info {
  align-items: flex-end;
  text-align: left !important;
  order: 1;
}

.single-nav-label {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--ac);
  opacity: 0.75;
  transition: opacity .2s;
}
.single-nav-link:hover .single-nav-label { opacity: 1; }

.single-nav-ptitle {
  font-size: 0.83rem;
  font-weight: 500;
  color: #aaa;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color .25s;
}
.single-nav-link:hover .single-nav-ptitle { color: #fff; }

/* ===== LAYOUT ===== */
.pf-blog-main {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 40px;
  max-width: 1200px;
  margin: 50px auto;
  padding: 0 20px;
}

@media (max-width: 992px) {
  .pf-blog-main {
    grid-template-columns: 1fr;
  }
}

/* ===== POST CARD ===== */
.single-container {
  background: linear-gradient(180deg, var(--bg2), var(--bg3));
  border: 1px solid var(--b1);
  padding: 32px;
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.6);
  transition: 0.4s var(--ease);
}

.single-container:hover {
  border-color: var(--b2);
}

/* ===== FEATURE IMAGE ===== */
.single-feat-img {
  overflow: hidden;
  border-radius: 14px;
  margin-bottom: 20px;
}

.single-feat-img img {
  width: 100%;
  transition: 0.6s var(--ease);
}

.single-feat-img:hover img {
  transform: scale(1.04);
}

/* ===== META ===== */
.single-meta {
  display: flex;
  gap: 12px;
  font-size: 13px;
  color: var(--t3);
  margin-bottom: 15px;
}

.single-cat {
  background: var(--ac-dim);
  color: var(--ac);
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  text-decoration: none;
  transition: 0.3s;
}

.single-cat:hover {
  background: var(--ac);
  color: #fff;
  box-shadow: 0 0 15px var(--ac-glow);
}

/* ===== TITLE ===== */
.single-title {
  font-family: var(--serif);
  font-size: 30px;
  line-height: 1.3;
  color: var(--t1);
  margin-bottom: 18px;
}

/* ===== AUTHOR ===== */
.single-author-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 25px;
}

.single-avatar {
  border-radius: 50%;
  border: 1px solid var(--b2);
}

.single-author-name {
  color: var(--t2);
  font-size: 14px;
}

/* ===== CONTENT ===== */
.single-content {
  font-size: 16px;
}

.single-content p {
  margin-bottom: 20px;
  color: var(--t2);
}

.single-content h2 {
  margin-top: 30px;
  color: var(--t1);
}

.single-content a {
  color: var(--cy);
  text-decoration: none;
}

.single-content a:hover {
  text-decoration: underline;
}

/* ===== NAVIGATION ===== */
.single-nav {
  display: flex;
  gap: 20px;
  margin-top: 50px;
}

.single-nav-link {
  flex: 1;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--bg3);
  border: 1px solid var(--b1);
  padding: 18px;
  border-radius: 12px;
  text-decoration: none;
  color: var(--t2);
  transition: 0.4s var(--ease);
}

.single-nav-link:hover {
  background: var(--bg4);
  border-color: var(--ac);
  transform: translateY(-4px);
  box-shadow: 0 10px 30px var(--ac-dim);
}

/* ===== COMMENTS ===== */
.single-comments-wrap {
  margin-top: 60px;
}

.cmt-heading {
  font-size: 22px;
  color: var(--t1);
  margin-bottom: 20px;
}

.cmt-item {
  background: var(--bg2);
  border: 1px solid var(--b1);
  padding: 20px;
  border-radius: 12px;
  margin-bottom: 15px;
  transition: 0.3s;
}

.cmt-item:hover {
  border-color: var(--b2);
  background: var(--bg3);
}

.cmt-meta-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.cmt-author {
  color: var(--t1);
  font-weight: 600;
}

.cmt-time {
  font-size: 12px;
  color: var(--t3);
}

.cmt-text {
  color: var(--t2);
  font-size: 14px;
}

/* ===== COMMENT FORM ===== */
.cmt-textarea {
  width: 100%;
  background: var(--bg2);
  border: 1px solid var(--b1);
  padding: 12px;
  border-radius: 10px;
  color: var(--t1);
}

.cmt-textarea:focus {
  border-color: var(--ac);
  outline: none;
  box-shadow: 0 0 0 2px var(--ac-dim);
}

.cmt-submit {
  background: linear-gradient(135deg, var(--ac), var(--cy));
  color: #fff;
  border: none;
  padding: 12px 20px;
  border-radius: 8px;
  cursor: pointer;
  transition: 0.3s;
}

.cmt-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px var(--ac-glow);
}

/* ===== SIDEBAR ===== */
.pf-sidebar {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* ===== SIDEBAR CARD ===== */
.sb-widget {
  background: var(--bg2);
  border: 1px solid var(--b1);
  padding: 20px;
  border-radius: 14px;
  transition: 0.3s;
}

.sb-widget:hover {
  border-color: var(--b2);
  background: var(--bg3);
}

.sb-widget-title {
  font-size: 16px;
  color: var(--t1);
  margin-bottom: 15px;
}

/* ===== SEARCH ===== */
.sb-search-inner {
  display: flex;
  border: 1px solid var(--b1);
  border-radius: 10px;
  overflow: hidden;
  background: var(--bg1);
}

.sb-search-input {
  flex: 1;
  padding: 10px;
  background: transparent;
  border: none;
  color: var(--t1);
}

.sb-search-btn {
  background: var(--ac);
  border: none;
  padding: 0 15px;
  color: #fff;
}

/* Full-bleed breadcrumb banner even inside narrow containers */
.bc-banner,
.bc-bar {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Blog layout wrapper (archive/search/404 with sidebar) */
.pf-blog-wrap {
  max-width: 1200px;
  margin: 50px auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 40px;
}
.pf-blog-wrap--left {
  grid-template-columns: 320px minmax(0, 1fr);
}
.pf-blog-wrap--full {
  grid-template-columns: minmax(0, 1fr);
}
.pf-blog-wrap .pf-blog-main {
  display: block;
  max-width: none;
  margin: 0;
  padding: 0;
}

/* Single post: let inner grid handle layout (avoid extra wrapper grid) */
.single .pf-blog-wrap {
  display: block;
  max-width: 1200px;
  margin: 50px auto;
  padding: 0 20px;
}

/* Single post keeps its own internal grid */
.pf-blog-main.single-post-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 40px;
  max-width: 1200px;
  margin: 50px auto;
  padding: 0 20px;
}
@media (max-width: 992px) {
  .pf-blog-wrap {
    grid-template-columns: 1fr;
  }
  .pf-blog-main.single-post-wrap {
    grid-template-columns: 1fr;
  }
}

/* 404 Page */
.pf-404-wrap {
  min-height: calc(100vh - var(--nav-h));
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(3rem, 8vw, 6rem) clamp(1.25rem, 5vw, 3.5rem);
}
.pf-404-inner {
  width: 100%;
  max-width: 820px;
  text-align: center;
  padding: clamp(2rem, 5vw, 3.5rem);
  border-radius: 16px;
  background: linear-gradient(180deg, var(--bg2), var(--bg1));
  border: 1px solid var(--b1);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}
.pf-404-code {
  font-family: var(--serif);
  font-size: clamp(4rem, 12vw, 8rem);
  letter-spacing: -0.04em;
  color: var(--ac);
  margin-bottom: 0.5rem;
  text-shadow: 0 12px 30px rgba(108, 142, 255, 0.28);
}
.pf-404-title {
  font-family: var(--serif);
  font-size: clamp(1.6rem, 3.2vw, 2.4rem);
  margin-bottom: 0.75rem;
}
.pf-404-desc {
  color: var(--t2);
  margin-bottom: 1.6rem;
  line-height: 1.7;
}
.pf-404-search {
  margin: 0 auto 1.6rem;
  max-width: 520px;
}
.pf-404-search-inner {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem;
  border-radius: 999px;
  border: 1px solid var(--b1);
  background: var(--bg2);
}
.pf-404-search-input {
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--t1);
  padding: 0.6rem 1rem;
}
.pf-404-search-btn {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid var(--b1);
  color: var(--t1);
  background: var(--bg3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.pf-404-search-btn:hover {
  transform: translateY(-2px);
  border-color: var(--ac);
  color: var(--ac);
}
.pf-404-actions {
  display: flex;
  gap: 0.9rem;
  justify-content: center;
  flex-wrap: wrap;
}

/* Search Page */
.blog-search-header {
  padding: 1.6rem 0 2.2rem;
  border-bottom: 1px solid var(--b1);
  margin-bottom: 2rem;
}
.blog-search-label {
  color: var(--t3);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.7rem;
  margin-bottom: 0.4rem;
}
.blog-search-term {
  font-family: var(--serif);
  font-size: clamp(1.6rem, 3.2vw, 2.6rem);
  margin-bottom: 0.6rem;
}
.blog-search-count {
  color: var(--t2);
  margin-bottom: 1.2rem;
}
.blog-search-inner {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.45rem;
  border-radius: 999px;
  border: 1px solid var(--b1);
  background: var(--bg2);
}
.blog-search-input {
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--t1);
  padding: 0.7rem 1rem;
}

.blog-post-list {
  display: grid;
  gap: 1.5rem;
}
.blog-result-card {
  display: flex;
  gap: 1.6rem;
  padding: 1.2rem;
  border-radius: 14px;
  border: 1px solid var(--b1);
  background: var(--bg2);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.blog-result-card:hover {
  transform: translateY(-4px);
  border-color: var(--b2);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
}
.blog-result-thumb-link {
  flex: 0 0 220px;
  border-radius: 12px;
  overflow: hidden;
  background: var(--bg3);
}
.blog-result-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.blog-result-body {
  flex: 1;
  min-width: 0;
}
.blog-result-meta {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  margin-bottom: 0.5rem;
}
.blog-result-cat {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ac);
}
.blog-result-date {
  color: var(--t3);
  font-size: 0.8rem;
}
.blog-result-title {
  font-family: var(--serif);
  font-size: 1.25rem;
  margin-bottom: 0.55rem;
}
.blog-result-excerpt {
  color: var(--t2);
  line-height: 1.7;
  margin-bottom: 0.9rem;
}
.blog-result-foot {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: var(--t3);
  font-size: 0.85rem;
}
.blog-result-read {
  color: var(--t1);
  text-decoration: none;
}
.blog-result-read:hover {
  color: var(--ac);
}
.blog-result-time {
  margin-left: auto;
}
.search-highlight {
  background: rgba(108, 142, 255, 0.25);
  color: #fff;
  padding: 0 0.2rem;
  border-radius: 3px;
}

/* Archive Page */
.pf-archive-header {
  padding: 1.6rem 0 2.2rem;
  border-bottom: 1px solid var(--b1);
  margin-bottom: 2rem;
}
.pf-archive-label {
  color: var(--t3);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.7rem;
  margin-bottom: 0.4rem;
}
.pf-archive-title {
  font-family: var(--serif);
  font-size: clamp(1.6rem, 3.2vw, 2.6rem);
  margin-bottom: 0.6rem;
}
.pf-archive-desc {
  color: var(--t2);
  line-height: 1.7;
  margin-bottom: 0.6rem;
}
.pf-archive-count {
  color: var(--t3);
}
.pf-archive-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
.pf-archive-card {
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  border: 1px solid var(--b1);
  background: var(--bg2);
  overflow: hidden;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.pf-archive-card:hover {
  transform: translateY(-4px);
  border-color: var(--b2);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
}
.pf-arc-thumb-link {
  display: block;
  background: var(--bg3);
}
.pf-arc-thumb {
  width: 100%;
  height: 200px;
  object-fit: cover;
}
.pf-arc-body {
  padding: 1.1rem 1.2rem 1.3rem;
}
.pf-arc-meta {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  margin-bottom: 0.5rem;
}
.pf-arc-cat {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ac);
}
.pf-arc-date {
  color: var(--t3);
  font-size: 0.8rem;
}
.pf-arc-title {
  font-family: var(--serif);
  font-size: 1.2rem;
  margin-bottom: 0.55rem;
}
.pf-arc-excerpt {
  color: var(--t2);
  line-height: 1.7;
  margin-bottom: 0.9rem;
}
.pf-arc-foot {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: var(--t3);
  font-size: 0.85rem;
}
.pf-arc-read {
  color: var(--t1);
  text-decoration: none;
}
.pf-arc-read:hover {
  color: var(--ac);
}
.pf-arc-time {
  margin-left: auto;
}

/* Shared Empty State */
.blog-no-results {
  text-align: center;
  padding: 3rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--b1);
  background: var(--bg2);
}
.blog-no-results-title {
  font-family: var(--serif);
  margin: 0.8rem 0 0.5rem;
}
.blog-no-results-text {
  color: var(--t2);
  margin-bottom: 1.2rem;
}

/* Pagination */
.blog-pagination {
  margin-top: 2rem;
  display: flex;
  justify-content: center;
}
.blog-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  margin: 0 0.2rem;
  border-radius: 999px;
  border: 1px solid var(--b1);
  color: var(--t2);
  text-decoration: none;
  transition: all 0.2s ease;
}
.blog-pagination .page-numbers:hover {
  border-color: var(--ac);
  color: var(--t1);
}
.blog-pagination .page-numbers.current {
  background: var(--ac);
  border-color: var(--ac);
  color: #fff;
}

/* Responsive */
@media (max-width: 1024px) {
  .pf-archive-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 860px) {
  .blog-result-card {
    flex-direction: column;
  }
  .blog-result-thumb-link {
    flex: 0 0 auto;
  }
}
@media (max-width: 640px) {
  .pf-archive-grid {
    grid-template-columns: 1fr;
  }
}


/* ===== RECENT POSTS ===== */
.sb-recent-item {
  display: flex;
  gap: 10px;
  margin-bottom: 12px;
}

.sb-recent-thumb {
  border-radius: 6px;
}

.sb-recent-title {
  color: var(--t2);
  font-size: 14px;
  text-decoration: none;
}

.sb-recent-title:hover {
  color: var(--ac);
}

/* ===== CATEGORY ===== */
.sb-cat-list a {
  display: flex;
  justify-content: space-between;
  color: var(--t2);
  text-decoration: none;
}

.sb-cat-list a:hover {
  color: var(--cy);
}

/* ===== SCROLLBAR (OPTIONAL MODERN TOUCH) ===== */
::-webkit-scrollbar {
  width: 8px;
}

/* ===== NAV WRAPPER ===== */
.single-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 0;
}

@media (max-width: 768px) {
  .single-nav {
    grid-template-columns: 1fr;
  }
}

/* ===== NAV CARD ===== */
.single-nav-link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;

  padding: 20px;
  border-radius: 14px;

  background: linear-gradient(145deg, var(--bg2), var(--bg3));
  border: 1px solid var(--b1);

  text-decoration: none;
  color: var(--t2);

  transition: all 0.4s var(--ease);
  overflow: hidden;
}

/* glow border effect */
.single-nav-link::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(120deg, transparent, var(--ac-glow), transparent);
  opacity: 0;
  transition: 0.4s;
}

/* hover */
.single-nav-link:hover {
  transform: translateY(-6px) scale(1.01);
  border-color: var(--ac);
  box-shadow: 0 15px 40px rgba(0,0,0,0.6),
              0 0 30px var(--ac-dim);
}

.single-nav-link:hover::before {
  opacity: 1;
}

/* ===== TEXT ===== */
.single-nav-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* label (Previous / Next) */
.single-nav-label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--t3);
}

/* title */
.single-nav-ptitle {
  font-size: 15px;
  font-weight: 500;
  color: var(--t1);
  line-height: 1.4;

  transition: 0.3s;
}

.single-nav-link:hover .single-nav-ptitle {
  color: var(--ac-lt);
}

/* ===== ARROW ===== */
.single-nav-arrow {
  font-size: 22px;
  color: var(--ac);
  transition: 0.4s var(--ease);
}

/* direction animations */
.single-nav-prev:hover .single-nav-arrow {
  transform: translateX(-6px);
}

.single-nav-next:hover .single-nav-arrow {
  transform: translateX(6px);
}

/* ===== SIDE ALIGNMENT ===== */
.single-nav-prev {
  text-align: left;
}

.single-nav-next {
  text-align: right;
}

/* ===== OPTIONAL: subtle divider line ===== */
.single-nav::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 60%;
  background: var(--b1);
  top: 20%;
  display: none;
}

/* ===== BASE ===== */
.single-nav-link {
  display: flex;
  align-items: center;
  gap: 15px;
}

/* ===== PREVIOUS (arrow LEFT) ===== */
.single-nav-prev {
  flex-direction: row; /* default */
}

/* ===== NEXT (arrow RIGHT) ===== */
.single-nav-next {
  flex-direction: row-reverse;
  text-align: right;
}

/* fix text alignment */
.single-nav-next .single-nav-info {
  align-items: flex-end;
}

/* spacing consistency */
.single-nav-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
}
::-webkit-scrollbar-thumb {
  background: var(--bg4);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--ac);
}
.search-form label > input{
    width:100%;
    border-radius:50px;
}
.search-form input.search-submit{
    width:30%;
    border-radius:50px;
}

.widget_recent_entries ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* ===== ITEM ===== */
.widget_recent_entries li {
  margin-bottom: 10px;
}

/* ===== LINK CARD ===== */
.widget_recent_entries a {
  display: block;
  padding: 12px 14px;
  border-radius: 10px;
  background: var(--bg1);
  border: 1px solid var(--b1);
  font-size:12px;
  text-transform:capitalize;

  color: var(--t2);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.5;

  transition: all 0.35s var(--ease);
  position: relative;
}

/* hover */
.widget_recent_entries a:hover {
  background: var(--bg4);
  border-color: var(--ac);
  color: var(--t1);
  transform: translateX(6px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.6),
              0 0 15px var(--ac-dim);
}

/* arrow indicator */
.widget_recent_entries a::after {
  content: "→";
  position: absolute;
  right: 12px;
  opacity: 0;
  transform: translateX(-5px);
  transition: 0.3s;
  color: var(--ac);
}

/* arrow animation */
.widget_recent_entries a:hover::after {
  opacity: 1;
  transform: translateX(0);
}

/* active/current post */
.widget_recent_entries a[aria-current="page"] {
  background: linear-gradient(135deg, var(--ac-dim), var(--cy-dim));
  border-color: var(--ac);
  color: var(--t1);
  box-shadow: 0 0 20px var(--ac-glow);
}
/* ===== LIST ===== */
.widget_categories ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* ===== ITEM ===== */
.widget_categories li {
  margin-bottom: 10px;
}

/* ===== LINK ===== */
.widget_categories a {
  display: flex;
  justify-content: space-between;
  align-items: center;

  padding: 12px 14px;
  border-radius: 10px;

  background: var(--bg1);
  border: 1px solid var(--b1);

  color: var(--t2);
  text-decoration: none;
  font-size: 14px;

  transition: all 0.35s var(--ease);
  position: relative;
}

/* hover */
.widget_categories a:hover {
  background: var(--bg4);
  border-color: var(--ac);
  color: var(--t1);
  transform: translateX(6px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.6),
              0 0 15px var(--ac);
}

/* ===== ARROW ===== */
.widget_categories a::after {
  content: "→";
  position: absolute;
  right: 12px;
  opacity: 0;
  transform: translateX(-5px);
  transition: 0.3s;
  color: var(--ac);
}

.widget_categories a:hover::after {
  opacity: 1;
  transform: translateX(0);
}

/* ===== COUNT BADGE (if added later) ===== */
.widget_categories a span {
  background: var(--ac-dim);
  color: var(--ac);
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 999px;
}

/* ===== ACTIVE CATEGORY ===== */
.widget_categories .current-cat a {
  background: linear-gradient(135deg, var(--ac-dim), var(--cy-dim));
  border-color: var(--ac);
  color: var(--t1);
  box-shadow: 0 0 20px var(--ac-glow);
}
/* ===== TAG CONTAINER ===== */
.tagcloud {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* ===== TAG ITEM ===== */
.tagcloud a {
  display: inline-flex;
  align-items: center;
  gap: 6px;

  padding: 6px 12px;
  border-radius: 999px;

  background: var(--bg1);
  border: 1px solid var(--b1);

  color: var(--t2);
  font-size: 12px !important;
  text-decoration: none;

  transition: all 0.3s var(--ease);
  position: relative;
}

/* ===== COUNT STYLE ===== */
.tagcloud .tag-link-count {
  color: var(--t3);
  font-size: 11px;
}

/* ===== HOVER EFFECT ===== */
.tagcloud a:hover {
  background: linear-gradient(135deg, var(--ac-dim), var(--cy-dim));
  border-color: var(--ac);
  color: var(--t1);

  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0,0,0,0.5),
              0 0 15px var(--ac-glow);
}

/* ===== GLOW BORDER ANIMATION ===== */
.tagcloud a::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(120deg, transparent, var(--ac-glow), transparent);
  opacity: 0;
  transition: 0.4s;
}

.tagcloud a:hover::before {
  opacity: 1;
}

/* ===== ACTIVE TAG (optional class) ===== */
.tagcloud a.active {
  background: linear-gradient(135deg, var(--ac), var(--cy));
  color: #fff;
  border-color: transparent;
  box-shadow: 0 0 20px var(--ac-glow);
}
.search-submit{
    	display: inline-flex;
	align-items: center;
	gap: .55rem;
	font-family: var(--sans);
	font-size: .82rem;
	font-weight: 600;
	letter-spacing: .04em;
	border-radius: 100px;
	cursor: pointer;
	color: #fff;
	text-align: center;
	justify-content: center;
	text-transform:capitalize;
		background: var(--ac);
}
/* ── Responsive ── */
@media (max-width: 600px) {
  .single-nav { grid-template-columns: 1fr; }
}
/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 820px) {
  #primary { grid-template-columns: 1fr; }
  .single-nav { grid-template-columns: 1fr; }
  .site-nav { display: none; }
  #primary { padding: 28px 16px 56px; }
  .cmt-text { padding-left: 0; }
}
/* RESPONSIVE */
@media(max-width:900px){
  .blog-featured{grid-template-columns:1fr}
  .blog-feat-img{min-height:220px}
  .blog-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .blog-grid{grid-template-columns:1fr}
}


/* ─────────────────────────────────────────
   CONTACT
───────────────────────────────────────── */
.contact {
	border-top: 1px solid var(--b1)
}

.contact-wrap {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(3rem, 6vw, 6rem);
	align-items: baseline;
}

.c-details {
	margin-top: 2.5rem;
	display: flex;
	;
	gap: 1.8rem;
	flex-direction: column;
}

.c-item {}

.c-lbl {
	font-family: var(--mono);
	font-size: .62rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ac);
	display: block;
	margin-bottom: .4rem
}

.c-val {
	font-family: var(--serif);
	font-size: 1.05rem;
	font-weight: 400;
	color: var(--t1);
	transition: color .2s;
	line-height: 1.5
}

a.c-val:hover {
	color: var(--ac)
}

.c-form {
	display: flex;
	;
	gap: 1.3rem;
	padding-top: 0;
	flex-direction: column;
}

.f-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.3rem
}

input,
textarea {
	width: 100%;
	background: var(--bg2);
	border: 1.5px solid var(--b2);
	border-radius: 8px;
	padding: .78rem 1rem;
	color: var(--t1);
	font-family: var(--sans);
	font-size: .92rem;
	font-weight: 400;
	outline: none;
	resize: none;
	transition: border-color .25s, box-shadow .25s;
	margin-bottom: 12px;
}

input::placeholder,
textarea::placeholder {
	color: var(--t3);
	font-size: .88rem
}

input:focus,
textarea:focus {
	border-color: var(--ac);
	box-shadow: 0 0 0 3px var(--ac-dim);
}

/* ─────────────────────────────────────────
   FOOTER
───────────────────────────────────────── */
.footer {
	background: var(--bg0);
	border-top: 1px solid var(--b1);
	padding: 2rem 0
}

.footer-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1.2rem
}

.footer-brand {
	font-family: var(--serif);
	font-size: 1.3rem;
	font-weight: 800;
	color: var(--t1)
}

.footer-brand span {
	color: var(--ac)
}

.footer-copy {
	font-family: var(--mono);
	font-size: 13px;
	letter-spacing: .05em;
	color: var(--t3)
}

.footer-nav {
	display: flex;
	gap: 1.8rem;
	flex-wrap: wrap
}

.footer-nav a {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--t3);
	transition: color .2s
}

.footer-nav a:hover {
	color: var(--ac)
}

.modal-backdrop.show {
    background: rgba(12, 6, 18, 0.1) !important;
    backdrop-filter: blur(5px) !important;
    opacity: 1 !important;
}

.btn-close {
    background: none; /* remove default icon */
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: #ff3b3b;
    position: relative;
    opacity: 1;
}

/* Create X icon */
.btn-close::before,
.btn-close::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 2px;
    background: #fff;
    transform-origin: center;
}

.btn-close::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.btn-close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

/* Hover effect */
.btn-close:hover {
    background-color: #e60000;
}
.modal-header .btn-close{
    padding:0;
}
@media (min-width: 992px) {
    .modal-lg, .modal-xl {
        --bs-modal-width: 550px;
    }
}
/* ─────────────────────────────────────────
   RESPONSIVE
───────────────────────────────────────── */
@media(max-width:1024px) {
	.v-grid {
		grid-template-columns: repeat(2, 1fr)
	}

	.p-grid {
		grid-template-columns: repeat(2, 1fr)
	}
}

@media(max-width:768px) {
	.nav {
		grid-template-columns: 1fr auto 1fr;
	}

	.nav-links {
		display: none
	}

	.nav-cta {
		display: none
	}

	.burger {
		display: flex
	}

	.burger {
        display: flex;
        height: 30px;
        align-items: center;
        justify-content: center;
        padding: 5px;
	}

	.hero-inner {
		grid-template-columns: 1fr
	}

	.hero-portrait {
		display: block
	}

	.hero-stats {
		grid-template-columns: repeat(2, 1fr)
	}

	.about-grid {
		grid-template-columns: 1fr
	}

	.about-img-inner img {
		aspect-ratio: 4/3
	}

	.s-grid {
		grid-template-columns: 1fr
	}

	.skills-wrap {
		grid-template-columns: 1fr
	}

	.contact-wrap {
		grid-template-columns: 1fr
	}

	.f-row {
		grid-template-columns: 1fr
	}

	.footer-inner {
		;
		align-items: flex-start;
		gap: 1rem
	}
}

@media(max-width:480px) {
	.hero-portrait {
		display: block
	}

	.portrait-frame img {
		height: auto;
		min-height: 320px;
		transform: translateY(-4px) scale(1.02);
	}

	.body-txt.mb-18 {
		margin-bottom: 1.1rem
	}

	.sec-h2.mt-6 {
		margin-top: .6rem
	}

	.body-txt.mt-13 {
		margin-top: 1.3rem
	}

	.c-val.small {
		font-size: .95rem
	}

	.btn.full {
		width: 100%;
		justify-content: center;
		font-size: .88rem;
		padding: .88rem;
		border-radius: 8px
	}


	/* ─────────────────────────────────────────
   REDUX DYNAMIC VARS FALLBACKS
   (overridden inline from Redux options)
───────────────────────────────────────── */
	:root {
		--nav-bg: rgba(11, 14, 23, 0.85);
		--logo-h: 40px;
		--footer-bg: var(--bg0);
		--font-base: 16px;
		--brand-font: var(--serif);
		--brand-weight: 800;
		--brand-size: 1.55rem;
		--brand-color: var(--t1);
	}

	/* Logo sizing from Redux */
	.nav-logo img,
	.nav-brand img {
		max-height: var(--logo-h);
		width: auto;
		display: block;
	}

	.nav-logo--text {
		font-family: var(--serif);
		font-weight: 600;
		font-size: 1.2rem;
		color: var(--t1);
	}

	/* Footer tagline + social from Redux */
	.footer-tagline {
		color: var(--t2);
		font-size: .875rem;
		margin-top: .5rem;
		margin-bottom: 1rem;
	}

	.footer-social {
		display: flex;
		gap: .75rem;
		flex-wrap: wrap;
	}

	.social-link {
		color: var(--t2);
		font-size: .75rem;
		font-family: var(--mono);
		letter-spacing: .04em;
		text-transform: uppercase;
		border: 1px solid var(--b2);
		padding: .25rem .6rem;
		border-radius: var(--r);
		transition: color .2s, border-color .2s;
	}

	.social-link:hover {
		color: var(--ac);
		border-color: var(--ac);
	}

	/* ─────────────────────────────────────────
   MISSING / ADDED CLASSES
───────────────────────────────────────── */

	/* Section head */
	.sec-head {
		margin-bottom: 3rem;
	}

	/* About section */
	.about-lead {
		font-size: clamp(1.1rem, 2vw, 1.35rem);
		font-weight: 400;
		font-style: italic;
		font-family: var(--serif);
		line-height: 1.6;
		color: var(--t1);
		margin-bottom: 1.6rem;
	}

	.about-corner {
		position: absolute;
		bottom: -1px;
		right: -1px;
		width: 40px;
		height: 40px;
		background: var(--bg1);
		clip-path: polygon(100% 0, 100% 100%, 0 100%);
	}

	.about-text-col {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	/* Elementor editor: always show rv elements */
	.elementor-editor-active .rv,
	.elementor-editor-active .rv.clip {
		opacity: 1 !important;
		transform: none !important;
		clip-path: none !important;
		filter: none !important;
	}

	.s-card .s-icon .e-font-icon-svg {
		fill: #fff;
	}

	/* Skills section */
	.skills-grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 1.4rem 3rem;
		margin-top: 3rem;
	}

	.skill-item {}

	.skill-row {
		display: flex;
		justify-content: space-between;
		align-items: baseline;
		margin-bottom: .55rem;
	}

	.skill-label {
		font-size: .88rem;
		font-weight: 600;
		color: var(--t1);
		letter-spacing: .02em;
	}

	.skill-pct {
		font-family: var(--mono);
		font-size: .68rem;
		color: var(--ac);
	}

	.skill-cat {
		font-family: var(--mono);
		font-size: .55rem;
		letter-spacing: .1em;
		text-transform: uppercase;
		color: var(--cy);
		border: 1px solid rgba(56, 217, 245, .25);
		padding: .15rem .5rem;
		border-radius: 100px;
		margin-left: .5rem;
	}

	.skill-track {
		height: 2px;
		background: var(--b2);
		border-radius: 1px;
		overflow: hidden;
	}

	.skill-fill {
		height: 100%;
		width: 0;
		background: linear-gradient(90deg, var(--ac), var(--cy));
		border-radius: 1px;
		transition: width 1.3s cubic-bezier(0.16, 1, 0.3, 1);
	}

	/* Ventures — v-year */
	.v-year {
		font-family: var(--mono);
		font-size: clamp(2rem, 3.5vw, 2.8rem);
		font-weight: 800;
		color: var(--ac);
		opacity: .15;
		line-height: 1;
		margin-bottom: 1.1rem;
		transition: opacity .3s;
	}

	/* Nav logo text fallback */
	.nav-logo--text {
		text-decoration: none;
	}

	.nav-logo--text span {
		color: var(--ac);
	}

	/* Elementor: remove default section padding when widget fills it */
	.elementor-widget-hm_hero .elementor-widget-container,
	.elementor-widget-hm_about .elementor-widget-container,
	.elementor-widget-hm_ventures .elementor-widget-container,
	.elementor-widget-hm_services .elementor-widget-container,
	.elementor-widget-hm_skills .elementor-widget-container,
	.elementor-widget-hm_products .elementor-widget-container,
	.elementor-widget-pf_contact .elementor-widget-container {
		padding: 0 !important;
		margin: 0 !important;
	}


	/* Services grid responsive */
	@media (max-width: 768px) {
		.s-grid {
			grid-template-columns: 1fr;
		}

		.skills-wrap {
			grid-template-columns: 1fr;
		}

		.skills-grid {
			grid-template-columns: 1fr;
		}

		.p-grid {
			grid-template-columns: 1fr 1fr;
		}

		.v-grid {
			grid-template-columns: 1fr 1fr;
		}
	}

	@media (max-width: 480px) {
		.p-grid {
			grid-template-columns: 1fr;
		}

		.v-grid {
			grid-template-columns: 1fr;
		}

		.f-row {
			grid-template-columns: 1fr;
		}
	}
	




