.home-page { background: var(--black); color: #f7f5f1; }
.home-hero { position: relative; isolation: isolate; background: #242020; overflow: hidden; }
.ambient-photo { position: absolute; inset: -40px; z-index: -4; background: url('hands.jpg') center/cover; filter: blur(25px) brightness(.3); transform: scale(1.06); }
.hands-photo { position: absolute; z-index: -3; left: 43%; top: 0; width: 57%; height: 100%; max-width: none; object-fit: cover; object-position: 48% center; }
.photo-blend { position: absolute; z-index: -2; inset: 0; background: linear-gradient(90deg,rgba(13,12,12,.56) 0%,rgba(15,13,14,.73) 33%,rgba(15,13,14,.62) 43%,rgba(17,15,16,.14) 57%,transparent 70%),linear-gradient(0deg,#0a090a 0%,#0a090a1a 13%,transparent 34%); }
.hero-inner { max-width: 1600px; padding: 44px 40px 50px; margin: 0 auto; }
.hero-copy { width: 52%; max-width: 795px; text-align: center; }
.hero-wordmark { display: block; width: 100%; height: auto; margin: 0 auto; }
.brand-rule { width: 174px; height: 2px; margin: 15px auto 15px; background: #8f2340; }
.hero-copy h1 { font: 400 clamp(21px,1.62vw,27px)/1.25 var(--serif); max-width: 740px; margin: 0 auto 29px; color: #faf8f5; text-shadow: 0 1px 8px #0006; }
.audience { padding: 0; margin: 0; min-width: 0; border: 0; }
.audience legend { font: 400 clamp(25px,2.04vw,34px)/1.22 var(--serif); width: 100%; padding: 0; margin-bottom: 15px; }
.audience-options { width: 76%; max-width: 600px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.audience-card { position: relative; display: flex; align-items: center; flex-direction: column; min-height: 185px; padding: 17px 12px 15px; background: linear-gradient(135deg,#fff,#f8f5f2); color: #19191e; border: 2px solid #fff8; border-radius: 22px; cursor: pointer; text-decoration: none; box-shadow: 0 8px 27px #0002; transition: transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.audience-icon { width: 65px; height: 64px; fill: none; stroke: var(--wine); stroke-width: 3.1; stroke-linejoin: round; stroke-linecap: round; }
.audience-label { font: 400 29px/1.15 var(--serif); margin: 8px 0 9px; white-space: nowrap; }
.round-arrow { display: grid; place-items: center; width: 44px; height: 44px; background: linear-gradient(145deg,#902742,#71112b); border-radius: 50%; color: #fff; }
.round-arrow .icon { width: 28px; height: 28px; stroke-width: 4; }
.audience-card:focus-visible { outline: 3px solid #e5b1c3; outline-offset: 5px; }
.audience-card:hover,.audience-card:focus-visible { border-color: #9a3753; box-shadow: 0 0 0 2px #f4d8e28c,0 8px 30px #0003; transform: translateY(-3px); }
.hero-quote { position: absolute; z-index: 1; top: 65px; right: max(30px,calc((100vw - 1600px)/2 + 10px)); width: 177px; margin: 0; font: italic 28px/1.22 var(--serif); text-align: center; color: #20232b; text-shadow: 0 1px 5px #fffd,0 0 20px #ffffff9c; }
.hero-quote span { display: block; width: 66px; height: 2px; margin: 19px auto 0; background: var(--wine); }
.ribbons { position: absolute; bottom: -2px; left: 0; width: 100%; height: 295px; z-index: -1; pointer-events: none; }
.benefits { background: var(--black); position: relative; }
.benefits-inner { display: grid; grid-template-columns: 1fr 1.2fr 1fr; max-width: 1350px; padding: 5px 28px 23px; margin: 0 auto; }
.benefits article { padding: 5px 28px 5px 37px; display: flex; align-items: flex-start; justify-content: center; gap: 25px; }
.benefits article+article { border-left: 1px solid #7b213a; }
.benefits .icon { width: 51px; height: 51px; stroke-width: 3.2; color: #a23a55; }
.benefits h2 { font: 400 20px/1.25 var(--serif); margin: 2px 0 5px; }
.benefits p { font: 400 17px/1.36 var(--serif); margin: 0; color: #dcd6d5; }
.home-page .site-footer { max-width: 1300px; padding: 16px 28px 21px; color: #aaa0a2; border-top: 1px solid #ffffff12; }
.error-content { padding: 110px 25px 140px; text-align: center; max-width: 750px; margin: auto; }
.error-content>.icon { width: 62px; height: 62px; color: var(--wine); margin-bottom: 20px; }
.error-content h1 { font: 46px/1.1 var(--serif); margin: 16px 0 20px; }
.error-content .button-primary { margin-top: 20px; }
@media (min-width: 1700px) {
 .home-hero { min-height: 700px; }
 .hero-inner { padding-top: 53px; padding-bottom: 66px; }
}
@media (max-width: 1200px) {
 .hero-inner { padding: 38px 28px 54px; }
 .hero-copy { width: 56%; }
 .hands-photo { left: 43%; width: 57%; object-position: 46% center; }
 .hero-copy h1 { font-size: 23px; }
 .desktop-break { display: none; }
 .audience-options { width: 85%; gap: 13px; }
 .audience-card { min-height: 169px; padding: 15px 8px 12px; border-radius: 18px; }
 .audience-icon { width: 56px; height: 56px; }
 .audience-label { font-size: 25px; }
 .round-arrow { width: 39px; height: 39px; }
 .hero-quote { font-size: 24px; right: 10px; top: 40px; width: 162px; }
 .benefits-inner { padding-inline: 18px; }
 .benefits article { gap: 18px; padding-inline: 19px; }
 .benefits .icon { width: 44px; height: 44px; }
 .benefits h2 { font-size: 18px; }
 .benefits p { font-size: 15px; }
}
@media (max-width: 850px) and (min-width: 701px) {
 .hero-copy { width: 61%; }
 .hero-copy h1 { font-size: 21px; }
 .hands-photo { left: 42%; width: 58%; }
 .hero-quote { font-size: 21px; width: 135px; top: 25px; }
 .audience-options { width: 93%; }
 .benefits article { flex-direction: column; gap: 10px; align-items: center; text-align: center; }
 .benefits-inner { grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 700px) {
 .home-hero { overflow: hidden; }
 .hero-inner { position: relative; padding: 40px 23px 52px; }
 .hero-copy { width: 100%; max-width: 520px; margin: 0 auto; }
 .hands-photo { left: 0; top: 0; width: 100%; height: 310px; object-fit: cover; object-position: 50% 42%; opacity: .42; }
 .photo-blend { background: linear-gradient(0deg,#0e0c0d 24%,rgba(13,11,12,.47) 75%,rgba(13,11,12,.4)),linear-gradient(90deg,#0a080a88,transparent); }
 .hero-wordmark { max-width: 510px; }
 .brand-rule { width: 110px; margin: 19px auto; }
 .hero-copy h1 { font-size: 24px; max-width: 465px; line-height: 1.3; margin-bottom: 29px; }
 .audience legend { font-size: 28px; line-height: 1.25; margin-bottom: 18px; }
 .audience-options { width: 100%; max-width: 465px; gap: 14px; }
 .audience-card { min-height: 176px; padding: 17px 8px 14px; border-radius: 18px; }
 .audience-icon { width: 59px; height: 59px; }
 .audience-label { font-size: 25px; margin: 10px 0; }
 .round-arrow { width: 40px; height: 40px; }
 .hero-quote { display: none; }
 .ribbons { height: 216px; }
 .benefits-inner { display: flex; flex-direction: column; max-width: 470px; padding: 0 25px 8px; gap: 0; }
 .benefits article { justify-content: flex-start; padding: 19px 14px; gap: 25px; }
 .benefits article+article { border-left: 0; border-top: 1px solid #602133; }
 .benefits .icon { width: 43px; height: 43px; }
 .benefits h2 { font-size: 20px; }
 .benefits p { font: 14px/1.5 var(--sans); }
 .benefits p br { display: none; }
 .home-page .site-footer { margin: 0 22px; }
}
@media (max-width: 380px) {
 .hero-inner { padding-inline: 18px; padding-top: 32px; }
 .hero-copy h1 { font-size: 22px; }
 .audience legend { font-size: 25px; }
 .audience-label { font-size: 22px; }
 .audience-options { gap: 11px; }
 .audience-card { min-height: 166px; }
 .audience-icon { width: 52px; height: 52px; }
 .benefits h2 { font-size: 18px; }
}
/* Feather the supplied photograph into the dark copy area rather than
   stretching it across the entire page. */
@media (min-width: 701px) {
 .hands-photo { -webkit-mask-image: linear-gradient(90deg,transparent,#000 24%); mask-image: linear-gradient(90deg,transparent,#000 24%); }
}
