/* =========================================================
   ENEMYGOD — design system
   Void black / bone white / concrete gray / alert red (urgency only)
   ========================================================= */

:root {
	--eg-black:   #0A0A0A;
	--eg-surface: #161614;
	--eg-line:    #2A2A28;
	--eg-white:   #F2F0E9;
	--eg-gray:    #8A8880;
	--eg-red:     #C41E1E;

	--eg-font-display: 'Archivo Black', Impact, sans-serif;
	--eg-font-body:    'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
	--eg-font-mono:    'JetBrains Mono', 'Courier New', monospace;
}

/* ---------------------------------------------------------
   Reset / base
   --------------------------------------------------------- */
body {
	background: var(--eg-black);
	color: var(--eg-white);
	font-family: var(--eg-font-body);
	font-size: 15px;
	line-height: 1.6;
}
a { color: var(--eg-white); text-decoration: none; transition: opacity .15s ease; }
a:hover { opacity: .7; }
h1, h2, h3, h4 { font-family: var(--eg-font-display); text-transform: uppercase; letter-spacing: -0.5px; color: var(--eg-white); }
::selection { background: var(--eg-red); color: var(--eg-white); }

.site-content, #content, .col-full { background: var(--eg-black); }
.site-header, .site-footer, .storefront-primary-navigation { background: var(--eg-black) !important; border-color: var(--eg-line) !important; }

/* ---------------------------------------------------------
   Header / nav
   --------------------------------------------------------- */
.site-branding .site-title,
.site-branding a {
	font-family: var(--eg-font-display);
	font-size: 20px;
	letter-spacing: 1px;
	color: var(--eg-white) !important;
}
.main-navigation ul li a {
	font-family: var(--eg-font-body);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--eg-gray) !important;
}
.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a { color: var(--eg-white) !important; }
.site-header-cart .cart-contents { color: var(--eg-white) !important; }

/* Status ticker */
.eg-ticker {
	background: var(--eg-black);
	border-top: 1px solid var(--eg-line);
	border-bottom: 1px solid var(--eg-line);
	overflow: hidden;
	padding: 7px 0;
}
.eg-ticker__inner {
	font-family: var(--eg-font-mono);
	font-size: 11px;
	letter-spacing: 0.5px;
	color: var(--eg-red);
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding: 0 16px;
}

/* ---------------------------------------------------------
   Buttons
   --------------------------------------------------------- */
.eg-btn, button, .button, input[type="submit"], .single_add_to_cart_button {
	font-family: var(--eg-font-body) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 1.5px !important;
	text-transform: uppercase !important;
	border-radius: 0 !important;
	padding: 14px 28px !important;
	cursor: pointer;
	transition: all .15s ease;
}
.eg-btn--solid, .button.alt, .single_add_to_cart_button {
	background: var(--eg-white) !important;
	color: var(--eg-black) !important;
	border: 1px solid var(--eg-white) !important;
}
.eg-btn--solid:hover, .button.alt:hover, .single_add_to_cart_button:hover {
	background: transparent !important;
	color: var(--eg-white) !important;
}
.eg-btn--outline, .button, button {
	background: transparent !important;
	color: var(--eg-white) !important;
	border: 1px solid var(--eg-white) !important;
}
.eg-btn--outline:hover, .button:hover, button:hover {
	background: var(--eg-white) !important;
	color: var(--eg-black) !important;
}

/* ---------------------------------------------------------
   Hero (homepage)
   --------------------------------------------------------- */
.eg-hero {
	position: relative;
	min-height: 70vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--eg-black);
	overflow: hidden;
	text-align: center;
}
.eg-hero__canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .5; }
.eg-hero__content { position: relative; z-index: 2; padding: 40px 20px; }
.eg-hero__wordmark {
	font-family: var(--eg-font-display);
	font-size: clamp(40px, 8vw, 88px);
	letter-spacing: -1px;
	color: var(--eg-white);
	margin-bottom: 16px;
}
.eg-hero__logo img { max-height: 70px; width: auto; margin: 0 auto 16px; }
.eg-hero__eyebrow {
	font-family: var(--eg-font-mono);
	font-size: 11px;
	letter-spacing: 2px;
	color: var(--eg-gray);
	margin-bottom: 20px;
}

/* ---------------------------------------------------------
   Countdown
   --------------------------------------------------------- */
.eg-countdown__clock { display: flex; justify-content: center; gap: 10px; margin-top: 8px; }
.eg-countdown__unit {
	background: var(--eg-surface);
	border: 1px solid var(--eg-line);
	padding: 12px 18px;
	min-width: 64px;
}
.eg-countdown--hero .eg-countdown__unit { min-width: 80px; padding: 16px 20px; }
.eg-countdown__num {
	display: block;
	font-family: var(--eg-font-mono);
	font-size: 26px;
	font-weight: 500;
	color: var(--eg-red);
}
.eg-countdown--hero .eg-countdown__num { font-size: 34px; }
.eg-countdown__u {
	display: block;
	font-family: var(--eg-font-mono);
	font-size: 9px;
	letter-spacing: 1.5px;
	color: var(--eg-gray);
	margin-top: 4px;
}
.eg-countdown__label {
	font-family: var(--eg-font-mono);
	font-size: 10px;
	letter-spacing: 1.5px;
	color: var(--eg-gray);
	margin-top: 10px;
}

/* ---------------------------------------------------------
   Stock bar
   --------------------------------------------------------- */
.eg-stockbar { margin-top: 10px; }
.eg-stockbar__track { height: 3px; background: var(--eg-line); width: 100%; }
.eg-stockbar__fill { height: 100%; background: var(--eg-white); transition: width .3s ease; }
.eg-stockbar__fill--low { background: var(--eg-red); }
.eg-stockbar__label {
	font-family: var(--eg-font-mono);
	font-size: 10px;
	letter-spacing: 1px;
	color: var(--eg-gray);
	margin-top: 5px;
}
.eg-stockbar__label--low { color: var(--eg-red); }

/* ---------------------------------------------------------
   Sections / product grid
   --------------------------------------------------------- */
.eg-section { max-width: 1240px; margin: 0 auto; padding: 60px 24px; }
.eg-section__header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 28px; }
.eg-section__title { font-size: 28px; margin: 0; }
.eg-link { font-family: var(--eg-font-mono); font-size: 11px; letter-spacing: 1px; color: var(--eg-gray); }

ul.products, ul.eg-product-grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: var(--eg-line);
	list-style: none;
	margin: 0 !important;
	padding: 0 !important;
}
ul.products li.product, ul.eg-product-grid li.product {
	background: var(--eg-black);
	padding: 18px;
	margin: 0 !important;
	text-align: left !important;
	position: static !important;
}
ul.products li.product img {
	width: 100%;
	aspect-ratio: 4/5;
	object-fit: cover;
	margin-bottom: 12px !important;
	border-radius: 0 !important;
}
ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--eg-font-body);
	font-size: 13px;
	font-weight: 600;
	color: var(--eg-white);
	text-transform: none;
	margin: 0 0 4px;
}
ul.products li.product .price {
	font-family: var(--eg-font-mono);
	font-size: 12px;
	color: var(--eg-gray);
}
ul.products li.product .price ins { text-decoration: none; color: var(--eg-red); }
ul.products li.product .button { display: none; } /* add-to-cart lives on the product page for a drop-culture feel */
.eg-empty-state {
	grid-column: 1 / -1;
	padding: 60px 20px;
	text-align: center;
	font-family: var(--eg-font-mono);
	color: var(--eg-gray);
	font-size: 12px;
}

/* WooCommerce sorting/result bar + pagination */
.woocommerce-ordering select, .woocommerce-result-count { background: var(--eg-black); color: var(--eg-gray); font-family: var(--eg-font-mono); font-size: 11px; }
.woocommerce-pagination a, .woocommerce-pagination span.current {
	font-family: var(--eg-font-mono); border-radius: 0 !important; background: transparent !important;
	color: var(--eg-white) !important; border: 1px solid var(--eg-line) !important;
}

/* ---------------------------------------------------------
   Single product
   --------------------------------------------------------- */
.single-product div.product { color: var(--eg-white); }
.single-product .product_title { font-size: 30px; }
.single-product p.price { font-family: var(--eg-font-mono); font-size: 16px; color: var(--eg-white); }
.single-product .woocommerce-product-details__short-description { color: var(--eg-gray); }
.single-product div.images img { border-radius: 0; }
.single-product .quantity input { background: var(--eg-black); border: 1px solid var(--eg-line); color: var(--eg-white); font-family: var(--eg-font-mono); }
.woocommerce-tabs ul.tabs li a { font-family: var(--eg-font-mono); font-size: 11px; letter-spacing: 1px; color: var(--eg-gray); }
.woocommerce-tabs ul.tabs li.active a { color: var(--eg-white); }
.related.products, .upsells.upsell { border-top: 1px solid var(--eg-line); padding-top: 40px; margin-top: 60px; }
.related.products > h2, .upsells.upsell > h2 { font-size: 22px; }

/* ---------------------------------------------------------
   Cart / checkout
   --------------------------------------------------------- */
table.shop_table { border-color: var(--eg-line) !important; }
table.shop_table th { font-family: var(--eg-font-mono); font-size: 10px; letter-spacing: 1px; color: var(--eg-gray); text-transform: uppercase; }
table.shop_table td { border-color: var(--eg-line) !important; color: var(--eg-white); }
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout textarea,
.woocommerce-checkout select,
.cart input[type="text"] {
	background: var(--eg-black) !important;
	border: 1px solid var(--eg-line) !important;
	color: var(--eg-white) !important;
	border-radius: 0 !important;
}
#order_review, .woocommerce-checkout-review-order { background: var(--eg-surface); border: 1px solid var(--eg-line); padding: 20px; }

/* ---------------------------------------------------------
   Lookbook
   --------------------------------------------------------- */
.eg-lookbook { max-width: 1400px; margin: 0 auto; padding-bottom: 60px; }
.eg-lookbook__masthead { text-align: center; padding: 60px 24px 40px; }
.eg-lookbook__title { font-size: clamp(30px, 6vw, 52px); margin: 6px 0 0; }
.eg-look { position: relative; background: var(--eg-surface); }
.eg-look img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eg-look--hero { min-height: 60vh; margin: 0 24px 1px; }
.eg-look--full { min-height: 50vh; margin: 0 24px 1px; }
.eg-look-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 0 24px 1px; }
.eg-look--half { min-height: 340px; }
.eg-look__placeholder {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
	color: var(--eg-gray); font-family: var(--eg-font-mono); font-size: 11px; letter-spacing: 1px;
}
.eg-look__caption {
	position: absolute; bottom: 14px; left: 16px;
	font-family: var(--eg-font-mono); font-size: 10px; letter-spacing: 0.5px; color: var(--eg-gray);
	background: rgba(10,10,10,.6); padding: 4px 8px;
}
.eg-look__shop-tag {
	position: absolute; bottom: 14px; right: 16px;
	font-family: var(--eg-font-mono); font-size: 10px; letter-spacing: 1px; color: var(--eg-red);
	border: 1px solid var(--eg-red); padding: 5px 10px; background: rgba(10,10,10,.6);
}

.eg-lookbook-teaser { background: var(--eg-surface); border-top: 1px solid var(--eg-line); border-bottom: 1px solid var(--eg-line); padding: 60px 24px; text-align: center; }
.eg-lookbook-teaser__text p { color: var(--eg-gray); max-width: 480px; margin: 12px auto 24px; }

/* ---------------------------------------------------------
   Generic content pages (About / FAQ / Policies)
   --------------------------------------------------------- */
.eg-page, .page .entry-content, .page-template-default .entry-content {
	max-width: 720px;
	margin: 0 auto;
	padding: 60px 24px 100px;
	color: var(--eg-white);
}
.eg-page__title { font-size: 34px; margin: 6px 0 24px; }
.eg-page__intro { color: var(--eg-gray); margin-bottom: 32px; }
.page .entry-content h3, .eg-page h3 { font-size: 16px; margin-top: 32px; letter-spacing: 0; }
.page .entry-content p, .eg-page p { color: #C9C7BE; }
.page .entry-content a, .eg-page a { color: var(--eg-red); text-decoration: underline; }

/* Contact form */
.eg-contact-form { max-width: 520px; }
.eg-form-row { margin-bottom: 18px; }
.eg-form-row label { display: block; font-family: var(--eg-font-mono); font-size: 10px; letter-spacing: 1.5px; color: var(--eg-gray); margin-bottom: 6px; }
.eg-form-row input, .eg-form-row textarea {
	width: 100%; background: var(--eg-black); border: 1px solid var(--eg-line); color: var(--eg-white);
	padding: 12px 14px; font-family: var(--eg-font-body); font-size: 14px;
}
.eg-form-row input:focus, .eg-form-row textarea:focus { outline: none; border-color: var(--eg-white); }
.eg-honeypot { position: absolute !important; left: -9999px !important; }
.eg-form-notice { padding: 12px 16px; margin-bottom: 20px; font-size: 13px; font-family: var(--eg-font-mono); }
.eg-form-notice--success { border: 1px solid var(--eg-white); color: var(--eg-white); }
.eg-form-notice--error { border: 1px solid var(--eg-red); color: var(--eg-red); }

/* ---------------------------------------------------------
   Search field (header)
   --------------------------------------------------------- */
.woocommerce-product-search,
.site-search form.search-form,
form.woocommerce-product-search {
	background: transparent;
}
.woocommerce-product-search input[type="search"],
.search-form input[type="search"],
input.search-field {
	background: var(--eg-black) !important;
	border: 1px solid var(--eg-line) !important;
	color: var(--eg-white) !important;
	border-radius: 0 !important;
	font-family: var(--eg-font-mono) !important;
	font-size: 12px !important;
}
.woocommerce-product-search input[type="search"]::placeholder,
.search-form input[type="search"]::placeholder { color: var(--eg-gray) !important; }
.woocommerce-product-search button, .search-form button {
	background: transparent !important;
	color: var(--eg-gray) !important;
	border: none !important;
}

/* ---------------------------------------------------------
   Breadcrumbs
   --------------------------------------------------------- */
.woocommerce-breadcrumb, .storefront-breadcrumb {
	font-family: var(--eg-font-mono);
	font-size: 11px;
	letter-spacing: 0.5px;
	color: var(--eg-gray) !important;
	padding: 16px 24px;
}
.woocommerce-breadcrumb a, .storefront-breadcrumb a { color: var(--eg-gray) !important; text-decoration: underline; }

/* ---------------------------------------------------------
   Blog archive + single post
   --------------------------------------------------------- */
.blog .site-main, .archive .site-main, .single-post .site-main {
	max-width: 760px; margin: 0 auto; padding: 40px 24px 100px;
}
.post .entry-title, .type-post .entry-title { font-size: 28px; margin-bottom: 8px; }
.post .entry-meta, .type-post .entry-meta {
	font-family: var(--eg-font-mono); font-size: 11px; letter-spacing: 0.5px; color: var(--eg-gray);
	margin-bottom: 24px;
}
.post .entry-meta a, .type-post .entry-meta a { color: var(--eg-gray); }
.post .entry-content, .type-post .entry-content { color: #C9C7BE; }
.post .entry-content a, .type-post .entry-content a { color: var(--eg-red); text-decoration: underline; }
article { border-bottom: 1px solid var(--eg-line); padding-bottom: 40px; margin-bottom: 40px; }

/* Comments */
.comments-area { margin-top: 40px; }
.comments-title, .comment-reply-title { font-size: 18px; }
.comment-list { list-style: none; margin: 0; padding: 0; }
.comment-body {
	background: var(--eg-surface);
	border: 1px solid var(--eg-line);
	padding: 20px;
	margin-bottom: 16px;
	color: var(--eg-white);
}
.comment-metadata, .comment-metadata a { font-family: var(--eg-font-mono); font-size: 10px; color: var(--eg-gray); }
.comment-content { color: #C9C7BE; margin-top: 8px; }
.comment-respond input[type="text"],
.comment-respond input[type="email"],
.comment-respond input[type="url"],
.comment-respond textarea {
	background: var(--eg-black) !important;
	border: 1px solid var(--eg-line) !important;
	color: var(--eg-white) !important;
	border-radius: 0 !important;
}
.comment-respond .comment-form-comment textarea { width: 100%; }
#reply-title small a { color: var(--eg-gray); }

/* ---------------------------------------------------------
   Footer
   --------------------------------------------------------- */
.site-footer { border-top: 1px solid var(--eg-line); padding: 40px 24px; }
.site-footer .site-info { font-family: var(--eg-font-mono); font-size: 11px; color: var(--eg-gray); text-align: center; }
.site-footer nav ul { display: flex; justify-content: center; gap: 20px; list-style: none; flex-wrap: wrap; margin-bottom: 16px; padding: 0; }
.site-footer nav ul li a { font-family: var(--eg-font-mono); font-size: 11px; letter-spacing: 0.5px; color: var(--eg-gray); }

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */
@media (max-width: 782px) {
	ul.products, ul.eg-product-grid { grid-template-columns: repeat(2, 1fr); }
	.eg-look-pair { grid-template-columns: 1fr; }
	.eg-section { padding: 40px 16px; }
	.eg-countdown__unit { min-width: 52px; padding: 10px 12px; }
	.eg-countdown__num { font-size: 20px; }
}
@media (max-width: 480px) {
	ul.products, ul.eg-product-grid { grid-template-columns: 1fr; }
}
