/* Nakama luxury refinement — foundation (homepage only).
   Direction: quiet-luxury streetwear. The homepage read "cheap" because of
   saturated red used as a field colour, tight vertical rhythm and untracked
   display type. This file demotes red to a single accent, opens the rhythm,
   and puts discipline on micro-typography. Scoped to .home so shop/PDP keep
   their current treatment until reviewed separately. */

.home {
	--nk-ink: #14172a;
	--nk-ink-soft: #6a6f80;
	--nk-bone: #f6f4f1;
	--nk-line: rgba(20, 23, 42, 0.1);
	--nk-accent: #d4342a;
}

/* ---- vertical rhythm -------------------------------------------------- */
/* Flatsome sections default to ~30px padding; luxury reads as air. */
.home #content > .page-inner > section,
.home #content section.section {
	padding-top: 88px;
	padding-bottom: 88px;
}

.home #content section.section + section.section {
	padding-top: 0;
}

@media (max-width: 849px) {
	.home #content > .page-inner > section,
	.home #content section.section {
		padding-top: 52px;
		padding-bottom: 52px;
	}
}

/* ---- section headings ------------------------------------------------- */
/* Anton stays (brand voice) but drops in size and gains tracking, so it
   reads as a considered label rather than a poster shout. */
.home #content section h2,
.home #content section h3.section-title {
	font-size: 26px;
	line-height: 1.15;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--nk-ink);
	margin-bottom: 8px;
}

/* Hairline under section headings replaces the heavy block separation. */
.home #content section > .row > .col > h2::after,
.home #content section h2.nk-ruled::after {
	content: "";
	display: block;
	width: 44px;
	height: 1px;
	margin: 18px auto 0;
	background: var(--nk-ink);
	opacity: 0.35;
}

@media (max-width: 549px) {
	.home #content section h2 {
		font-size: 21px;
		letter-spacing: 0.07em;
	}
}

/* ---- hero ------------------------------------------------------------- */
/* Existing overlay is rgba(20,20,30,.45) — kept. The CTA moves from fire
   red to solid bone/ink: on a busy illustration a neutral button reads as
   deliberate, red reads as a sticker. */
.home .banner h1,
.home .hero-full-bleed h1 {
	letter-spacing: 0.06em;
}

.home .hero-full-bleed .is-larger a.button,
.home .banner .text-box-content a.button.primary {
	background-color: #fff;
	border: none;
	color: var(--nk-ink);
	letter-spacing: 0.2em;
	text-transform: uppercase;
	font-size: 12px;
	padding: 0 34px;
	min-height: 50px;
	line-height: 50px;
	border-radius: 0;
	transition: background-color 0.4s ease, color 0.4s ease;
}

.home .hero-full-bleed .is-larger a.button:hover,
.home .banner .text-box-content a.button.primary:hover {
	background-color: var(--nk-ink);
	color: #fff;
}

/* ---- buttons: ghost by default, solid reserved for one CTA ------------ */
/* Height/padding stay owned by homepage-cta.css:59-70 (flex row sizing). */
.home .nakama-join-crew input.wpcf7-submit {
	background-color: var(--nk-accent);
	border-radius: 0;
	letter-spacing: 0.16em;
	font-weight: 600;
	transition: background-color 0.4s ease;
}

.home .nakama-join-crew input.wpcf7-submit:hover {
	background-color: #b32a21;
}

/* ---- newsletter blocks ------------------------------------------------ */
/* LAYOUT-NEUTRAL ON PURPOSE. homepage-cta.css:86-109 tunes this form as a
   flex row so the Turnstile widget gets its own line; the email input
   sitting left of centre is that row working as designed, not a defect.
   Anything here that touches display/margin/max-width/height re-breaks it,
   so this block only changes colour and tracking. */
.home .nakama-join-crew input.wpcf7-text {
	background: transparent;
	border: none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.35);
	box-shadow: none;
	border-radius: 0;
	color: #fff;
	letter-spacing: 0.08em;
}

.home .nakama-join-crew input.wpcf7-text::placeholder {
	color: rgba(255, 255, 255, 0.55);
	letter-spacing: 0.08em;
}

.home .nakama-join-crew input.wpcf7-text:focus {
	border-bottom-color: #fff;
}

/* ---- trust row -------------------------------------------------------- */
.home .icon-box .icon-box-img svg,
.home .icon-box .icon-box-img img {
	opacity: 0.75;
}

.home .icon-box h3,
.home .icon-box .icon-box-text h3 {
	font-size: 13px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.home .icon-box .icon-box-text p {
	color: var(--nk-ink-soft);
	font-size: 14px;
	line-height: 1.6;
}