.henan-page{ background:#f2ebde; }
.henan-topbar{ position:relative; z-index:2; min-height:4.25rem; padding:.7rem clamp(1.25rem,5vw,4.75rem); display:flex; align-items:center; justify-content:space-between; gap:1rem; border-bottom:1px solid rgba(44,24,16,.14); background:#f2ebde; }
.henan-brand{ display:flex; align-items:baseline; gap:.65rem; text-decoration:none; white-space:nowrap; }
.henan-brand span{ font-family:var(--font-head); font-size:1.35rem; color:#922e26; letter-spacing:.1em; }
.henan-brand small{ font-size:.69rem; letter-spacing:.14em; color:#66554a; }
.henan-return{ color:#53483c; text-decoration:none; font-size:.8rem; letter-spacing:.1em; }
.henan-return:hover{ color:#922e26; }

.henan-hero{ position:relative; overflow:hidden; min-height:min(43rem,calc(100svh - 4.25rem)); background:#173a36; color:#f4e8cd; }
.henan-hero::before{ content:''; position:absolute; inset:0; opacity:.7; background:radial-gradient(ellipse at 68% 50%,rgba(214,168,88,.14),transparent 34%),repeating-linear-gradient(125deg,transparent 0,transparent 23px,rgba(238,219,178,.025) 24px,transparent 25px); pointer-events:none; }
.henan-hero::after{ content:''; position:absolute; inset:1.25rem; border:1px solid rgba(236,204,146,.21); pointer-events:none; }
.henan-hero-inner{ position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(17rem,.9fr); align-items:center; gap:2rem; max-width:78rem; min-height:36rem; margin:auto; padding:3.25rem clamp(2rem,7vw,6rem) 4rem; }
.henan-hero-copy{ max-width:37rem; }
.henan-overline{ margin:0 0 2.3rem; color:#d9bd89; font-size:.69rem; letter-spacing:.28em; }
.henan-hero-script{ margin:0 0 .3rem; color:#e5bb78; font-family:'Ma Shan Zheng',var(--font-head); font-size:clamp(1.6rem,2.4vw,2.45rem); letter-spacing:.12em; }
.henan-hero h1{ margin:0; font-family:var(--font-head); font-weight:400; font-size:clamp(3.7rem,8vw,7rem); line-height:1.2; letter-spacing:.06em; white-space:nowrap; }
.henan-hero h1 span{ display:block; margin-left:.5em; color:#e6c489; }
.henan-hero-lead{ max-width:31rem; margin:1.7rem 0 2rem; color:#e2d7c1; font-size:.93rem; line-height:2.1; }
.henan-hero-action{ display:inline-flex; align-items:center; justify-content:space-between; gap:2.25rem; min-width:12rem; padding:.66rem 1.1rem; border:1px solid rgba(232,190,120,.72); color:#f3e5cc; font-family:var(--font-head); font-size:.84rem; letter-spacing:.13em; text-decoration:none; transition:background .25s,transform .25s; }
.henan-hero-action:hover{ background:rgba(237,200,141,.12); transform:translateY(-2px); }
.henan-hero-action span{ font-size:1.15rem; }
.henan-hero-art{ position:relative; width:min(100%,26rem); aspect-ratio:1; margin:auto; display:grid; place-items:center; }
.henan-orbit{ position:absolute; display:block; width:100%; aspect-ratio:1; border:1px solid rgba(226,187,120,.25); border-radius:50%; }
.henan-orbit-one::before,.henan-orbit-one::after{ content:''; position:absolute; width:5px; height:5px; background:#e6c489; border-radius:50%; }
.henan-orbit-one::before{ top:9%; left:21%; }.henan-orbit-one::after{ bottom:13%; right:17%; }
.henan-orbit-two{ width:72%; border-style:dashed; border-color:rgba(226,187,120,.32); }
.henan-river{ position:absolute; inset:15% -8%; border-top:1px solid rgba(233,205,151,.58); border-radius:50%; transform:rotate(-22deg) translateY(30%); }
.henan-river::after{ content:''; position:absolute; top:1.2rem; left:8%; width:82%; height:70%; border-top:1px solid rgba(233,205,151,.2); border-radius:50%; }
.henan-hero-seal{ position:relative; z-index:1; width:53%; aspect-ratio:1; display:grid; place-items:center; border:1px solid rgba(237,197,135,.7); background:rgba(12,46,43,.4); box-shadow:0 0 0 8px rgba(12,46,43,.32),0 0 0 9px rgba(237,197,135,.35); color:#eac992; font-family:'Ma Shan Zheng',var(--font-head); font-size:clamp(8rem,16vw,13rem); line-height:1; transform:rotate(-8deg); }
.henan-art-caption{ position:absolute; right:-2%; bottom:8%; writing-mode:vertical-rl; color:#c7b690; font-family:var(--font-head); letter-spacing:.45em; font-size:.75rem; }
.henan-hero-foot{ position:relative; z-index:1; display:flex; justify-content:space-between; gap:1rem; max-width:78rem; margin:auto; padding:1rem clamp(2rem,7vw,6rem) 1.3rem; border-top:1px solid rgba(235,198,135,.22); color:#d7c8aa; font-size:.68rem; letter-spacing:.18em; }

.henan-intro{ max-width:74rem; display:grid; grid-template-columns:12rem minmax(0,1fr); gap:clamp(2rem,5vw,5.5rem); align-items:center; margin:auto; padding:clamp(3.2rem,7vw,6rem) clamp(1.25rem,5vw,3rem); border-bottom:1px solid rgba(55,42,31,.18); }
.henan-intro-mark{ width:10rem; aspect-ratio:1; display:grid; place-items:center; border:1px solid rgba(148,62,46,.4); color:#a74a36; font-family:'Ma Shan Zheng',var(--font-head); font-size:3.2rem; letter-spacing:.15em; transform:rotate(-6deg); }
.henan-section-kicker{ margin:0 0 .35rem; color:#9e3b2e; font-size:.7rem; letter-spacing:.2em; }
.henan-intro h2,.henan-catalog h2{ margin:.3rem 0 .9rem; font-family:var(--font-head); font-size:clamp(1.8rem,3.2vw,2.55rem); font-weight:400; letter-spacing:.1em; }
.henan-intro p:last-child{ max-width:48rem; margin:0; color:#574d40; line-height:2.05; font-size:.92rem; }

.henan-catalog{ max-width:79rem; margin:auto; padding:clamp(3rem,6vw,5rem) clamp(1.25rem,5vw,3rem) 6rem; }
.henan-catalog-head{ display:flex; justify-content:space-between; align-items:end; gap:1.5rem; }
.henan-catalog-head h2{ margin-bottom:0; }
.henan-catalog-head > p{ margin:0 0 .25rem; color:#716154; font-size:.8rem; }
.henan-tools{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:2rem 0 1.15rem; padding:.9rem 1.1rem; border-top:1px solid rgba(55,42,31,.26); border-bottom:1px solid rgba(55,42,31,.26); }
.henan-search{ display:flex; align-items:center; gap:.7rem; width:min(32rem,100%); border-bottom:1px solid rgba(55,42,31,.27); }
.henan-search:focus-within{ border-color:#a1392b; }
.henan-search span{ color:#a1392b; font-size:1.35rem; }
.henan-search input{ width:100%; min-height:2.5rem; border:0; outline:0; background:transparent; color:#2c251f; font:inherit; font-size:.85rem; }
.henan-search input::placeholder{ color:#776b5d; }
.henan-count{ flex:none; margin:0; color:#8b392d; font-family:var(--font-head); font-size:.78rem; letter-spacing:.1em; }
.henan-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.1rem; }
.henan-card{ min-width:0; }
.henan-card[hidden]{ display:none; }
.henan-card-panel{ height:100%; display:flex; flex-direction:column; padding:1.35rem clamp(1.15rem,2.4vw,1.7rem) 1.2rem; border:1px solid #d8ccbb; background:#f9f4e9; box-shadow:0 10px 30px -25px rgba(43,35,25,.32); }
.henan-card:first-child{ grid-column:1/-1; }
.henan-card:first-child .henan-card-panel{ display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); column-gap:clamp(2rem,5vw,5rem); background:linear-gradient(115deg,#f8f0dd,#f7e8d0); border-color:#c6a87a; }
.henan-card:first-child .henan-card-upper{ grid-column:1/-1; }
.henan-card:first-child h3{ grid-column:1; grid-row:2; font-size:clamp(2.4rem,4vw,3.4rem); }
.henan-card:first-child .henan-card-epithet{ grid-column:1; grid-row:3; }
.henan-card:first-child .henan-card-intro{ grid-column:1; grid-row:4; min-height:0; max-width:32rem; font-size:.88rem; }
.henan-card:first-child .henan-card-spots-label{ grid-column:2; grid-row:2; align-self:end; margin:0 0 .45rem; }
.henan-card:first-child .henan-card-spots{ grid-column:2; grid-row:3/5; }
.henan-card:first-child .henan-card-end{ grid-column:1/-1; grid-row:5; margin-top:1rem; }
.henan-card-upper{ display:flex; justify-content:space-between; align-items:start; }
.henan-card-number{ font-size:.75rem; letter-spacing:.2em; color:#9c4431; }
.henan-card-seal{ width:1.85rem; height:1.85rem; display:grid; place-items:center; border:1px solid #a44938; color:#a44938; font-family:var(--font-head); font-size:1.1rem; line-height:1; }
.henan-card h3{ margin:.45rem 0 0; font-family:var(--font-head); font-size:clamp(1.7rem,2.8vw,2.2rem); font-weight:400; letter-spacing:.14em; line-height:1.4; color:#241e19; }
.henan-card-epithet{ margin:.08rem 0 1.15rem; color:#9e4734; font-family:var(--font-head); font-size:.78rem; letter-spacing:.17em; }
.henan-card-intro{ margin:0 0 1rem; min-height:7.1rem; color:#57493c; font-size:.77rem; line-height:1.85; }
.henan-card-spots-label{ margin:auto 0 .55rem; padding-top:.85rem; border-top:1px solid rgba(68,49,31,.17); color:#9d392b; font-size:.69rem; letter-spacing:.16em; }
.henan-card-spots{ list-style:none; margin:0; padding:0; }
.henan-card-spots li{ display:grid; grid-template-columns:minmax(0,1fr); gap:.05rem; padding:.37rem 0; border-bottom:1px solid rgba(68,49,31,.09); line-height:1.55; }
.henan-card-spots strong{ color:#332a22; font-family:var(--font-head); font-size:.82rem; font-weight:400; }
.henan-card-spots span{ color:#736457; font-size:.68rem; }
.henan-card-end{ display:inline-flex; align-items:center; justify-content:space-between; align-self:flex-start; gap:1.5rem; width:max-content; max-width:100%; margin-top:auto; padding:.52rem .8rem; border:1px solid rgba(145,58,44,.55); color:#913a2c; font-family:var(--font-head); font-size:.78rem; letter-spacing:.08em; text-decoration:none; transition:background .2s,color .2s,border-color .2s; }
.henan-card-end:hover,.henan-card-end:focus-visible{ background:#913a2c; border-color:#913a2c; color:#fff7eb; }
.henan-card-end span{ font-family:var(--font-body); font-size:1rem; transition:transform .25s; }
.henan-card-end:hover span{ transform:translate(2px,-2px); }
.henan-empty{ padding:3rem 1rem; text-align:center; color:#67564a; }
.henan-empty[hidden]{ display:none; }

.henan-footer{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1.5rem 2rem; padding:2rem max(1.25rem,calc((100vw - 73rem)/2)); border-top:1px solid rgba(218,185,128,.28); background:#193631; color:#e9dec9; }
.henan-footer > div:first-child{ display:flex; align-items:center; gap:.8rem; }
.henan-footer-seal{ width:2.35rem; height:2.35rem; display:grid; place-items:center; border:1px solid #d4ad74; color:#e0b77b; font-family:var(--font-head); font-size:1.2rem; }
.henan-footer p{ margin:0; font-family:var(--font-head); font-size:.87rem; letter-spacing:.15em; }
.henan-sources{ display:flex; gap:.7rem; flex-wrap:wrap; align-items:center; font-size:.68rem; }
.henan-sources span{ color:#bead8e; }
.henan-sources a,.henan-footer-back{ color:#eedfc1; text-decoration:none; border-bottom:1px solid rgba(238,223,193,.38); }
.henan-sources a:hover,.henan-footer-back:hover{ color:#fff7e7; border-color:#fff7e7; }
.henan-footer-back{ font-size:.75rem; }
.henan-to-top{ position:fixed; right:1.25rem; bottom:1.25rem; z-index:3; width:2.6rem; height:2.6rem; display:grid; place-items:center; border:1px solid #bd9460; background:#193631; color:#f5e7ca; font-size:1.2rem; cursor:pointer; opacity:0; pointer-events:none; transform:translateY(.5rem); transition:opacity .2s,transform .2s; }
.henan-to-top.is-visible{ opacity:1; pointer-events:auto; transform:translateY(0); }

@media(max-width:1050px){ .henan-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } .henan-card-intro{ min-height:5.2rem; } }
@media(max-width:760px){ .henan-hero{ min-height:auto; } .henan-hero-inner{ min-height:0; grid-template-columns:1fr; padding:3.5rem 2rem 2.3rem; } .henan-hero-copy{ position:relative; z-index:2; } .henan-hero-art{ position:absolute; right:-7rem; top:1.2rem; width:20rem; opacity:.27; } .henan-hero h1{ font-size:clamp(3.4rem,12vw,5rem); } .henan-hero-lead{ max-width:28rem; } .henan-intro{ grid-template-columns:1fr; gap:1.3rem; } .henan-intro-mark{ width:5rem; font-size:1.7rem; } .henan-catalog-head{ align-items:start; flex-direction:column; gap:.5rem; } .henan-grid{ grid-template-columns:1fr; } .henan-card-intro{ min-height:0; } .henan-card:first-child .henan-card-panel{ display:flex; } .henan-card:first-child .henan-card-spots-label{ margin:auto 0 .55rem; } }
@media(max-width:500px){ .henan-topbar{ min-height:3.8rem; } .henan-brand small{ display:none; } .henan-hero-inner{ padding:3rem 1.6rem 2.5rem; } .henan-overline{ margin-bottom:1.6rem; } .henan-hero-foot{ padding-inline:1.6rem; } .henan-hero-foot span:last-child{ display:none; } .henan-tools{ align-items:stretch; flex-direction:column; } .henan-count{ text-align:right; } .henan-footer{ align-items:start; flex-direction:column; } }
@media(prefers-reduced-motion:reduce){ .henan-card-end,.henan-hero-action,.henan-to-top{ transition:none; } }
