/* ==========================================================================
   Biography Studio — page-editions.css
   Three pathways. Your story, your way.
   Background sequence: cream → white → cream → white → cream → white → blue-grey → cream → white
   ========================================================================== */


/* --------------------------------------------------------------------------
   Scroll reveal
   -------------------------------------------------------------------------- */
.bse-reveal {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.55s ease, transform 0.55s ease;
}
.bse-reveal--in {
	opacity: 1;
	transform: none;
}


/* ==========================================================================
   1 · HERO — pure typography, centred
   ========================================================================== */
.bse-hero {
	background-color: var(--bs-cream);
	background-image:
		radial-gradient(ellipse 80% 60% at 50% 0%, rgba(255,254,250,0.8) 0%, transparent 60%),
		radial-gradient(ellipse 50% 40% at 5% 95%, rgba(237,229,217,0.35) 0%, transparent 50%);
	padding: 96px 0 104px;
}
.bse-hero__inner {
	display:        flex;
	flex-direction: column;
	align-items:    center;
	text-align:     center;
}
.bse-hero__label {
	font-family:    var(--bs-ui-font);
	font-size:      0.875rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color:          var(--bs-pink-dark);
	margin-bottom:  20px;
}
.bse-hero__heading {
	font-family:    var(--bs-heading-font);
	font-size:      clamp(2.5rem, 5vw, 5.5rem);
	font-weight:    400;
	font-style:     italic;
	line-height:    1.08;
	letter-spacing: -0.015em;
	color:          var(--bs-navy);
	margin-bottom:  36px;
}
.bse-hero__intro {
	font-family:   var(--bs-body-font);
	font-size:     1.125rem;
	line-height:   1.75;
	color:         var(--bs-text-muted);
	max-width:     52ch;
	margin-bottom: 28px;
}
.bse-hero__tagline {
	font-family:   var(--bs-heading-font);
	font-size:     1.125rem;
	font-style:    italic;
	color:         var(--bs-navy);
	margin-bottom: 40px;
}
.bse-hero__ctas {
	display:         flex;
	flex-wrap:       wrap;
	gap:             14px;
	justify-content: center;
}


/* ==========================================================================
   2 · HOW YOUR BOOK IS STRUCTURED
   Copy left, illustration right — copy leads.
   ========================================================================== */
.bse-format {
	background:  var(--bs-white);
	padding:     104px 0;
	border-top:  1px solid var(--bs-border-light);
}
.bse-format__inner {
	display:               grid;
	grid-template-columns: 1fr 340px;
	gap:                   80px;
	align-items:           start;
}
.bse-format__heading {
	font-family:   var(--bs-heading-font);
	font-size:     clamp(1.875rem, 3vw, 2.75rem);
	font-weight:   400;
	line-height:   1.2;
	color:         var(--bs-navy);
	margin-bottom: 32px;
}
.bse-format__copy {
	font-family: var(--bs-body-font);
	font-size:   1.0625rem;
	line-height: 1.85;
	color:       var(--bs-text);
	max-width:   62ch;
}
.bse-format__copy p { margin-bottom: 1.5em; }
.bse-format__copy p:last-child { margin-bottom: 0; }

.bse-format__sample {
	font-family: var(--bs-body-font);
	font-size:   0.9375rem;
	line-height: 1.65;
	color:       var(--bs-text-muted);
	margin-top:  40px;
	padding-top: 32px;
	border-top:  1px solid var(--bs-border-light);
}
.bse-format__sample a {
	color:           var(--bs-navy);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.bse-format__sample a:hover { color: var(--bs-pink-dark); }

.bse-format__art {
	position: sticky;
	top:      120px;
}
.bse-format__image {
	display:    block;
	width:      100%;
	height:     auto;
	max-width:  320px;
	margin:     0 auto;
}


/* ==========================================================================
   3 · WRITING, SPEAKING AND THE EDITING OPTION
   Icon left (~280px), copy right.
   ========================================================================== */
.bse-writing {
	background:  var(--bs-cream);
	padding:     104px 0;
	border-top:  1px solid var(--bs-border-light);
}
.bse-writing__inner {
	display:               grid;
	grid-template-columns: 260px 1fr;
	gap:                   80px;
	align-items:           start;
}
.bse-writing__art {
	display:         flex;
	justify-content: center;
	padding-top:     8px;
	position:        sticky;
	top:             120px;
}
.bse-writing__image {
	display: block;
	width:   clamp(160px, 18vw, 240px);
	height:  auto;
}
.bse-writing__heading {
	font-family:   var(--bs-heading-font);
	font-size:     clamp(1.875rem, 3vw, 2.75rem);
	font-weight:   400;
	line-height:   1.2;
	color:         var(--bs-navy);
	margin-bottom: 32px;
}
.bse-writing__copy {
	font-family: var(--bs-body-font);
	font-size:   1.0625rem;
	line-height: 1.85;
	color:       var(--bs-text);
	max-width:   62ch;
}
.bse-writing__copy p { margin-bottom: 1.5em; }
.bse-writing__copy p:last-child { margin-bottom: 0; }


/* ==========================================================================
   4–6 · PATHWAY SECTIONS — shared styles
   Each pathway is a full section with its own background.
   ========================================================================== */
.bse-pathway {
	padding:    104px 0;
	border-top: 1px solid var(--bs-border-light);
}
.bse-pathway--reflections { background: var(--bs-white); }
.bse-pathway--chronicle   { background: var(--bs-cream); }
.bse-pathway--wisdom      { background: var(--bs-white); }

/* Icon + label header row */
.bse-pathway__intro {
	display:       flex;
	align-items:   center;
	gap:           36px;
	margin-bottom: 40px;
}
.bse-pathway__icon {
	flex-shrink: 0;
}
.bse-pathway__icon img {
	display:    block;
	width:      clamp(120px, 14vw, 180px);
	height:     clamp(120px, 14vw, 180px);
	object-fit: contain;
}
.bse-pathway__meta {
	display:        flex;
	flex-direction: column;
	gap:            8px;
}
.bse-pathway__name {
	font-family:    var(--bs-ui-font);
	font-size:      1rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight:    600;
	color:          var(--bs-navy);
}
.bse-pathway__range {
	font-family:    var(--bs-body-font);
	font-size:      1rem;
	font-style:     italic;
	letter-spacing: 0;
	color:          var(--bs-text-muted);
}

/* Section heading */
.bse-pathway__heading {
	font-family:   var(--bs-heading-font);
	font-size:     clamp(2rem, 3.5vw, 3.25rem);
	font-weight:   400;
	line-height:   1.15;
	color:         var(--bs-navy);
	max-width:     22ch;
	margin-bottom: 18px;
}

/* Tag line */
.bse-pathway__tag {
	font-family:   var(--bs-body-font);
	font-size:     1.0625rem;
	font-style:    italic;
	line-height:   1.6;
	color:         var(--bs-text-muted);
	max-width:     48ch;
	margin-bottom: 40px;
}

/* Body copy */
.bse-pathway__copy {
	font-family:   var(--bs-body-font);
	font-size:     1.0625rem;
	line-height:   1.85;
	color:         var(--bs-text);
	max-width:     62ch;
	margin-bottom: 48px;
}
.bse-pathway__copy p { margin-bottom: 1.5em; }
.bse-pathway__copy p:last-child { margin-bottom: 0; }

/* Chapters list */
.bse-pathway__chapters-label {
	font-family:    var(--bs-ui-font);
	font-size:      0.75rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color:          var(--bs-text-muted);
	margin-bottom:  16px;
}
.bse-pathway__chapters {
	list-style:    decimal;
	padding-left:  1.4em;
	margin-bottom: 48px;
	max-width:     38ch;
}
.bse-pathway__chapters li {
	font-family:  var(--bs-body-font);
	font-size:    1rem;
	line-height:  1.6;
	color:        var(--bs-navy);
	padding:      6px 0;
	border-bottom: 1px solid var(--bs-border-light);
}
.bse-pathway__chapters li:last-child { border-bottom: none; }

.bse-pathway__cta { margin-top: 8px; }


/* ==========================================================================
   7 · ALL THREE TOGETHER
   Blue-grey — reserved accent; centred editorial copy.
   ========================================================================== */
.bse-together {
	background:  #ccd8e2;
	padding:     104px 0;
	border-top:  1px solid rgba(9,58,102,0.1);
}
.bse-together__inner {
	display:               grid;
	grid-template-columns: 1fr 260px;
	gap:                   80px;
	align-items:           center;
}
.bse-together__body {
	max-width: 60ch;
}
.bse-together__cta {
	margin-top: 40px;
}
.bse-together__art {
	display:         flex;
	justify-content: center;
	align-items:     center;
}
.bse-together__image {
	display: block;
	width:   clamp(180px, 20vw, 260px);
	height:  auto;
}
.bse-together__heading {
	font-family:   var(--bs-heading-font);
	font-size:     clamp(2rem, 3.5vw, 3.25rem);
	font-weight:   400;
	line-height:   1.15;
	color:         var(--bs-navy);
	margin-bottom: 32px;
}
.bse-together__copy {
	font-family: var(--bs-body-font);
	font-size:   1.0625rem;
	line-height: 1.85;
	color:       #2e4a5e;
}
.bse-together__copy p { margin-bottom: 1.5em; }
.bse-together__copy p:last-child { margin-bottom: 0; }


/* ==========================================================================
   8 · WHAT EVERY EDITION INCLUDES
   Book illustration left, copy right.
   ========================================================================== */
.bse-includes {
	background:  var(--bs-cream);
	padding:     104px 0;
	border-top:  1px solid var(--bs-border-light);
}
.bse-includes__inner {
	display:               grid;
	grid-template-columns: 240px 1fr;
	gap:                   72px;
	align-items:           center;
}
.bse-includes__art {
	display:         flex;
	justify-content: center;
}
.bse-includes__image {
	display:   block;
	width:     220px;
	height:    auto;
}
.bse-includes__heading {
	font-family:   var(--bs-heading-font);
	font-size:     clamp(1.875rem, 3vw, 2.75rem);
	font-weight:   400;
	line-height:   1.2;
	color:         var(--bs-navy);
	margin-bottom: 28px;
}
.bse-includes__copy {
	font-family: var(--bs-body-font);
	font-size:   1.0625rem;
	line-height: 1.85;
	color:       var(--bs-text);
	max-width:   52ch;
}
.bse-includes__copy p { margin-bottom: 1.4em; }
.bse-includes__copy p:last-child { margin-bottom: 0; }


/* ==========================================================================
   9 · CLOSING CTA
   ========================================================================== */
.bse-close {
	background:  var(--bs-white);
	padding:     112px 0;
	border-top:  1px solid var(--bs-border-light);
	text-align:  center;
}
.bse-close__inner {
	max-width: 640px;
	margin:    0 auto;
}
.bse-close__heading {
	font-family:    var(--bs-heading-font);
	font-size:      clamp(2.25rem, 5vw, 4.5rem);
	font-weight:    400;
	font-style:     italic;
	line-height:    1.1;
	letter-spacing: -0.01em;
	color:          var(--bs-navy);
	margin-bottom:  36px;
}
.bse-close__rule {
	width:      40px;
	height:     2px;
	background: var(--bs-pink);
	margin:     0 auto 28px;
}
.bse-close__sub {
	font-family:   var(--bs-body-font);
	font-size:     1.0625rem;
	line-height:   1.7;
	color:         var(--bs-text-muted);
	margin-bottom: 40px;
}
.bse-close__ctas {
	display:         flex;
	flex-wrap:       wrap;
	gap:             14px;
	justify-content: center;
}


/* ==========================================================================
   RESPONSIVE — below 1024px
   ========================================================================== */
@media ( max-width: 1024px ) {

	.bse-format__inner {
		grid-template-columns: 1fr;
		gap: 48px;
	}
	.bse-format__art {
		position: static;
		text-align: center;
	}
	.bse-format__image { max-width: 260px; }

	.bse-writing__inner {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	.bse-writing__art { padding-top: 0; position: static; }

	.bse-includes__inner {
		grid-template-columns: 1fr;
		gap: 40px;
		text-align: center;
	}
	.bse-includes__image { margin: 0 auto; }

	.bse-together__inner {
		grid-template-columns: 1fr;
		gap: 48px;
	}
	.bse-together__art { order: -1; }
	.bse-together__image { width: clamp(140px, 28vw, 200px); }

}


/* ==========================================================================
   RESPONSIVE — below 768px
   ========================================================================== */
@media ( max-width: 768px ) {

	.bse-hero { padding: 64px 0 72px; }

	.bse-pathway__intro { gap: 16px; }

	.bse-close { padding: 80px 0; }
	.bse-close__ctas { flex-direction: column; align-items: center; }
	.bse-close__ctas .bsh-btn { width: 100%; max-width: 320px; text-align: center; }

	.bse-format,
	.bse-writing,
	.bse-pathway,
	.bse-together,
	.bse-includes {
		padding-top:    64px;
		padding-bottom: 56px;
	}

}