/* Homepage hero: an editorial layout with a live catalogue from the database. */
.home-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 58px max(24px, calc((100vw - 1160px) / 2)) 22px;
    background: radial-gradient(ellipse at 85% 36%, #ecdfba 0, transparent 48%), #faf7ef;
    color: #35281f;
    border-bottom: 1px solid #e8deca;
}
.home-hero::before {
    content: "";
    position: absolute;
    width: 720px;
    height: 720px;
    top: -90px;
    right: -290px;
    z-index: -1;
    border: 1px solid rgba(143, 110, 40, .14);
    border-radius: 50%;
    box-shadow: 0 0 0 65px rgba(179, 141, 65, .035), 0 0 0 130px rgba(179, 141, 65, .025);
    pointer-events: none;
}
.home-hero-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(36px, 6vw, 90px);
}
.home-hero-content { padding: 8px 0 18px; }
.home-hero-location {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 0 0 34px;
    color: #746044;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .17em;
    text-transform: uppercase;
}
.home-hero-location span { font-size: 19px; color: #98732d; }
.home-hero-kicker { margin: 0 0 13px; color: #7a6546; font-size: 11px; letter-spacing: .12em; }
.home-hero h1 { margin: 0; font: 500 clamp(56px, 5.7vw, 82px)/1.03 var(--serif); letter-spacing: -.045em; }
.home-hero h1 span { display: block; margin-top: 5px; color: #97702a; font-style: italic; font-weight: 500; }
.home-hero-intro { margin: 25px 0 13px; font-size: 20px; font-weight: 500; line-height: 1.5; letter-spacing: -.025em; }
.home-hero-copy { max-width: 460px; margin: 0; color: #716453; font-size: 15px; line-height: 1.85; }
.home-hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 25px; margin: 29px 0 33px; }
.home-hero .home-hero-book {
    gap: 20px;
    min-height: 54px;
    padding: 0 23px;
    border-radius: 8px;
    background: #392b20;
    color: #fff9e9;
    font-size: 12px;
    letter-spacing: .025em;
    text-transform: none;
    box-shadow: 0 7px 17px rgba(53, 40, 25, .13);
}
.home-hero-book span { color: #e5c877; font-size: 20px; font-weight: 400; }
.home-hero .home-hero-book:hover { background: #584028; box-shadow: 0 9px 22px rgba(53, 40, 25, .2); }
.home-hero-explore { display: inline-flex; align-items: center; gap: 14px; min-height: 48px; color: #57432d; font-size: 12px; font-weight: 600; }
.home-hero-explore span { font-size: 19px; transition: transform .2s; }
.home-hero-explore:hover span { transform: translateX(4px); }
.home-hero a:focus-visible { outline: 3px solid #96712c; outline-offset: 5px; border-radius: 7px; }
.home-hero-facts { display: flex; flex-wrap: wrap; gap: 16px 25px; margin: 0; padding-top: 24px; border-top: 1px solid #ded2ba; }
.home-hero-facts div + div { padding-left: 25px; border-left: 1px solid #ded2ba; }
.home-hero-facts dt { margin-bottom: 4px; color: #7a6c57; font-size: 10px; }
.home-hero-facts dd { margin: 0; font-size: 14px; font-weight: 600; }
.home-hero-facts dd small { font-size: 11px; font-weight: 400; }
.home-hero-visual { position: relative; width: min(100%, 410px); justify-self: end; margin: 0; }
.home-hero-frame { padding: 9px 9px 0; border: 1px solid #e0cfaa; border-radius: 20px; background: #fffcf5; box-shadow: 0 24px 48px -20px rgba(70, 47, 12, .3); }
.home-hero-frame img { width: 100%; height: auto; aspect-ratio: 1060 / 1484; border-radius: 12px; }
.home-db-catalog { overflow: hidden; border-radius: 12px; background: linear-gradient(145deg,#5c3d15,#24170e 75%); color: #fff8e8; }
.home-db-catalog-heading { padding: 19px 18px 13px; border-bottom: 1px solid rgba(231,203,132,.32); }
.home-db-catalog-heading p { margin: 0 0 7px; color: #e5c877; font-size: 8px; font-weight: 700; letter-spacing: .16em; }
.home-db-catalog-heading h2 { margin: 0; color: #fff8e8; font: 500 27px/1.2 var(--serif); }
.home-db-catalog-heading span { display: block; margin-top: 5px; color: #d6c7a4; font-size: 10px; }
.home-db-catalog-scroll { max-height: 424px; overflow: auto; scrollbar-color: #b59757 #372718; }
.home-db-catalog-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.home-db-catalog-table th,.home-db-catalog-table td { padding: 8px 5px; border-bottom: 1px solid rgba(231,203,132,.18); text-align: center; font-size: 9px; }
.home-db-catalog-table thead th { color: #e8d39c; font-size: 9px; }
.home-db-catalog-table thead th:first-child,.home-db-catalog-table tbody th { width: 46%; padding-left: 12px; text-align: left; }
.home-db-catalog-table tbody th { color: #fff8e8; font-weight: 500; line-height: 1.35; }
.home-db-catalog-table tbody td { color: #efd88f; white-space: nowrap; }
.home-db-catalog-table small { display: block; color: #d6c7a4; font-size: 7px; font-weight: 400; }
.home-db-catalog-table tr:last-child th,.home-db-catalog-table tr:last-child td { border-bottom: 0; }
.home-hero-frame figcaption { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 10px; font-size: 12px; font-weight: 600; }
.home-hero-frame figcaption small { display: block; margin-top: 3px; color: #76684f; font-size: 10px; font-weight: 400; }
.home-hero-frame figcaption a { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border: 1px solid #d9c9a8; border-radius: 50%; color: #725325; font-size: 22px; transition: background .2s; }
.home-hero-frame figcaption a:hover { background: #f0e5cb; }
.home-hero-note { display: flex; align-items: center; gap: 13px; margin-top: 30px; padding-top: 19px; border-top: 1px solid #e5dbc8; color: #7b6d59; }
.home-hero-note svg { width: 22px; height: 22px; flex: none; color: #9a7a3d; }
.home-hero-note p { max-width: 970px; margin: 0; font-size: 11px; line-height: 1.7; }
.home-hero-note strong { font-weight: 600; color: #5e4d36; }
@media (max-width: 1000px) {
    .home-hero { padding-top: 38px; }
    .home-hero-layout { gap: 30px; }
    .home-hero h1 { font-size: clamp(48px, 6.6vw, 70px); }
    .home-hero-location { margin-bottom: 24px; }
    .home-hero-facts { gap: 13px; }
    .home-hero-facts div + div { padding-left: 13px; }
    .home-hero-facts dd { font-size: 12px; }
}
@media (max-width: 740px) {
    .home-hero { padding: 32px 22px 23px; }
    .home-hero-layout { grid-template-columns: minmax(0, 1fr); gap: 30px; }
    .home-hero-content { padding: 0; }
    .home-hero-location { margin-bottom: 25px; font-size: 9px; }
    .home-hero h1 { font-size: clamp(50px, 11.7vw, 75px); }
    .home-hero-intro { font-size: 19px; margin-top: 23px; }
    .home-hero-copy { max-width: 540px; font-size: 14px; }
    .home-hero-actions { gap: 12px 20px; margin: 24px 0; }
    .home-hero-visual { width: min(100%, 390px); justify-self: center; }
    .home-hero-facts { justify-content: space-between; }
    .home-hero-note { align-items: flex-start; margin-top: 26px; }
}
@media (max-width: 380px) {
    .home-hero { padding-inline: 18px; }
    .home-hero .home-hero-book { width: 100%; }
    .home-hero-explore { justify-content: center; width: 100%; }
    .home-hero-facts { gap: 10px; }
    .home-hero-facts div + div { padding-left: 10px; }
    .home-hero-facts dd { font-size: 11px; }
}
