/* Untamed Shop – storefront look */
:root {
	--ink: #0d1b24;
	--navy: #001e2c;
	--accent: #f0506e;
	--accent-2: #001e2c;
	--base: #f3f4f2;
	--sand: #ece7de;
	--line: #e4e2dc;
	--muted: #66707a;
	--contrast-2: #2b3137;
	--contrast-3: #66707a;
	--us-head: Oswald, "Arial Narrow", sans-serif;
	--us-body: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
	--us-max: 1320px;
}
html { scroll-behavior: smooth; }
body { background: #fff; color: var(--contrast-2); font-family: var(--us-body); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, .entry-title { font-family: var(--us-head); font-weight: 600; letter-spacing: .01em; color: var(--ink); text-transform: uppercase; line-height: 1.1; }
a { color: var(--ink); }
a:hover { color: var(--accent); }
::selection { background: var(--accent); color: #fff; }

.us-skip { position: absolute; left: -9999px; }
.us-skip:focus { left: 12px; top: 12px; z-index: 1000; background: #fff; padding: 8px 12px; }

/* ------------------------------------------------ top bar + header */
.us-topbar { background: var(--navy); color: rgba(255,255,255,.82); font-size: 12.5px; letter-spacing: .06em; text-transform: uppercase; text-align: center; padding: 8px 16px; display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.us-topbar-sep { opacity: .4; }
.us-header { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,.92); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid transparent; transition: border-color .2s, box-shadow .2s; }
.us-header.is-stuck { border-bottom-color: var(--line); box-shadow: 0 6px 24px -18px rgba(0,0,0,.35); }
.admin-bar .us-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .us-header { top: 0; } }
.us-header-in { max-width: var(--us-max); margin: 0 auto; padding: 14px 24px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; }
.us-brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--ink); }
.us-brand img { height: 32px; width: auto; display: block; }
.us-word { font-family: var(--us-head); font-weight: 700; font-size: 24px; letter-spacing: .12em; line-height: 1; display: inline-flex; align-items: baseline; gap: 8px; }
.us-word small { font-family: var(--us-body); font-weight: 500; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); }
.us-nav { display: flex; gap: 34px; }
.us-nav a { font-family: var(--us-head); text-transform: uppercase; letter-spacing: .1em; font-size: 15px; font-weight: 500; text-decoration: none; color: var(--ink); position: relative; padding: 6px 0; }
.us-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.us-nav a:hover::after, .us-nav a[aria-current]::after { transform: scaleX(1); }
.us-nav a:hover { color: var(--ink); }
.us-actions { display: flex; justify-content: flex-end; align-items: center; gap: 6px; }
.us-icon { position: relative; display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; color: var(--ink); transition: background .15s; }
.us-icon:hover { background: var(--base); color: var(--ink); }
.us-cart-count { position: absolute; top: 3px; right: 1px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--accent); color: #fff; font-size: 11px; font-weight: 600; line-height: 18px; text-align: center; }
.us-cart-count.is-empty { display: none; }
.us-burger { display: none; width: 42px; height: 42px; border: 0; background: transparent; padding: 0; cursor: pointer; position: relative; }
.us-burger span { position: absolute; left: 11px; right: 11px; height: 2px; background: var(--ink); transition: transform .25s, top .25s; }
.us-burger span:first-child { top: 16px; } .us-burger span:last-child { top: 24px; }
.us-burger[aria-expanded="true"] span:first-child { top: 20px; transform: rotate(45deg); }
.us-burger[aria-expanded="true"] span:last-child { top: 20px; transform: rotate(-45deg); }
.us-burger:hover, .us-burger:focus { background: transparent; }
@media (max-width: 860px) {
	.us-header-in { grid-template-columns: 1fr auto; padding: 10px 16px; }
	.us-word { font-size: 20px; }
	.us-burger { display: inline-block; }
	.us-nav { position: absolute; left: 0; right: 0; top: 100%; background: #fff; flex-direction: column; gap: 0; padding: 8px 16px 20px; border-bottom: 1px solid var(--line); box-shadow: 0 20px 30px -24px rgba(0,0,0,.4); display: none; }
	.us-nav.is-open { display: flex; }
	.us-nav a { padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 17px; }
	.us-nav a::after { display: none; }
}

/* --------------------------------------------------------- hero */
.us-hero { position: relative; overflow: hidden; background: var(--navy); color: #fff; }
.us-hero::before { content: ""; position: absolute; inset: 0; background:
	radial-gradient(900px 420px at 85% 20%, rgba(240,80,110,.22), transparent 60%),
	radial-gradient(700px 380px at 10% 110%, rgba(79,196,207,.14), transparent 60%);
}
.us-hero::after { content: ""; position: absolute; inset: 0; opacity: .06; background-image: repeating-linear-gradient(115deg, #fff 0 1px, transparent 1px 22px); }
.us-hero-in { position: relative; z-index: 1; max-width: var(--us-max); margin: 0 auto; padding: 96px 24px 104px; }
.us-kicker { font-size: 12.5px; letter-spacing: .28em; text-transform: uppercase; color: rgba(255,255,255,.7); margin: 0 0 18px; }
.us-hero-title { color: #fff; font-size: clamp(44px, 7.4vw, 104px); font-weight: 700; letter-spacing: .005em; line-height: .95; margin: 0 0 22px; max-width: 12ch; }
.us-hero-title em { font-style: normal; color: var(--accent); }
.us-hero-sub { max-width: 520px; font-size: 17px; line-height: 1.6; color: rgba(255,255,255,.78); margin: 0 0 34px; }
.us-btn { display: inline-flex; align-items: center; gap: 10px; background: var(--accent); color: #fff; text-decoration: none; font-family: var(--us-head); text-transform: uppercase; letter-spacing: .1em; font-size: 15px; padding: 16px 26px; border-radius: 3px; transition: transform .15s, background .15s; }
.us-btn:hover { color: #fff; background: #e23d5c; transform: translateY(-1px); }
.us-hero-mark { position: absolute; z-index: 0; right: -4%; bottom: -8%; width: min(46vw, 620px); height: auto; opacity: .09; filter: invert(1); pointer-events: none; }
.us-anchor { position: relative; top: -90px; }
@media (max-width: 700px) { .us-hero-in { padding: 64px 20px 72px; } .us-hero-mark { width: 80vw; right: -20%; } }

/* ------------------------------------------------- content area */
.site.grid-container, .grid-container { max-width: var(--us-max); }
.separate-containers .inside-article, .one-container .site-content { padding: 56px 24px 72px; }
.one-container .container, .site-content { background: #fff; }
body.home .site-content { padding-top: 48px; }
.entry-content > *:first-child { margin-top: 0; }
.entry-title { font-size: clamp(30px, 4vw, 46px); margin-bottom: 28px; }
@media (max-width: 700px) { .one-container .site-content { padding: 36px 16px 56px; } }

/* merch grid tweaks inside the new look */
.um-shop { --um-radius: 4px; --um-bg: var(--base); }
.um-filters { justify-content: center; margin-bottom: 40px; }
.um-p-title, .um-p h2, .um-p h3 { text-transform: none; font-family: var(--us-body); font-weight: 500; letter-spacing: 0; }

/* ------------------------------------------- WooCommerce basics */
.woocommerce .button, .woocommerce button.button, .woocommerce a.button, .wc-block-components-button:not(.is-link), .woocommerce #respond input#submit {
	background: var(--navy) !important; color: #fff !important; border-radius: 3px !important; font-family: var(--us-head); text-transform: uppercase; letter-spacing: .08em; font-weight: 500;
}
.woocommerce .button:hover, .wc-block-components-button:not(.is-link):hover { background: var(--accent) !important; }
.wc-block-components-checkout-place-order-button, .woocommerce #place_order, .checkout-button { background: var(--accent) !important; }
.woocommerce-message, .woocommerce-info { border-top-color: var(--accent); }
.woocommerce-store-notice, p.demo_store { background: var(--navy); }

/* ------------------------------------------------------ footer */
.site-footer { background: transparent; }
.us-footer { background: var(--navy); color: rgba(255,255,255,.7); margin-top: 40px; }
.us-footer-in { max-width: var(--us-max); margin: 0 auto; padding: 72px 24px 48px; display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 40px; }
.us-footer h4 { color: #fff; font-size: 14px; letter-spacing: .16em; margin: 6px 0 18px; }
.us-footer a { color: rgba(255,255,255,.78); text-decoration: none; display: block; padding: 4px 0; font-size: 15px; }
.us-footer a:hover { color: var(--accent); }
.us-footer p { font-size: 14.5px; line-height: 1.65; margin: 0; }
.us-brand-light { color: #fff; margin-bottom: 18px; display: inline-flex !important; }
.us-brand-light img { filter: invert(1) brightness(2); }
.us-f-brand p { max-width: 360px; }
.us-f-bottom { max-width: var(--us-max); margin: 0 auto; padding: 22px 24px 30px; border-top: 1px solid rgba(255,255,255,.1); display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: rgba(255,255,255,.5); flex-wrap: wrap; }
@media (max-width: 860px) { .us-footer-in { grid-template-columns: 1fr 1fr; padding: 56px 20px 36px; } .us-f-brand { grid-column: 1 / -1; } }
.site-info, .footer-widgets { display: none; }
