/**
 * Born Slippy Waitlist.
 *
 * Enqueued as a real stylesheet rather than printed inline, because page
 * builders strip or reorder inline <style> inside shortcode output. Everything
 * carries !important for the same reason: builder resets are broad and load
 * after this file.
 *
 * The lens custom properties are the deliberate exception. The script writes to
 * them every frame, and !important would lock them.
 *
 * On height: the form decides. The image stretches to match it rather than
 * holding a fixed vh, which is what left a column of dead space beside a form
 * that was never going to be that tall.
 */

.bsw{
	--ink:#0A0A0A !important;
	--paper:#F7F5F2 !important;
	--line:rgba(10,10,10,.14) !important;
	--soft:rgba(10,10,10,.55) !important;
	--gutter:clamp(20px,4.5vw,64px) !important;
	--r:12px !important;
	--r-sm:8px !important;
	position:relative !important;
	left:50% !important;
	width:100vw !important;
	margin-left:-50vw !important;
	background:var(--paper) !important;
	color:var(--ink) !important;
}
.bsw *,.bsw *::before,.bsw *::after{ box-sizing:border-box !important; }
.bsw .bsw__wrap{ padding:clamp(80px,13vh,150px) var(--gutter) !important; max-width:1500px !important; margin:0 auto !important; }

/* dropped inside a section that already has a frame and a heading */
.bsw--bare{ position:static !important; left:auto !important; width:auto !important; margin-left:0 !important; background:transparent !important; }
.bsw--bare .bsw__wrap{ padding:0 !important; max-width:none !important; }
.bsw--bare .bsw__grid{ grid-template-columns:1fr !important; gap:0 !important; }

/* ---------- head ---------- */
.bsw .bsw__head{ max-width:1100px !important; margin:0 0 clamp(36px,5.5vh,64px) !important; }
.bsw .bsw__title{ margin:0 !important; font-size:clamp(30px,3.6vw,56px) !important; font-weight:800 !important; line-height:.98 !important; letter-spacing:-.032em !important; }
.bsw .bsw__lede{ margin:clamp(14px,2vh,22px) 0 0 !important; max-width:56ch !important; font-size:clamp(15px,1.05vw,17px) !important; line-height:1.6 !important; color:var(--soft) !important; }

/* ---------- layout ----------
   stretch, and no min-height on the media, so the two columns are exactly the
   same height and that height is whatever the form needs */
.bsw .bsw__grid{
	display:grid !important;
	grid-template-columns:1fr 1fr !important;
	gap:clamp(24px,3vw,52px) !important;
	align-items:stretch !important;
}
.bsw .bsw__grid--solo{ grid-template-columns:1fr !important; }

/* ---------- media ---------- */
.bsw .bsw__media{
	--mx:50%;--my:50%;--lens:0;--g:0;--tx:0px;--ty:40%;--th:6%;
	position:relative !important;
	overflow:hidden !important;
	background:#DCD8D1 !important;
	border-radius:var(--r) !important;
	height:100% !important;
	min-height:340px !important;
	cursor:crosshair !important;
}
.bsw .bsw__img{ position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; object-fit:cover !important; display:block !important; }
.bsw .bsw__img--blur{ z-index:0 !important; filter:blur(18px) brightness(1.24) saturate(.75) !important; transform:scale(1.1) !important; }
.bsw .bsw__logo{ position:absolute !important; top:50% !important; left:50% !important; transform:translate(-50%,-50%) !important; width:clamp(88px,22%,160px) !important; height:auto !important; z-index:1 !important; opacity:.85 !important; pointer-events:none !important; display:block !important; }
.bsw .bsw__lens{
	position:absolute !important;
	inset:0 !important;
	z-index:2 !important;
	opacity:var(--lens) !important;
	isolation:isolate !important;
	-webkit-mask-image:radial-gradient(circle 195px at var(--mx) var(--my),#000 0%,#000 46%,rgba(0,0,0,0) 82%) !important;
	mask-image:radial-gradient(circle 195px at var(--mx) var(--my),#000 0%,#000 46%,rgba(0,0,0,0) 82%) !important;
	-webkit-mask-repeat:no-repeat !important;
	mask-repeat:no-repeat !important;
	transition:opacity .4s cubic-bezier(.22,1,.36,1) !important;
}
.bsw .bsw__gl{ filter:brightness(1.12) saturate(.95) !important; }
.bsw .bsw__gl--b{ z-index:1 !important; }
.bsw .bsw__gl--tear{ z-index:2 !important; opacity:var(--g) !important; transform:translateX(var(--tx)) !important; clip-path:inset(var(--ty) 0 calc(100% - var(--ty) - var(--th)) 0) !important; }
.bsw .bsw__gl--r{ z-index:3 !important; mix-blend-mode:screen !important; opacity:calc(var(--g)*.75) !important; filter:brightness(1.12) sepia(1) saturate(6) hue-rotate(-42deg) !important; transform:translateX(calc(var(--g)*-11px)) !important; }
.bsw .bsw__gl--c{ z-index:4 !important; mix-blend-mode:screen !important; opacity:calc(var(--g)*.75) !important; filter:brightness(1.12) sepia(1) saturate(6) hue-rotate(148deg) !important; transform:translateX(calc(var(--g)*11px)) !important; }
.bsw .bsw__scrim{ position:absolute !important; inset:0 !important; z-index:1 !important; pointer-events:none !important; background:linear-gradient(180deg,rgba(247,245,242,.08) 0%,rgba(247,245,242,.30) 48%,rgba(247,245,242,.82) 100%) !important; }
.bsw .bsw__hint{
	position:absolute !important;
	left:0 !important; right:0 !important;
	bottom:clamp(14px,2.4vh,22px) !important;
	z-index:6 !important;
	margin:0 !important;
	text-align:center !important;
	font-size:9.5px !important;
	font-weight:700 !important;
	letter-spacing:.2em !important;
	text-transform:uppercase !important;
	color:var(--soft) !important;
	pointer-events:none !important;
	transition:opacity .5s ease !important;
}
.bsw.is-touched .bsw__hint{ opacity:0 !important; }

/* ---------- form ---------- */
/* the form fills the column edge to edge, so it reads as a panel beside the
   image rather than a stack floating in it */
.bsw .bsw__panel{
	display:flex !important;
	flex-direction:column !important;
	justify-content:center !important;
	width:100% !important;
	max-width:none !important;
	height:100% !important;
}
.bsw .bsw__form{ display:grid !important; gap:clamp(14px,1.8vh,20px) !important; width:100% !important; max-width:none !important; margin:0 !important; }
.bsw .bsw__two{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:clamp(14px,1.8vh,20px) !important; }
.bsw .bsw__field{ display:block !important; margin:0 !important; }
.bsw .bsw__label{ display:block !important; margin:0 0 8px !important; font-size:10px !important; font-weight:700 !important; letter-spacing:.16em !important; text-transform:uppercase !important; color:var(--soft) !important; }
.bsw .bsw__input{
	width:100% !important;
	height:auto !important;
	min-height:52px !important;
	padding:15px 16px !important;
	border:1px solid var(--line) !important;
	border-radius:var(--r-sm) !important;
	background:#fff !important;
	color:var(--ink) !important;
	font-family:inherit !important;
	font-size:16px !important;
	line-height:1.2 !important;
	-webkit-appearance:none !important;
	appearance:none !important;
	box-shadow:none !important;
	transition:border-color .25s !important;
}
.bsw .bsw__input:focus{ outline:0 !important; border-color:var(--ink) !important; box-shadow:none !important; }
.bsw .bsw__select{ position:relative !important; display:block !important; }
.bsw .bsw__select select{ padding-right:40px !important; cursor:pointer !important; }
.bsw .bsw__select-c{ position:absolute !important; right:16px !important; top:50% !important; width:8px !important; height:8px !important; margin-top:-6px !important; border-right:1.5px solid var(--soft) !important; border-bottom:1.5px solid var(--soft) !important; transform:rotate(45deg) !important; pointer-events:none !important; }

/* off screen rather than display:none, because some bots skip hidden fields */
/* off screen and inert. The [hidden] attribute alone is not enough, because a
   builder stylesheet that sets display on form rows can override it. */
.bsw .bsw__trap,
.bsw .bsw__trap[hidden]{
	position:absolute !important;
	left:-9999px !important;
	top:auto !important;
	width:1px !important;
	height:1px !important;
	overflow:hidden !important;
	opacity:0 !important;
	pointer-events:none !important;
	z-index:-1 !important;
}

.bsw .bsw__consent{ display:flex !important; align-items:flex-start !important; gap:11px !important; margin:0 !important; font-size:12px !important; line-height:1.55 !important; color:var(--soft) !important; cursor:pointer !important; }
.bsw .bsw__consent input{ margin:2px 0 0 !important; flex:none !important; width:16px !important; height:16px !important; accent-color:#0A0A0A !important; }
.bsw .bsw__err{ margin:0 !important; padding:12px 14px !important; border:1px solid var(--ink) !important; border-radius:var(--r-sm) !important; font-size:12px !important; font-weight:700 !important; line-height:1.5 !important; }

/* builders reset button padding, height and radius, and their selectors often
   beat a single class. Hence the element qualifier and an explicit min-height. */
.bsw button.bsw__submit,
.bsw .bsw__submit{
	display:flex !important;
	align-items:center !important;
	justify-content:center !important;
	gap:10px !important;
	width:100% !important;
	min-height:56px !important;
	height:auto !important;
	margin:2px 0 0 !important;
	padding:18px 26px !important;
	border:1px solid #0A0A0A !important;
	border-radius:999px !important;
	background:#0A0A0A !important;
	background-image:none !important;
	color:#F7F5F2 !important;
	font-family:inherit !important;
	font-size:11.5px !important;
	font-weight:700 !important;
	line-height:1 !important;
	letter-spacing:.22em !important;
	text-transform:uppercase !important;
	text-decoration:none !important;
	text-shadow:none !important;
	box-shadow:none !important;
	cursor:pointer !important;
	-webkit-appearance:none !important;
	appearance:none !important;
	transition:background-color .3s,color .3s,opacity .3s !important;
}
.bsw button.bsw__submit:hover{ background:transparent !important; color:#0A0A0A !important; }
.bsw button.bsw__submit[disabled]{ opacity:.5 !important; cursor:default !important; }
.bsw button.bsw__submit *{ pointer-events:none !important; }

.bsw .bsw__foot{ margin:0 !important; font-size:11.5px !important; line-height:1.6 !important; color:var(--soft) !important; }
.bsw .bsw__foot a{ color:var(--ink) !important; text-decoration:none !important; box-shadow:inset 0 -1px 0 var(--line) !important; }

/* ---------- done ---------- */
.bsw .bsw__done{ border-top:1px solid var(--line) !important; padding-top:clamp(24px,3vh,36px) !important; }
.bsw .bsw__done-k{ margin:0 !important; font-size:10.5px !important; font-weight:700 !important; letter-spacing:.16em !important; text-transform:uppercase !important; color:var(--soft) !important; }
.bsw .bsw__done-t{ margin:12px 0 0 !important; font-size:clamp(18px,1.6vw,26px) !important; font-weight:800 !important; letter-spacing:-.02em !important; line-height:1.2 !important; }
.bsw .bsw__done-b{ margin:10px 0 0 !important; font-size:13px !important; line-height:1.6 !important; color:var(--soft) !important; }

/* ---------- pillars ---------- */
.bsw .bsw__pillars{ display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:clamp(24px,3vw,56px) !important; margin:clamp(48px,7vh,88px) 0 0 !important; padding-top:clamp(28px,4vh,44px) !important; border-top:1px solid var(--line) !important; }
.bsw .bsw__pillar{ border-top:1px solid var(--line) !important; padding-top:18px !important; }
.bsw .bsw__pillar-n{ margin:0 0 12px !important; font-size:9.5px !important; font-weight:700 !important; letter-spacing:.18em !important; color:var(--soft) !important; }
.bsw .bsw__pillar-t{ margin:0 0 14px !important; font-size:clamp(15px,1.25vw,20px) !important; font-weight:800 !important; line-height:1.15 !important; letter-spacing:-.022em !important; }
.bsw .bsw__pillar-l{ list-style:none !important; display:grid !important; gap:10px !important; padding:0 !important; margin:0 !important; }
.bsw .bsw__pillar-l li{ position:relative !important; padding-left:16px !important; font-size:clamp(12px,.88vw,14px) !important; line-height:1.55 !important; color:var(--ink) !important; }
.bsw .bsw__pillar-l li::before{ content:"" !important; position:absolute !important; left:0 !important; top:.62em !important; width:4px !important; height:4px !important; border-radius:50% !important; background:var(--soft) !important; }

/* ---------- responsive ---------- */
@media (max-width:1023px){
	.bsw .bsw__grid{ gap:clamp(18px,2.4vw,32px) !important; }
	.bsw .bsw__pillars{ gap:clamp(18px,2.4vw,32px) !important; }
}
@media (max-width:767px){
	.bsw .bsw__grid{ grid-template-columns:1fr !important; gap:28px !important; }
	.bsw .bsw__media{ min-height:0 !important; aspect-ratio:4/5 !important; height:auto !important; }
	.bsw .bsw__two{ grid-template-columns:1fr !important; }
	.bsw .bsw__pillars{ grid-template-columns:1fr !important; gap:26px !important; }
}
@media (pointer:coarse){
	.bsw .bsw__media{ cursor:auto !important; }
	.bsw .bsw__img--blur{ display:none !important; }
	.bsw .bsw__lens{ opacity:1 !important; -webkit-mask-image:none !important; mask-image:none !important; }
	.bsw .bsw__gl--tear,.bsw .bsw__gl--r,.bsw .bsw__gl--c{ display:none !important; }
	.bsw .bsw__hint{ display:none !important; }
}
@media (prefers-reduced-motion:reduce){
	.bsw .bsw__media{ cursor:auto !important; }
	.bsw .bsw__img--blur{ display:none !important; }
	.bsw .bsw__lens{ opacity:1 !important; -webkit-mask-image:none !important; mask-image:none !important; transition:none !important; }
	.bsw .bsw__gl--tear,.bsw .bsw__gl--r,.bsw .bsw__gl--c{ display:none !important; }
	.bsw .bsw__input,.bsw button.bsw__submit,.bsw .bsw__hint{ transition:none !important; }
}