/*
 * Cuirden editorial pages (templates/page-editorial.html):
 * Our Story, Craftsmanship, Leather Guide, Made to Order, Size Guide, Care Guide.
 * Shares the homepage language: --hc-* tokens, Marcellus display, Jost text.
 */

.hc-ed { background: var(--hc-ivory); overflow-x: clip; font-variant-numeric: lining-nums; }
.hc-ed-content > * { margin-block: 0; }
.hc-ed .wp-block-heading { font-weight: 400; text-wrap: balance; }
.hc-ed p { text-wrap: pretty; }

.hc-ed-wrap,
.hc-ed-intro,
.hc-ed-split,
.hc-ed-grid,
.hc-ed-steps,
.hc-ed-table,
.hc-ed-faq,
.hc-ed-notes {
	box-sizing: border-box; width: min(calc(100% - 3rem), 1440px);
	margin-left: auto !important; margin-right: auto !important;
}

/* Shared text pieces ---------------------------------------------------- */
.hc-ed .hc-eyebrow {
	margin: 0 0 1.25rem; color: var(--hc-taupe);
	font-size: .7rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
}
.hc-ed .hc-text-link { margin: 2rem 0 0; }
.hc-ed .hc-text-link a {
	display: inline-flex; align-items: center; gap: .6rem; padding-bottom: .3rem; border-bottom: 1px solid currentColor;
	color: inherit; font-size: .74rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
	transition: gap var(--hc-transition);
}
.hc-ed .hc-text-link a::after { content: "\2192"; font-size: .95rem; letter-spacing: 0; }
.hc-ed .hc-text-link a:hover { gap: .95rem; }
.hc-ed-section-title { margin: 0 0 clamp(2rem, 4vw, 3.5rem); font-size: clamp(2.1rem, 3.6vw, 3.4rem); }

/* Hero ------------------------------------------------------------------ */
.hc-ed-hero { position: relative; padding: 0 !important; color: var(--hc-on-dark); background: var(--hc-stone); }
.hc-ed-hero::before {
	content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
	background: linear-gradient(0deg, rgba(20,16,12,.7) 0%, rgba(20,16,12,.32) 45%, rgba(20,16,12,.08) 100%);
}
.hc-ed-hero .wp-block-cover__inner-container { position: relative; z-index: 2; width: 100%; }
.hc-ed-hero-inner { box-sizing: border-box; width: min(calc(100% - 3rem), 1440px); margin: 0 auto; padding: 8rem 0 clamp(3rem, 7vh, 5.5rem); }
.hc-ed-hero-inner > * { max-width: 760px; }
.hc-ed-hero .hc-eyebrow { color: rgba(243,238,230,.85); }
.hc-ed-hero h1 { margin: 0; color: inherit !important; font-size: clamp(3rem, 7vw, 6.5rem); line-height: .95; letter-spacing: -.02em; }
.hc-ed-hero-lead { margin: 1.5rem 0 0; color: rgba(243,238,230,.92); font-size: clamp(1rem, 1.3vw, 1.18rem); line-height: 1.7; }

/* Plain (image-less) header for utility pages --------------------------- */
.hc-ed-head { box-sizing: border-box; width: min(calc(100% - 3rem), 1440px); margin: 0 auto !important; padding: clamp(4rem, 8vw, 7rem) 0 clamp(2.5rem, 5vw, 4rem); border-bottom: 1px solid var(--hc-line); }
.hc-ed-head h1 { margin: 0; font-size: clamp(3rem, 7vw, 6rem); line-height: .95; letter-spacing: -.02em; }
.hc-ed-head .hc-ed-hero-lead { max-width: 680px; color: var(--hc-charcoal); }

/* Intro statement ------------------------------------------------------- */
.hc-ed-intro { max-width: 980px; padding: clamp(5rem, 10vw, 9rem) 0; text-align: center; }
.hc-ed-intro .hc-ed-statement { margin: 0 auto; font-family: var(--wp--preset--font-family--display); font-size: clamp(1.7rem, 3vw, 2.7rem); line-height: 1.3; color: var(--hc-ink); }
.hc-ed-intro p:not(.hc-ed-statement):not(.hc-eyebrow) { max-width: 660px; margin: 1.75rem auto 0; color: var(--hc-charcoal); font-size: 1.05rem; line-height: 1.8; }

/* Split image / text ---------------------------------------------------- */
.hc-ed-split {
	display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: center;
	gap: clamp(2rem, 6vw, 7rem); padding-bottom: clamp(5rem, 10vw, 9rem);
}
.hc-ed-split--reverse > figure { order: 2; }
.hc-ed-split > figure { margin: 0; overflow: hidden; aspect-ratio: 4 / 3; background: var(--hc-stone); }
.hc-ed-split > figure img { display: block; width: 100%; height: 100% !important; object-fit: cover; }
.hc-ed-split h2 { margin: 0 0 1.5rem; font-size: clamp(2rem, 3.4vw, 3.2rem); }
.hc-ed-split p:not(.hc-eyebrow):not(.hc-text-link) { margin: 0 0 1rem; color: var(--hc-charcoal); font-size: 1.02rem; line-height: 1.8; }

/* Numbered grid (principles, leathers, care) --------------------------- */
.hc-ed-grid { padding-bottom: clamp(5rem, 10vw, 9rem); }
.hc-ed-grid-list {
	display: grid; grid-template-columns: repeat(var(--hc-cols, 3), minmax(0, 1fr));
	margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--hc-ink);
}
.hc-ed-grid--4 { --hc-cols: 4; }
.hc-ed-grid--2 { --hc-cols: 2; }
.hc-ed-grid-list li { padding: 1.75rem 1.75rem 1.75rem 0; color: var(--hc-charcoal); font-size: .98rem; line-height: 1.75; border-bottom: 1px solid var(--hc-line); }
.hc-ed-grid-list li + li { padding-left: 1.75rem; border-left: 1px solid var(--hc-line); }
.hc-ed-index { display: block; margin-bottom: 1.25rem; color: var(--hc-taupe); font-size: .7rem; letter-spacing: .14em; }
.hc-ed-grid-list strong { display: block; margin-bottom: .7rem; color: var(--hc-ink); font-family: var(--wp--preset--font-family--display); font-size: clamp(1.45rem, 1.9vw, 1.8rem); font-weight: 400; line-height: 1.15; }
.hc-ed-meta { display: block; margin-top: 1rem; color: var(--hc-taupe); font-size: .78rem; letter-spacing: .04em; }

/* Process steps --------------------------------------------------------- */
.hc-ed-steps { padding-bottom: clamp(5rem, 10vw, 9rem); }
.hc-ed-steps-list { margin: 0; padding: 0; list-style: none; counter-reset: step; }
.hc-ed-steps-list li {
	display: grid; grid-template-columns: 5rem minmax(0, 18rem) minmax(0, 1fr); gap: 1.5rem; align-items: baseline;
	padding: 1.75rem 0; border-top: 1px solid var(--hc-line); color: var(--hc-charcoal); line-height: 1.75; counter-increment: step;
}
.hc-ed-steps-list li:last-child { border-bottom: 1px solid var(--hc-line); }
.hc-ed-steps-list li::before { content: counter(step, decimal-leading-zero); color: var(--hc-taupe); font-family: var(--wp--preset--font-family--display); font-size: 2.2rem; line-height: 1; }
.hc-ed-steps-list strong { color: var(--hc-ink); font-family: var(--wp--preset--font-family--display); font-size: clamp(1.4rem, 1.8vw, 1.7rem); font-weight: 400; line-height: 1.2; }

/* Size tables ----------------------------------------------------------- */
.hc-ed-table { padding-bottom: clamp(3.5rem, 7vw, 6rem); }
.hc-ed-table h2 { margin: 0 0 .5rem; font-size: clamp(1.9rem, 3vw, 2.8rem); }
.hc-ed-table > p { margin: 0 0 1.5rem; color: var(--hc-taupe); font-size: .9rem; }
.hc-ed-table .wp-block-table { margin: 0; overflow-x: auto; }
.hc-ed-table table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: .95rem; }
.hc-ed-table th,
.hc-ed-table td { padding: .95rem 1rem; border: 0; border-bottom: 1px solid var(--hc-line); text-align: left; white-space: nowrap; }
.hc-ed-table thead th { border-bottom: 1px solid var(--hc-ink); color: var(--hc-ink); font-size: .7rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.hc-ed-table tbody td:first-child { color: var(--hc-ink); font-family: var(--wp--preset--font-family--display); font-size: 1.15rem; }
.hc-ed-table tbody td { color: var(--hc-charcoal); }
.hc-ed-table tbody tr:hover td { background: var(--hc-soft-white); }

/* Notes / callout ------------------------------------------------------- */
.hc-ed-notes { margin-bottom: clamp(5rem, 10vw, 9rem) !important; padding: clamp(2rem, 4vw, 3.5rem); background: var(--hc-sand); }
.hc-ed-notes h2 { margin: 0 0 1rem; font-size: clamp(1.7rem, 2.6vw, 2.4rem); }
.hc-ed-notes p, .hc-ed-notes li { color: var(--hc-charcoal); line-height: 1.8; }
.hc-ed-notes ul { margin: 0; padding-left: 1.2rem; }

/* FAQ ------------------------------------------------------------------- */
.hc-ed-faq { max-width: 1000px; padding-bottom: clamp(5rem, 10vw, 9rem); }
.hc-ed-faq .wp-block-details { margin: 0; padding: 0; border-top: 1px solid var(--hc-line); }
.hc-ed-faq .wp-block-details:last-child { border-bottom: 1px solid var(--hc-line); }
.hc-ed-faq summary {
	display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.5rem 0; cursor: pointer; list-style: none;
	color: var(--hc-ink); font-family: var(--wp--preset--font-family--display); font-size: clamp(1.25rem, 1.8vw, 1.55rem);
}
.hc-ed-faq summary::-webkit-details-marker { display: none; }
.hc-ed-faq summary::after { content: "+"; font-family: var(--wp--preset--font-family--sans); font-size: 1.4rem; font-weight: 300; transition: transform var(--hc-transition); }
.hc-ed-faq details[open] summary::after { transform: rotate(45deg); }
.hc-ed-faq details p { max-width: 760px; margin: 0 0 1.5rem; color: var(--hc-charcoal); line-height: 1.8; }

/* Closing band ---------------------------------------------------------- */
.hc-ed-cta { box-sizing: border-box; padding: clamp(5rem, 10vw, 8rem) 1.5rem; background: #1f1b18; color: rgba(243,238,230,.82); text-align: center; }
html[data-theme="dark"] .hc-ed-cta { background: #110f0d; box-shadow: inset 0 1px 0 var(--hc-line); }
.hc-ed-cta .hc-eyebrow { color: #b9a996; }
.hc-ed-cta h2 { max-width: 820px; margin: 0 auto 1.25rem; color: var(--hc-on-dark); font-size: clamp(2.2rem, 4.4vw, 4rem); line-height: 1.05; }
.hc-ed-cta p:not(.hc-eyebrow):not(.hc-text-link) { max-width: 560px; margin: 0 auto; line-height: 1.75; }
.hc-ed-cta .hc-text-link a { color: var(--hc-on-dark); }

/* Responsive ------------------------------------------------------------ */
@media (max-width: 1024px) {
	.hc-ed-grid--4 { --hc-cols: 2; }
	.hc-ed-grid--4 .hc-ed-grid-list li:nth-child(odd) { padding-left: 0; border-left: 0; }
	.hc-ed-split { grid-template-columns: 1fr; }
	.hc-ed-split--reverse > figure { order: 0; }
	.hc-ed-steps-list li { grid-template-columns: 4rem minmax(0, 1fr); }
	.hc-ed-steps-list li > :last-child { grid-column: 2; }
}
@media (max-width: 782px) {
	.hc-ed-wrap, .hc-ed-intro, .hc-ed-split, .hc-ed-grid, .hc-ed-steps, .hc-ed-table, .hc-ed-faq, .hc-ed-notes,
	.hc-ed-hero-inner, .hc-ed-head { width: calc(100% - 2rem); }
	.hc-ed-hero { min-height: 74svh !important; }
	.hc-ed-hero-inner { padding: 6rem 0 2.5rem; }
	.hc-ed-grid, .hc-ed-grid--2, .hc-ed-grid--4 { --hc-cols: 1; }
	.hc-ed-grid-list li, .hc-ed-grid-list li + li { padding-left: 0; border-left: 0; }
	.hc-ed-intro { text-align: left; }
}

/* Marcellus draws 0 like "O" and 1 like "I": numerals use Jost Light instead. */
.hc-ed-steps-list li::before { font-family: var(--wp--preset--font-family--sans); font-weight: 300; font-size: 2rem; letter-spacing: -.02em; }