.hn-intro { margin:0; padding-block:clamp(48px,7vw,100px); background:#f9f4ebf5; }
.hn-intro__panel { position:relative; isolation:isolate; overflow:hidden; border-radius:32px; background:#203529; color:#fff9ef; min-height:650px; }
.hn-intro__backdrop { position:absolute; inset:0 0 0 38%; z-index:-3; }
.hn-intro__frame { position:absolute; inset:0; opacity:0; transition:opacity 1.6s ease; }
.hn-intro__frame.is-active { opacity:1; }
.hn-intro__frame img { width:100%; height:100%; object-fit:cover; object-position:center 48%; }
.hn-intro__shade { position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,#203529 0%,#203529 32%,rgba(32,53,41,.93) 42%,rgba(32,53,41,.15) 76%,rgba(32,53,41,.06)); }
.hn-intro__content { width:62%; max-width:760px; padding:clamp(38px,5vw,74px); }
.hn-intro__eyebrow { font:500 12px/1.5 'Jost',sans-serif; letter-spacing:.16em; text-transform:uppercase; margin:0 0 22px; color:#e4ddc8; text-wrap:balance; }
.hn-intro h2 { font:400 clamp(38px,4.6vw,66px)/1.02 'Forum',serif; color:inherit; text-transform:none; margin:0 0 20px; text-wrap:balance; }
.hn-intro__lead { font-size:18px; line-height:1.5; margin:0 0 32px; text-wrap:pretty; }
.hn-intro__offers { margin-bottom:30px; }
.hn-intro__offer { display:flex; align-items:center; justify-content:space-between; gap:16px; border-top:1px solid #ffffff38; padding:20px 0; }
.hn-intro__offer:last-child { border-bottom:1px solid #ffffff38; }
.hn-intro__offer h3 { font:500 21px/1.3 'Jost',sans-serif; text-transform:none; color:inherit; margin:0 0 5px; text-wrap:balance; }
.hn-intro__offer div > span { font-size:13px; color:#e4ddc8; }
.hn-intro__offer p { font:400 38px/1 'Forum',serif; white-space:nowrap; margin:0; }
.hn-intro__offer p span { font-size:23px; }
.hn-intro__cta { display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%; border:0; border-radius:999px; background:#f7efdf; color:#203529; padding:18px 25px; font:500 15px/1.3 'Jost',sans-serif; cursor:pointer; text-wrap:balance; transition:background .2s; }
.hn-intro__cta:hover { background:#fff; }
.hn-intro__cta:focus-visible { outline:3px solid #dca886; outline-offset:4px; }
.hn-intro__cta > span { font-size:24px; line-height:1; }
@media(max-width:1000px) { .hn-intro__content { width:70%; padding:40px; } .hn-intro__panel { min-height:610px; } }
@media(max-width:640px) {
 .hn-intro__panel { border-radius:26px; min-height:720px; display:flex; align-items:flex-end; }
 .hn-intro__backdrop { inset:0; }
 .hn-intro__shade { background:linear-gradient(180deg,rgba(20,38,28,.08),rgba(20,38,28,.42) 20%,rgba(20,38,28,.92) 46%,#203529 100%); }
 .hn-intro__content { width:100%; max-width:none; padding:140px 24px 76px; }
 .hn-intro h2 { font-size:42px; }
 .hn-intro__eyebrow { font-size:10px; margin-bottom:16px; }
 .hn-intro__lead { font-size:16px; margin-bottom:26px; }
 .hn-intro__offer h3 { font-size:19px; }
 .hn-intro__offer p { font-size:34px; }
 .hn-intro__offer div > span { font-size:12px; }
 .hn-intro__cta { font-size:14px; padding:17px 20px; gap:10px; }
}
@media(prefers-reduced-motion:reduce) { .hn-intro__frame { transition:none; } }

.hn-intro { scroll-margin-top:120px; }

.hn-intro__cta { width:360px; max-width:100%; font-size:18px; justify-content:center; gap:16px; }
@media(max-width:640px) { .hn-intro__cta { font-size:17px; } }
