/* =========================================================
   Ismail Hosen Fahim — main.css
   Minimalist / premium / editorial / black & white / bold type
   ========================================================= */

:root{
	--color-black:#111111;
	--color-white:#ffffff;
	--color-gray:#767676;
	--color-gray-light:#f4f4f2;
	--color-border:#e4e4e0;

	--sidebar-width:220px;
	--container-width:1200px;

	--spacing-xs:8px;
	--spacing-sm:16px;
	--spacing-md:28px;
	--spacing-lg:48px;
	--spacing-xl:80px;

	--font-base:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
	--radius-sm:4px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }

body{
	margin:0;
	font-family:var(--font-base);
	color:var(--color-black);
	background:var(--color-white);
	font-size:var(--base-font-size,15px);
	line-height:1.6;
}

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

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

button{ font-family:inherit; cursor:pointer; }

h1,h2,h3,h4{ margin:0; font-weight:800; letter-spacing:-0.02em; line-height:1.05; }

p{ margin:0 0 1em; color:var(--color-gray); }
p:last-child{ margin-bottom:0; }

ul{ list-style:none; margin:0; padding:0; }

:focus-visible{ outline:2px solid var(--color-black); outline-offset:2px; }

/* -------------------- Shell / Layout -------------------- */

.ihf-shell{
	display:flex;
	min-height:100vh;
}

.ihf-main{
	flex:1;
	min-width:0;
	margin-left:var(--sidebar-width);
	display:flex;
	flex-direction:column;
}

.ihf-page{
	width:100%;
	max-width:var(--container-width);
	margin:0 auto;
	padding:var(--spacing-lg) var(--spacing-lg) var(--spacing-xl);
}

/* -------------------- Sidebar -------------------- */

.ihf-sidebar{
	position:fixed;
	top:0; left:0; bottom:0;
	width:var(--sidebar-width);
	border-right:1px solid var(--color-border);
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	padding:var(--spacing-lg) var(--spacing-md);
	background:var(--color-white);
	z-index:100;
}

.ihf-sidebar-top{ margin-bottom:var(--spacing-lg); }

.ihf-monogram{
	display:inline-flex;
	font-weight:900;
	font-size:22px;
	letter-spacing:0.02em;
}
.ihf-monogram img{ max-height:40px; width:auto; }
.ihf-monogram-text{ display:inline-block; }

.ihf-sidebar-nav{ flex:1; }

.ihf-nav-list li{ margin-bottom:var(--spacing-sm); }

.ihf-nav-list a{
	display:inline-flex;
	align-items:center;
	font-size:14px;
	font-weight:500;
	color:var(--color-gray);
	padding-left:14px;
	border-left:2px solid transparent;
	transition:color .15s ease, border-color .15s ease;
}

.ihf-nav-list a:hover{ color:var(--color-black); }

.ihf-nav-list li.current-menu-item > a,
.ihf-nav-list li.current_page_item > a,
.ihf-nav-list li.current-menu-parent > a{
	color:var(--color-black);
	font-weight:600;
	border-left-color:var(--color-black);
}

.ihf-sidebar-bottom{ margin-top:var(--spacing-lg); }

.ihf-social-icons{ display:flex; gap:14px; }
.ihf-social-icons a{
	color:var(--color-black);
	opacity:.7;
	transition:opacity .15s ease;
}
.ihf-social-icons a:hover{ opacity:1; }

/* -------------------- Mobile top bar (logo + nav toggle) -------------------- */

.ihf-mobile-topbar{ display:none; }

.ihf-mobile-topbar .ihf-mobile-monogram{
	font-weight:800;
	font-size:18px;
	letter-spacing:-0.02em;
}

.ihf-mobile-toggle{
	display:none;
	flex-shrink:0;
	width:40px; height:40px;
	border:1px solid var(--color-border);
	border-radius:50%;
	background:var(--color-white);
	align-items:center;
	justify-content:center;
	flex-direction:column;
	gap:4px;
}
.ihf-mobile-toggle-bar{
	width:16px; height:2px; background:var(--color-black);
	transition:transform .2s ease, opacity .2s ease;
}

.ihf-mobile-overlay{
	display:none;
	position:fixed; inset:0;
	background:rgba(0,0,0,.35);
	z-index:90;
}

/* -------------------- Buttons -------------------- */

.ihf-btn{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-size:13px;
	font-weight:600;
	letter-spacing:.02em;
	text-transform:uppercase;
	padding:14px 26px;
	border-radius:2px;
	transition:background .15s ease,color .15s ease, opacity .15s ease;
}

.ihf-btn-solid{
	background:var(--color-black);
	color:var(--color-white);
}
.ihf-btn-solid:hover{ opacity:.85; }

.ihf-btn-outline{
	background:transparent;
	color:var(--color-black);
	border:1px solid var(--color-black);
}
.ihf-btn-outline:hover{ background:var(--color-black); color:var(--color-white); }

.ihf-btn-block{ display:flex; justify-content:center; width:100%; margin-top:var(--spacing-sm); }

/* -------------------- Shared section bits -------------------- */

.ihf-eyebrow{
	font-size:12px;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--color-gray);
	margin:0 0 10px;
}

.ihf-section-heading{
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	border-top:1px solid var(--color-border);
	padding-top:var(--spacing-md);
	margin-top:var(--spacing-xl);
	margin-bottom:var(--spacing-md);
}

.ihf-section-title{ font-size:22px; }

.ihf-view-all{
	font-size:13px;
	font-weight:600;
	display:inline-flex;
	align-items:center;
	gap:6px;
}

.ihf-page-title{ font-size:32px; }

.ihf-cv-page-header{ margin-bottom:var(--spacing-lg); }

.ihf-placeholder{
	background:var(--color-gray-light);
	border:1px dashed var(--color-border);
	min-height:220px;
	border-radius:var(--radius-sm);
}

.ihf-empty-note{ color:var(--color-gray); padding:var(--spacing-lg) 0; }

/* -------------------- Home / Hero -------------------- */

.ihf-hero{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:var(--spacing-xl);
	align-items:center;
	padding-top:var(--spacing-sm);
}

.ihf-hero-copy,
.ihf-hero-media{
	min-width:0;
	width:100%;
}

.ihf-hero-location{
	text-align:right;
	font-size:11px;
	font-weight:600;
	letter-spacing:.1em;
	text-transform:uppercase;
	color:var(--color-gray);
	margin-bottom:var(--spacing-md);
	border-bottom:1px solid var(--color-border);
	padding-bottom:var(--spacing-sm);
}

.ihf-hero-title{
	font-size:56px;
	margin-bottom:var(--spacing-sm);
}

.ihf-hero-role{
	font-size:13px;
	font-weight:700;
	letter-spacing:.1em;
	text-transform:uppercase;
	margin-bottom:var(--spacing-sm);
}

.ihf-hero-desc{ max-width:420px; margin-bottom:var(--spacing-md); }

.ihf-hero-img{
	width:100%;
	aspect-ratio:4/5;
	object-fit:cover;
	border-radius:var(--radius-sm);
}

/* -------------------- Selected Works / Portfolio grid -------------------- */

.ihf-works-grid,
.ihf-works-grid-archive{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:var(--spacing-md);
}

.ihf-work-card{ display:flex; flex-direction:column; }

.ihf-work-media{
	display:block;
	aspect-ratio:4/3.2;
	overflow:hidden;
	border-radius:var(--radius-sm);
	margin-bottom:var(--spacing-sm);
	background:var(--color-black);
}
.ihf-work-media img{ width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.ihf-work-media:hover img{ transform:scale(1.04); }

.ihf-work-cat-row{
	display:flex;
	justify-content:space-between;
	font-size:11px;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:var(--color-gray);
	margin-bottom:6px;
}

.ihf-work-title{ font-size:17px; margin-bottom:4px; }
.ihf-work-desc{ font-size:13px; }

/* -------------------- Blog posts grid -------------------- */

.ihf-posts-grid{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:var(--spacing-lg);
}
.ihf-post-media{ display:block; aspect-ratio:16/10; overflow:hidden; border-radius:var(--radius-sm); margin-bottom:var(--spacing-sm); }
.ihf-post-media img{ width:100%; height:100%; object-fit:cover; }

/* -------------------- CV / Portfolio page -------------------- */

.ihf-cv-grid{
	display:grid;
	grid-template-columns:230px 1.4fr 1fr;
	gap:var(--spacing-lg);
	align-items:start;
}

.ihf-profile-card{
	border:1px solid var(--color-border);
	border-radius:var(--radius-sm);
	padding:var(--spacing-md);
	margin-bottom:var(--spacing-lg);
}

.ihf-profile-avatar{
	width:72px; height:72px;
	border-radius:50%;
	overflow:hidden;
	margin-bottom:var(--spacing-sm);
}
.ihf-profile-avatar img{ width:100%; height:100%; object-fit:cover; }

.ihf-profile-name{ font-size:18px; margin-bottom:2px; }
.ihf-profile-role{ font-size:12px; color:var(--color-gray); margin-bottom:var(--spacing-sm); }
.ihf-profile-bio{ font-size:13px; margin-bottom:var(--spacing-sm); }

.ihf-personal-info{ border-top:1px solid var(--color-border); padding-top:var(--spacing-sm); margin-bottom:var(--spacing-sm); }
.ihf-info-row{ display:flex; justify-content:space-between; font-size:12px; padding:6px 0; }
.ihf-info-row span{ color:var(--color-gray); text-transform:uppercase; letter-spacing:.05em; font-size:10px; }
.ihf-info-row strong{ font-weight:600; text-align:right; }

.ihf-cv-block{ margin-bottom:var(--spacing-lg); }

.ihf-cv-heading{
	font-size:12px;
	font-weight:700;
	letter-spacing:.1em;
	text-transform:uppercase;
	border-top:1px solid var(--color-border);
	padding-top:var(--spacing-sm);
	margin-bottom:var(--spacing-md);
	display:flex;
	align-items:center;
	gap:8px;
}

.ihf-count-badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:16px; height:16px;
	border-radius:50%;
	background:var(--color-black);
	color:var(--color-white);
	font-size:9px;
}

.ihf-cv-row{
	display:grid;
	grid-template-columns:110px 1fr;
	gap:var(--spacing-sm);
	margin-bottom:var(--spacing-md);
}
.ihf-cv-row-date{ font-size:11px; color:var(--color-gray); text-transform:uppercase; letter-spacing:.05em; }
.ihf-cv-row-main{ grid-column:2; }
.ihf-cv-row-title{ font-size:15px; margin-bottom:2px; }
.ihf-cv-row-sub{ font-size:12px; color:var(--color-gray); margin-bottom:2px; display:flex; gap:8px; align-items:center; }
.ihf-cv-row-tag{ font-size:10px; padding:2px 6px; border:1px solid var(--color-border); border-radius:20px; text-transform:uppercase; }
.ihf-cv-row-desc{ grid-column:2; font-size:12.5px; }
.ihf-cv-row-desc p{ margin-bottom:.4em; }
.ihf-cv-row-location{ font-size:11px; color:var(--color-gray); margin-top:4px; }

.ihf-cv-list-compact .ihf-cv-row-compact{ margin-bottom:var(--spacing-md); }
.ihf-cv-row-compact-head{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; }
.ihf-cv-row-compact .ihf-cv-row-date{ text-align:right; white-space:nowrap; }
.ihf-cv-row-compact .ihf-cv-row-desc{ font-size:12px; margin-top:2px; }

.ihf-skills-list{ display:flex; flex-direction:column; gap:10px; }
.ihf-skill-row{ display:grid; grid-template-columns:90px 1fr 32px; align-items:center; gap:10px; font-size:11.5px; }
.ihf-skill-name{ color:var(--color-gray); }
.ihf-skill-bar{ height:4px; background:var(--color-border); border-radius:4px; overflow:hidden; display:block; }
.ihf-skill-bar-fill{ display:block; height:100%; background:var(--color-black); }
.ihf-skill-pct{ text-align:right; font-weight:600; }
.ihf-skill-pct-label{ font-weight:500; text-transform:capitalize; }

.ihf-tools-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--spacing-sm); }
.ihf-tool-item{ display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; }
.ihf-tool-icon{ width:40px; height:40px; border:1px solid var(--color-border); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.ihf-tool-icon img{ width:100%; height:100%; object-fit:cover; }
.ihf-tool-abbr-fallback{ font-size:12px; font-weight:700; }
.ihf-tool-label{ font-size:10.5px; color:var(--color-gray); }

.ihf-award-list{ display:flex; flex-direction:column; gap:var(--spacing-sm); }
.ihf-award-row{ display:flex; justify-content:space-between; gap:8px; align-items:baseline; font-size:12.5px; }
.ihf-award-title{ font-size:13px; margin-bottom:2px; }
.ihf-award-org{ font-size:10px; color:var(--color-gray); letter-spacing:.05em; }
.ihf-award-date{ font-size:11px; color:var(--color-gray); white-space:nowrap; }

/* -------------------- About page -------------------- */

.ihf-about-header{
	display:flex;
	justify-content:space-between;
	align-items:flex-end;
	gap:var(--spacing-md);
	margin-bottom:var(--spacing-lg);
	border-bottom:1px solid var(--color-border);
	padding-bottom:var(--spacing-md);
}
.ihf-about-headline{ font-size:38px; max-width:640px; }
.ihf-breadcrumb-text{ font-size:12px; color:var(--color-gray); white-space:nowrap; }

.ihf-about-grid{
	display:grid;
	grid-template-columns:320px 1fr 230px;
	gap:var(--spacing-lg);
	align-items:start;
}
.ihf-about-media img{ border-radius:var(--radius-sm); aspect-ratio:4/5; object-fit:cover; }
.ihf-about-lead{ font-size:16px; color:var(--color-black); margin-bottom:var(--spacing-md); }

/* -------------------- REXBUX / Shop -------------------- */

.ihf-shop-header-top{ display:flex; justify-content:space-between; align-items:flex-start; }
.ihf-shop-utilities{ display:flex; gap:10px; }
.ihf-icon-btn{
	display:inline-flex; align-items:center; gap:6px;
	width:auto; height:36px; padding:0 12px;
	border:1px solid var(--color-border); border-radius:20px;
	font-size:12px;
}
.ihf-shop-title{ font-size:44px; margin:10px 0 12px; }
.ihf-shop-subtitle{ max-width:460px; margin-bottom:var(--spacing-md); }

.ihf-shop-cats{ display:flex; align-items:center; gap:8px; font-size:12px; text-transform:uppercase; letter-spacing:.05em; margin-bottom:var(--spacing-lg); }
.ihf-shop-cat-link{ color:var(--color-gray); }
.ihf-shop-cat-link.is-active,
.ihf-shop-cat-link:hover{ color:var(--color-black); font-weight:600; }
.ihf-shop-cat-sep{ color:var(--color-border); }

.ihf-products-grid,
.woocommerce ul.products{
	display:grid !important;
	grid-template-columns:repeat(4,1fr) !important;
	gap:var(--spacing-md) !important;
	list-style:none !important;
	margin:0 !important;
	padding:0 !important;
}
.woocommerce ul.products li.product{ width:auto !important; margin:0 !important; float:none !important; }

.ihf-product-card,
.woocommerce ul.products li.product{
	display:flex;
	flex-direction:column;
}

.ihf-product-media{ position:relative; display:block; aspect-ratio:1/1; overflow:hidden; border-radius:var(--radius-sm); background:var(--color-gray-light); margin-bottom:10px; }
.ihf-product-media img,
.woocommerce ul.products li.product img{ width:100%; height:100%; object-fit:cover; }

.ihf-sale-flash,
.woocommerce span.onsale{
	position:absolute; top:8px; left:8px;
	background:var(--color-black); color:var(--color-white);
	font-size:9px; text-transform:uppercase; letter-spacing:.05em;
	padding:4px 8px; border-radius:20px;
	min-height:0; min-width:0; line-height:1;
}

.ihf-product-title,
.woocommerce ul.products li.product .woocommerce-loop-product__title{ font-size:14px; margin:0 0 2px; font-weight:600; }
.ihf-product-price,
.woocommerce ul.products li.product .price{ font-size:13px; color:var(--color-gray); margin-bottom:8px; }
.woocommerce ul.products li.product .price ins{ text-decoration:none; color:var(--color-black); }

.ihf-add-to-cart,
.woocommerce a.button, .woocommerce button.button{
	display:inline-flex !important;
	align-items:center; gap:6px;
	font-size:11px !important; font-weight:600 !important;
	text-transform:uppercase; letter-spacing:.03em;
	color:var(--color-black) !important;
	background:transparent !important;
	border:none !important;
	padding:0 !important;
	border-radius:0 !important;
}

.ihf-woo-missing{ border:1px dashed var(--color-border); padding:var(--spacing-lg); border-radius:var(--radius-sm); text-align:center; }

/* WooCommerce cart / checkout / single product minimal compat */
.woocommerce table.shop_table{ border-collapse:collapse; width:100%; font-size:13px; }
.woocommerce table.shop_table th,
.woocommerce table.shop_table td{ border:1px solid var(--color-border); padding:12px; }
.woocommerce-cart .cart-collaterals,
.woocommerce-checkout .col2-set{ display:grid; gap:var(--spacing-lg); }
.woocommerce div.product .woocommerce-tabs ul.tabs li a{ font-weight:600; text-transform:uppercase; font-size:12px; }
.woocommerce .star-rating{ color:var(--color-black); }
.woocommerce .quantity input.qty{ border:1px solid var(--color-border); padding:8px; width:60px; }
.woocommerce div.product p.price{ font-size:22px; font-weight:700; color:var(--color-black); }
.related.products{ margin-top:var(--spacing-xl); }
.related.products > h2{ font-size:20px; margin-bottom:var(--spacing-md); }

/* -------------------- Footer -------------------- */

.ihf-global-footer{
	border-top:1px solid var(--color-border);
	margin-top:auto;
}
.ihf-footer-inner{
	max-width:var(--container-width);
	margin:0 auto;
	padding:var(--spacing-md) var(--spacing-lg);
}
.ihf-footer-text{ font-size:12px; color:var(--color-gray); }

/* -------------------- Comments -------------------- */

.ihf-comments-area{ margin-top:var(--spacing-xl); border-top:1px solid var(--color-border); padding-top:var(--spacing-lg); }
.ihf-comment-list{ margin-bottom:var(--spacing-lg); }
.ihf-comment-list li{ padding:var(--spacing-sm) 0; border-bottom:1px solid var(--color-border); font-size:13px; }
.comment-form input, .comment-form textarea{
	width:100%; padding:12px; border:1px solid var(--color-border); border-radius:var(--radius-sm);
	font-family:inherit; margin-bottom:var(--spacing-sm);
}

/* -------------------- 404 -------------------- */
.ihf-404-page{ text-align:center; padding-top:var(--spacing-xl); }
.ihf-404-page .ihf-hero-desc{ margin:0 auto var(--spacing-md); }
.ihf-404-search{ margin-top:var(--spacing-lg); max-width:340px; margin-left:auto; margin-right:auto; }
.ihf-404-search input[type="search"]{ width:100%; padding:12px; border:1px solid var(--color-border); border-radius:20px; }

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width:1024px){
	.ihf-cv-grid{ grid-template-columns:1fr 1fr; }
	.ihf-cv-side-col{ grid-column:span 2; }
	.ihf-about-grid{ grid-template-columns:1fr 1fr; }
	.ihf-about-aside{ grid-column:span 2; }
	.ihf-works-grid,
	.ihf-works-grid-archive{ grid-template-columns:repeat(2,1fr); }
	.ihf-products-grid,
	.woocommerce ul.products{ grid-template-columns:repeat(3,1fr) !important; }
}

@media (max-width:880px){
	:root{ --spacing-lg:32px; --spacing-xl:56px; --mobile-topbar-height:64px; }

	.ihf-mobile-topbar{
		display:flex;
		align-items:center;
		justify-content:space-between;
		position:fixed;
		top:0; left:0; right:0;
		height:var(--mobile-topbar-height);
		padding:0 var(--spacing-md);
		background:var(--color-white);
		border-bottom:1px solid var(--color-border);
		z-index:95;
	}

	.ihf-mobile-toggle{ display:flex; }

	.ihf-sidebar{
		transform:translateX(-100%);
		transition:transform .25s ease;
		width:min(280px,80vw);
		box-shadow:0 0 40px rgba(0,0,0,.12);
		z-index:100;
	}
	.ihf-sidebar.is-open{ transform:translateX(0); }
	.ihf-mobile-overlay.is-open{ display:block; }

	.ihf-main{ margin-left:0; }

	.ihf-page{ padding:calc(var(--mobile-topbar-height) + var(--spacing-md)) var(--spacing-md) var(--spacing-lg); }

	.ihf-hero{ grid-template-columns:1fr; gap:var(--spacing-lg); }
	.ihf-hero-title{ font-size:38px; }
	.ihf-hero-location{ text-align:left; }

	.ihf-works-grid,
	.ihf-works-grid-archive,
	.ihf-posts-grid{ grid-template-columns:1fr; }

	.ihf-cv-grid{ grid-template-columns:1fr; }
	.ihf-cv-side-col{ grid-column:auto; }

	.ihf-about-header{ flex-direction:column; align-items:flex-start; gap:var(--spacing-sm); }
	.ihf-about-grid{ grid-template-columns:1fr; }
	.ihf-about-aside{ grid-column:auto; }
	.ihf-about-headline{ font-size:28px; }

	.ihf-shop-title{ font-size:32px; }
	.ihf-products-grid,
	.woocommerce ul.products{ grid-template-columns:repeat(2,1fr) !important; }

	.ihf-footer-inner{ padding:var(--spacing-md); }
}

@media (max-width:480px){
	.ihf-hero-title{ font-size:30px; }
	.ihf-products-grid,
	.woocommerce ul.products{ grid-template-columns:1fr !important; }
	.ihf-tools-grid{ grid-template-columns:repeat(2,1fr); }
}
