/* ============================================================
   LE HAUS — OUR STORY (page-only styles)
   ------------------------------------------------------------
   Loaded after common.css + pillar.css. Only what's genuinely
   unique to this page: hero height, this page's photography, and
   the one section that doesn't match an existing component
   (the "More than places to stay" photo-with-overlay banner).
   Section photos (except the founder's) are set inline from the
   our_story_section table.
   Everything else on this page reuses .story / .media-quote /
   OurPillars.ascx as-is. See STYLE-GUIDE.md.
   ============================================================ */

.hero{min-height:var(--hero-height,80vh);}

/* ----- The Beginning: founder photo + signature block ----- */
.founder-img-bg{background-image:url('/img/db/content/watershed-moment-2.jpg');}
.founder-story .story-img{min-height:640px;}
.founder-body p{
	font-size:16px;
	color:var(--ink);
	line-height:1.9;
	margin-bottom:16px;
}
.founder-signature{width:150px;height:auto;margin:8px 0 8px;}
.founder-name{
	font-family:'Jost',sans-serif;
	font-style:normal;
	font-weight:600;
	font-size:14px;
	margin-bottom:2px;
}
.founder-role{font-size:13px;color:var(--muted);}
.founder-story .media-quote{max-width:180px;}

/* ----- More than places to stay: photo (with overlaid heading) +
   cream sidebar. Unique to this page — not an existing component. ----- */
.living-banner{
	display:grid;
	grid-template-columns:1.7fr 1fr;
	background:var(--cream);
}
.living-banner-photo{
	position:relative;
	min-height:420px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	padding:60px 70px;
	color:#fff;
	overflow:hidden;
	background-size:cover;
	background-position:center;
}
.living-banner-photo::before{
	content:"";
	position:absolute;inset:0;
	z-index:0;
	background:linear-gradient(100deg, rgba(10,9,7,.85) 0%, rgba(10,9,7,.55) 45%, rgba(10,9,7,.1) 78%, transparent 100%);
}
.living-banner-photo > *{position:relative;z-index:1;}
.living-banner-photo h2{
	font-size:var(--fs-h2);
	font-weight:var(--fw-h2);
	line-height:1.2;
	margin:14px 0 20px;
}
.living-banner-photo p:not(.eyebrow){
	font-size:16px;
	line-height:1.6;
	color:#fff;
	max-width:340px;
}
.living-banner-side{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:flex-start;
	gap:26px;
	padding:50px 60px;
}
.living-banner-side p{font-size:16px;color:var(--muted);line-height:1.7;}

/* ----- Extraordinary people / Help build the legacy: photos come
   from our_story_section.image (inline style in OurStory.aspx). ----- */

@media (max-width:1100px){
	.living-banner{grid-template-columns:1fr;}
	.living-banner-photo{padding:50px 32px;}
	.living-banner-side{padding:40px 32px;}
}
