/* Portrait-led opening, following the Halloween guide composition. */
.topbar{height:82px;border:0;gap:22px}
.topbar nav{display:flex;gap:0}
.topbar nav .hero-call-link{display:flex;align-items:center;justify-content:center;min-height:44px;padding:11px 18px;border:1px solid #f4ede470;border-radius:3px;font:700 12px/1.5 var(--body);white-space:nowrap;text-decoration:none}
.hero-cover{background:#160a10;position:relative;isolation:isolate}
.hero-photo{position:absolute;inset:0 0 0 auto;width:52%;height:100%;object-fit:cover;object-position:center 16%;z-index:-2}
.hero-cover:after{position:absolute;inset:0;content:"";z-index:-1;background:linear-gradient(90deg,#160a10 0%,#160a10 32%,#160a10e8 44%,#160a1066 60%,#160a1000 76%),linear-gradient(0deg,#160a10c9,transparent 24%);pointer-events:none}
.hero{min-height:790px;padding-top:148px;padding-bottom:74px}
.hero .eyebrow{margin:0 0 25px;font:700 10px/1.6 var(--body);letter-spacing:1.2px;max-width:none;color:#e0ccbe}
.hero h1{font:700 clamp(32px,3.7vw,52px)/1.25 var(--head);letter-spacing:-1.8px;margin:0 0 29px;max-width:760px}
.hero h1>span{display:block;white-space:nowrap;width:fit-content}
.hero h1>span+span{margin-top:6px}
.hero h1 mark{display:inline-block;background:var(--cream);color:var(--wine);padding:0 8px 4px;box-shadow:5px 5px 0 var(--wine)}
.hero-description{font:700 21px/1.5 var(--head);letter-spacing:-.65px;max-width:540px;margin:0 0 28px;color:var(--cream);text-wrap:pretty}
.hero-route{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:540px;list-style:none;margin:0 0 28px;padding:0;border-block:1px solid #d8b8b65c}
.hero-route li{display:flex;flex-direction:column;gap:7px;padding:15px 18px;border-left:1px solid #d8b8b65c;min-width:0}
.hero-route li:first-child{border-left:0;padding-left:0}
.hero-route li:last-child{padding-right:0}
.hero-route b{font:700 12px/1.3 var(--head);color:#cfa398}
.hero-route span{font:600 13px/1.5 var(--body);white-space:nowrap}
.hero-cta-group{margin:0}
.hero-actions{margin:0;gap:0}
.hero-actions .button{font:700 12px/1.5 var(--body);padding:17px 30px;min-height:56px;gap:28px;min-width:325px;max-width:100%}
.hero-note{font-size:11px;line-height:1.6;color:#cbb6bb;margin:12px 0 0;max-width:none}
.hero-credit{display:flex;align-items:center;width:fit-content;max-width:100%;gap:13px;border:0;margin-top:25px;padding:0;text-decoration:none}
.hero-credit img{width:48px;height:48px;flex:none;border:2px solid var(--cream);border-radius:50%;object-fit:cover;object-position:center 18%}
.hero-credit b{display:block;font-size:13px;line-height:1.5}
.hero-credit small{display:block;font-size:11px;line-height:1.6;color:#d8c5c0;margin-top:3px}
.hero-credit:hover small{text-decoration:underline;text-underline-offset:4px}
@media(min-width:1600px){.hero{min-height:850px;padding-top:170px}.hero-photo{object-position:center 22%}}
@media(max-width:1000px) and (min-width:781px){.hero{min-height:730px;padding-top:135px}.hero-photo{width:64%}.hero h1{font-size:34px}.hero-description{font-size:19px;max-width:450px}.hero-route{max-width:450px}.hero-cover:after{background:linear-gradient(90deg,#160a10 0%,#160a10ed 39%,#160a1080 59%,transparent 84%),linear-gradient(0deg,#160a10b0,transparent 28%)}}
@media(max-width:780px){
 .topbar{height:72px;padding-inline:22px;gap:16px}
 .topbar .brand{font-size:18px}
 .topbar nav .hero-call-link{min-height:38px;font-size:10px;padding:9px 12px}
 .hero-cover{display:flex;flex-direction:column}
 .hero-photo{order:0;position:relative;inset:auto;width:100%;height:clamp(290px,82vw,420px);object-fit:cover;object-position:center top;z-index:0}
 .hero-cover:after{inset:0 0 auto;height:clamp(290px,82vw,420px);z-index:1;background:linear-gradient(180deg,#160a1060 0%,#160a1000 26%,#160a1000 62%,#160a1073 83%,#160a10 100%)}
 .hero{order:1;position:relative;z-index:2;min-height:0;margin-top:-35px;padding:0 0 53px}
 .hero .eyebrow{margin:0 0 18px;font-size:9px;line-height:1.6;letter-spacing:.75px}
 .hero h1{font-size:clamp(22px,6.35vw,38px);line-height:1.23;letter-spacing:-1.1px;margin:0 0 23px}
 .hero h1>span+span{margin-top:6px}
 .hero h1 mark{padding:0 6px 3px;box-shadow:4px 4px 0 var(--wine)}
 .hero-description{font:700 clamp(16px,4.2vw,21px)/1.5 var(--head);letter-spacing:-.5px;max-width:520px;margin:0 0 23px}
 .hero-route{max-width:520px;margin-bottom:23px}
 .hero-route li{gap:5px;padding:12px 10px}
 .hero-route b{font-size:10px}
 .hero-route span{font-size:11px;line-height:1.45}
 .hero-actions .button{font-size:12px;min-width:0;width:min(100%,360px);min-height:54px;padding:15px 21px;gap:20px}
 .hero-note{font-size:10px;line-height:1.6;margin-top:10px}
 .hero-credit{margin-top:23px;gap:12px;padding:0;border:0}
 .hero-credit img{width:44px;height:44px}
 .hero-credit b{font-size:12px}
 .hero-credit small{font-size:10px;margin-top:3px}
}
@media(max-width:360px){
 .topbar{padding-inline:17px;gap:12px;height:66px}
 .topbar .brand{font-size:15px}
 .topbar nav .hero-call-link{font-size:9px;padding-inline:10px;min-height:36px}
 .hero-photo,.hero-cover:after{height:clamp(265px,84vw,300px)}
 .hero{margin-top:-28px;padding-bottom:50px}
 .hero .eyebrow{font-size:8px;letter-spacing:.6px;margin-bottom:17px}
 .hero h1{font-size:22px;letter-spacing:-1.15px}
 .hero-description{font-size:16px}
 .hero-route li{padding-inline:8px}.hero-route span{font-size:10px}
 .hero-actions .button{font-size:11px}
 .hero-credit b{font-size:11px}.hero-credit small{font-size:9px}
}