/* 字体已本地化：static/css/fonts.css 由 comm/header.html 引入（2026-09-29），此处不再 @import，避免重复加载 */

@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --ivory: #f6f1e8;
  --paper: #fbf8f2;
  --red: #9e2f2c;
  --red-dark: #70211f;
  --sage: #7d8b73;
  --forest: #263b32;
  --ink: #2c2926;
  --muted: #77716a;
  --line: rgba(44, 41, 38, .14);
  --serif: "Noto Serif SC", serif;
  --sans: "Outfit", "Noto Sans SC", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-weight: 300; -webkit-font-smoothing: antialiased; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }
.site-shell { overflow: hidden; }
.container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.section { padding: 112px 0; }

.topbar { height: 34px; background: var(--forest); color: rgba(255,255,255,.74); font-size: 11px; letter-spacing: .08em; }
.topbar-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; }
.topbar-inner div, .topbar a { display: flex; align-items: center; gap: 8px; }
.topbar .location { padding-right: 18px; margin-right: 12px; border-right: 1px solid rgba(255,255,255,.18); }
.header { height: 92px; background: rgba(251,248,242,.95); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 50; backdrop-filter: blur(14px); }
.nav-wrap { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; align-items: center; gap: 12px; border: 0; background: none; padding: 0; text-align: left; cursor: pointer; flex-shrink: 0; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; color: var(--red); border: 1px solid rgba(158,47,44,.35); border-radius: 50% 50% 48% 52%; transform: rotate(-3deg); }
.brand-mark svg { transform: rotate(3deg); }
.brand-type { display: flex; flex-direction: column; }
.brand-type strong { font-family: var(--serif); font-size: 17px; font-weight: 600; letter-spacing: .08em; white-space: nowrap; }
.brand-type small { margin-top: 4px; font-size: 7px; letter-spacing: .15em; color: var(--muted); white-space: nowrap; }
.nav { display: flex; align-items: center; gap: clamp(17px, 2.1vw, 32px); margin-left: auto; }
.nav button, .footer-links button { border: 0; background: transparent; padding: 8px 0; cursor: pointer; }
.nav button { font-size: 13px; position: relative; white-space: nowrap; }
.nav button:not(.nav-cta)::after { content: ""; position: absolute; left: 50%; right: 50%; bottom: 0; height: 1px; background: var(--red); transition: .25s; }
.nav button:hover::after { left: 0; right: 0; }
.nav-cta, .primary-btn, .submit-btn { display: inline-flex; align-items: center; justify-content: center; gap: 13px; border: 0; background: var(--red); color: white; padding: 16px 24px; font-size: 12px; letter-spacing: .1em; cursor: pointer; transition: .25s ease; }
.nav-cta { padding: 13px 18px; flex-shrink: 0; }
.nav-cta:hover, .primary-btn:hover, .submit-btn:hover { background: var(--red-dark); transform: translateY(-2px); box-shadow: 0 12px 24px rgba(112,33,31,.18); }
.menu-toggle, .mobile { display: none; }

.hero { min-height: calc(100vh - 126px); height: 730px; max-height: 850px; background: var(--ivory); position: relative; display: flex; align-items: center; }
.hero::before { content: ""; position: absolute; width: 500px; height: 500px; left: -240px; top: 60px; border: 1px solid rgba(158,47,44,.10); border-radius: 48% 52%; }
.hero-grain { position: absolute; inset: 0; opacity: .35; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E"); }
.hero-grid { display: grid; grid-template-columns: 1.04fr .96fr; align-items: center; gap: 70px; position: relative; }
.eyebrow, .mini-label { color: var(--red); font-size: 10px; font-weight: 500; letter-spacing: .25em; }
.eyebrow { display: flex; align-items: center; gap: 12px; }
.eyebrow span { width: 34px; height: 1px; background: var(--red); }
.hero h1 { margin: 25px 0 24px; font-family: var(--serif); font-size: clamp(58px, 6vw, 86px); line-height: 1.16; font-weight: 500; letter-spacing: .02em; }
.hero h1 em { color: var(--red); font-style: normal; position: relative; }
.hero h1 em::after { content: ""; position: absolute; left: 2px; right: 0; bottom: 2px; height: 6px; background: rgba(158,47,44,.13); transform: skewX(-18deg); }
.hero-lead { color: #645e57; font-family: var(--serif); font-size: 16px; line-height: 2; }
.hero-actions { display: flex; align-items: center; gap: 27px; margin-top: 34px; }
.primary-btn { padding: 17px 25px; }
.text-link { display: flex; align-items: center; gap: 10px; font-size: 12px; border-bottom: 1px solid rgba(44,41,38,.35); padding-bottom: 5px; }
.text-link span { width: 29px; height: 29px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; }
.trust-row { display: flex; align-items: center; gap: 14px; margin-top: 45px; }
.avatars { display: flex; padding-left: 9px; }
.avatars span { width: 31px; height: 31px; margin-left: -9px; display: grid; place-items: center; border: 2px solid var(--ivory); border-radius: 50%; background: #d6b0a1; color: white; font: 10px var(--serif); }
.avatars span:nth-child(2) { background: #a9b1a0; }.avatars span:nth-child(3) { background: #bc927e; }
.trust-row p { font-size: 11px; line-height: 1.35; margin: 0; }.trust-row p strong { font-size: 14px; }.trust-row small { color: var(--muted); }
.hero-visual { height: 550px; position: relative; }
.image-frame { height: 100%; overflow: hidden; border-radius: 50% 50% 8px 8px / 28% 28% 8px 8px; box-shadow: 0 30px 60px rgba(74,54,42,.12); position: relative; }
.image-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 60%, rgba(55,38,29,.16)); }
.image-frame img { height: 100%; object-fit: cover; object-position: 51% center; filter: saturate(.72) sepia(.08); }
.hero-badge { position: absolute; left: -46px; bottom: 55px; padding: 18px 25px; background: rgba(251,248,242,.96); box-shadow: 0 12px 36px rgba(55,43,35,.14); display: flex; align-items: center; gap: 15px; color: var(--red); }
.hero-badge span { display: flex; flex-direction: column; color: var(--ink); font-family: var(--serif); font-size: 13px; }.hero-badge small { color: var(--red); font: 8px var(--sans); letter-spacing: .18em; margin-bottom: 4px; }
.leaf-line { position: absolute; top: -20px; right: -42px; width: 105px; height: 150px; border-left: 1px solid var(--sage); border-radius: 50%; transform: rotate(20deg); opacity: .6; }
.leaf-line span { position: absolute; width: 28px; height: 13px; border: 1px solid var(--sage); border-radius: 100% 0 100% 0; left: -2px; top: 40px; transform: rotate(28deg); }.leaf-line span:nth-child(2) { top: 73px; left: 9px; transform: rotate(65deg); }.leaf-line span:nth-child(3) { top: 103px; left: 25px; transform: rotate(90deg); }
.hero-bottom { position: absolute; bottom: 25px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 20px; font-size: 8px; letter-spacing: .2em; color: var(--muted); }.hero-bottom i { width: 60px; height: 1px; background: var(--line); }
.reveal { animation: reveal .75s both ease-out; }.delay-1 { animation-delay: .12s; }.delay-2 { animation-delay: .24s; }.delay-3 { animation-delay: .36s; }.delay-4 { animation-delay: .48s; }
@keyframes reveal { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

.intro { background: var(--paper); }
.intro-grid { display: grid; grid-template-columns: 200px 1fr; gap: 80px; }
.section-kicker { display: flex; gap: 15px; align-items: flex-start; padding-top: 9px; }.section-kicker span { font: 12px var(--serif); color: var(--red); }.section-kicker p { margin: 0; padding-left: 14px; border-left: 1px solid var(--line); color: var(--muted); font-size: 9px; line-height: 1.8; letter-spacing: .14em; }
.intro-main h2, .section-heading h2, .nutrition-copy h2, .residence-copy h2, .center-heading h2, .faq-title h2, .contact-copy h2 { font-family: var(--serif); font-weight: 400; line-height: 1.5; margin: 0; }
.intro-main h2 { font-size: clamp(31px, 4vw, 48px); letter-spacing: .02em; }.intro-main h2 strong { color: var(--red); font-weight: 500; }
.intro-body { margin-top: 47px; padding-top: 30px; border-top: 1px solid var(--line); display: grid; grid-template-columns: 1fr 1fr; gap: 65px; color: var(--muted); font-family: var(--serif); font-size: 14px; line-height: 2; }.intro-body p { margin: 0; }
.stats { margin-top: 95px; padding: 45px 0 0 280px; border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(4,1fr); }
.stats div { padding-left: 26px; border-left: 1px solid var(--line); display: flex; flex-direction: column; }.stats strong { font-family: var(--serif); color: var(--red); font-size: 36px; font-weight: 400; }.stats sup { font-size: 14px; }.stats span { margin-top: 11px; color: var(--muted); font-size: 9px; line-height: 1.65; letter-spacing: .08em; }

.services { background: var(--forest); color: white; position: relative; }
.services::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 90% 15%, rgba(190,167,128,.12), transparent 34%); pointer-events: none; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; position: relative; }.section-heading h2 { font-size: clamp(32px,4vw,46px); margin-top: 14px; }.section-heading > p { color: #a9b3ad; font-family: var(--serif); font-size: 13px; line-height: 2; margin: 0 0 6px; }.light .mini-label { color: #c7aa82; }
.service-grid { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 60px; border-top: 1px solid rgba(255,255,255,.15); border-bottom: 1px solid rgba(255,255,255,.15); }
.service-card { padding: 35px 27px 30px; border-right: 1px solid rgba(255,255,255,.15); min-height: 440px; display: flex; flex-direction: column; transition: .35s; }.service-card:first-child { border-left: 1px solid rgba(255,255,255,.15); }.service-card:hover { background: rgba(255,255,255,.055); transform: translateY(-6px); }
.service-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 38px; }.service-icon { width: 49px; height: 49px; border: 1px solid rgba(199,170,130,.5); color: #d4ba94; border-radius: 50%; display: grid; place-items: center; }.service-num { color: rgba(255,255,255,.28); font: 11px var(--serif); }
.service-card > small { text-transform: uppercase; font-size: 8px; color: #c7aa82; letter-spacing: .2em; }.service-card h3 { font: 400 21px var(--serif); margin: 9px 0 16px; }.service-card > p { color: #acb5b0; font-family: var(--serif); font-size: 12px; line-height: 1.9; min-height: 70px; }.service-card ul { list-style: none; padding: 20px 0; margin: 8px 0; border-top: 1px solid rgba(255,255,255,.11); }.service-card li { display: flex; align-items: center; gap: 8px; color: #cbd0cd; font-size: 11px; margin: 9px 0; }.service-card li svg { color: #c7aa82; }
.service-card button, .article button, .all-link, .dark-link, .outline-btn { display: flex; align-items: center; gap: 10px; border: 0; background: none; padding: 8px 0; cursor: pointer; font-size: 10px; letter-spacing: .12em; width: fit-content; }.service-card button { color: #d4ba94; margin-top: auto; }

.nutrition { background: #eaded0; }
.nutrition-grid { display: grid; grid-template-columns: .95fr 1.05fr; gap: 100px; align-items: center; }
.nutrition-visual { position: relative; padding: 0 0 42px 42px; }.nutrition-visual::before { content: ""; position: absolute; left: 0; bottom: 0; width: 72%; height: 77%; border: 1px solid rgba(112,33,31,.22); }.nutrition-visual img { height: 485px; object-fit: cover; position: relative; filter: saturate(.72) sepia(.08); }
.nutrition-note { position: absolute; right: -25px; bottom: 0; width: 125px; height: 125px; border-radius: 50%; background: var(--red); color: white; display: flex; flex-direction: column; justify-content: center; align-items: center; box-shadow: 0 16px 30px rgba(112,33,31,.2); }.nutrition-note strong { font: 38px var(--serif); line-height: .95; }.nutrition-note span { font-size: 9px; letter-spacing: .08em; }
.mini-label.dark { color: var(--red-dark); }.nutrition-copy h2, .residence-copy h2 { font-size: clamp(35px,4vw,50px); margin: 18px 0 26px; }.nutrition-copy .lead, .residence-copy > p { color: #69615a; font-family: var(--serif); font-size: 14px; line-height: 2; max-width: 510px; }
.phases { margin: 34px 0; border-top: 1px solid rgba(44,41,38,.18); }.phases div { display: grid; grid-template-columns: 90px 80px 1fr; align-items: center; padding: 17px 0; border-bottom: 1px solid rgba(44,41,38,.18); }.phases b { font-size: 8px; letter-spacing: .12em; color: var(--red); }.phases span { font: 15px var(--serif); }.phases p { margin: 0; font-size: 11px; color: var(--muted); }
.outline-btn { border: 1px solid rgba(44,41,38,.45); padding: 14px 20px; }

.residence { background: var(--paper); }
.residence-grid { display: grid; grid-template-columns: .84fr 1.16fr; gap: 80px; align-items: center; }
.residence-copy { padding-left: 25px; }.amenities { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 35px 0; }.amenities span { display: flex; align-items: center; gap: 12px; font: 12px var(--serif); }.amenities svg { color: var(--sage); }
.dark-link { border-bottom: 1px solid var(--ink); padding-bottom: 7px; }
.residence-images { position: relative; padding: 0 0 80px 90px; }.room-main { height: 480px; object-fit: cover; filter: saturate(.68) sepia(.08); }.room-detail { position: absolute; bottom: 0; left: 0; width: 260px; min-height: 160px; background: var(--forest); color: white; padding: 32px; }.room-detail span { color: #c7aa82; font-size: 8px; letter-spacing: .2em; }.room-detail p { font: 14px/1.9 var(--serif); margin: 15px 0 0; }

.journey { background: #f0e9df; }
.center-heading { text-align: center; }.center-heading h2 { font-size: clamp(34px,4vw,48px); margin: 14px 0 10px; }.center-heading p { color: var(--muted); font: 13px var(--serif); }
.timeline { display: grid; grid-template-columns: repeat(5,1fr); margin-top: 65px; }.step { text-align: center; }.step-circle { position: relative; display: flex; align-items: center; justify-content: center; }.step-circle span { width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid rgba(158,47,44,.42); background: #f0e9df; border-radius: 50%; color: var(--red); font: 12px var(--serif); position: relative; z-index: 2; transition: .25s; }.step:hover .step-circle span { background: var(--red); color: white; }.step-circle i { height: 1px; background: rgba(158,47,44,.26); position: absolute; left: 50%; width: 100%; }.step h3 { font: 16px var(--serif); margin: 21px 0 8px; }.step p { color: var(--muted); font-size: 10px; margin: 0; }

.testimonial { background: var(--red); color: white; padding: 100px 0; position: relative; }.testimonial::before,.testimonial::after { content: ""; position: absolute; width: 300px; height: 300px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; }.testimonial::before { left: -150px; top: -170px; }.testimonial::after { right: -100px; bottom: -230px; }
.testimonial-inner { text-align: center; max-width: 850px; position: relative; }.quote-mark { color: #d7ae96; opacity: .75; }.testimonial-text { font: 400 clamp(22px,3vw,32px)/1.8 var(--serif); margin: 20px auto 32px; }.testimonial-text em { color: #f1d6c4; font-style: normal; }.author { display: flex; align-items: center; justify-content: center; gap: 12px; }.author-avatar { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: #e6c5af; color: var(--red-dark); font: 14px var(--serif); }.author div { text-align: left; display: flex; flex-direction: column; }.author strong { font: 12px var(--serif); }.author small { color: rgba(255,255,255,.55); font-size: 9px; margin-top: 4px; }.testimonial-nav { position: absolute; bottom: 0; right: 0; display: flex; align-items: center; gap: 14px; }.testimonial-nav button { width: 32px; height: 32px; border: 1px solid rgba(255,255,255,.25); color: white; background: transparent; border-radius: 50%; cursor: pointer; }.testimonial-nav span { font-size: 8px; letter-spacing: .12em; }

.journal { background: var(--paper); }.journal-heading { padding-bottom: 32px; border-bottom: 1px solid var(--line); }.all-link { border-bottom: 1px solid var(--line); }.article-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 31px; margin-top: 42px; }.article-art { height: 235px; padding: 22px; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; color: rgba(112,33,31,.65); transition: .35s; }.article:hover .article-art { transform: translateY(-5px); }.article-art::before,.article-art::after { content: ""; position: absolute; border: 1px solid currentColor; opacity: .18; border-radius: 50%; }.article-art::before { width: 190px; height: 190px; }.article-art::after { width: 270px; height: 270px; }.art-1 { background: #dfc3b4; }.art-2 { background: #cdd1c5; color: var(--forest); }.art-3 { background: #dfd3b9; }.article-art > span { position: absolute; left: 20px; top: 18px; color: rgba(44,41,38,.6); font-size: 9px; letter-spacing: .13em; }.article-art svg { position: relative; z-index: 2; }.article-meta { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 9px; margin-top: 22px; letter-spacing: .08em; }.article-meta span { color: var(--red); }.article-meta i { width: 18px; height: 1px; background: var(--line); }.article h3 { font: 18px/1.65 var(--serif); margin: 13px 0 10px; }.article > p { color: var(--muted); font: 12px/1.8 var(--serif); }.article button { margin-top: 13px; border-bottom: 1px solid var(--line); }

.faq { background: var(--ivory); border-top: 1px solid var(--line); }.faq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 110px; }.faq-title h2 { font-size: clamp(32px,4vw,46px); margin: 15px 0 22px; }.faq-title p { color: var(--muted); font: 12px/1.9 var(--serif); max-width: 280px; }.faq-title a { display: flex; align-items: center; gap: 8px; margin-top: 30px; color: var(--red); font-size: 12px; }.faq-item { border-top: 1px solid var(--line); }.faq-item:last-child { border-bottom: 1px solid var(--line); }.faq-item button { width: 100%; display: grid; grid-template-columns: 45px 1fr 30px; align-items: center; gap: 10px; border: 0; background: transparent; padding: 22px 0; text-align: left; cursor: pointer; }.faq-item button > span { color: var(--red); font-size: 10px; }.faq-item button strong { font: 14px var(--serif); }.faq-item button i { width: 27px; height: 27px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; font-style: normal; }.faq-answer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s ease; }.faq-answer p { overflow: hidden; margin: 0 30px 0 55px; color: var(--muted); font: 12px/1.9 var(--serif); }.faq-item.active .faq-answer { grid-template-rows: 1fr; }.faq-item.active .faq-answer p { padding-bottom: 25px; }

.contact { background: var(--forest); color: white; padding: 105px 0; }.contact-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: 110px; align-items: center; }.mini-label.light-text { color: #c7aa82; }.contact-copy h2 { font-size: clamp(39px,5vw,58px); margin: 17px 0 23px; }.contact-copy > p { color: #acb5b0; font: 12px/1.9 var(--serif); max-width: 390px; }.contact-promise { display: flex; gap: 13px; align-items: center; margin-top: 34px; color: #c7aa82; }.contact-promise > span { display: flex; flex-direction: column; }.contact-promise strong { font: 12px var(--serif); color: white; }.contact-promise small { font-size: 9px; color: #8f9b95; margin-top: 4px; }.contact-form { background: #f8f4ed; color: var(--ink); padding: 43px; min-height: 410px; }.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }.contact-form label { display: flex; flex-direction: column; font: 11px var(--serif); margin-bottom: 23px; }.contact-form input,.contact-form select,.contact-form textarea { margin-top: 9px; border: 0; border-bottom: 1px solid rgba(44,41,38,.25); background: transparent; border-radius: 0; padding: 10px 2px; outline: none; font: 12px var(--sans); color: var(--ink); resize: vertical; }.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { border-color: var(--red); }.contact-form input::placeholder,.contact-form textarea::placeholder { color: #aaa49c; }.submit-btn { margin-top: 4px; width: 100%; padding: 17px; }.success { min-height: 320px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }.success > span { width: 70px; height: 70px; display: grid; place-items: center; border: 1px solid rgba(158,47,44,.25); border-radius: 50%; color: var(--red); }.success h3 { font: 25px var(--serif); margin: 20px 0 8px; }.success p { color: var(--muted); font-size: 12px; }.success button { border: 0; background: transparent; color: var(--red); border-bottom: 1px solid var(--red); padding: 5px; margin-top: 15px; cursor: pointer; font-size: 11px; }

footer { background: #192a23; color: white; }.footer-main { padding: 75px 0 55px; display: grid; grid-template-columns: 1.6fr .75fr 1fr .75fr; gap: 70px; }.brand.inverse .brand-mark { color: #d2b28c; border-color: rgba(210,178,140,.4); }.brand.inverse .brand-type small { color: #86938d; }.footer-brand p { margin: 25px 0 0 54px; color: #84918b; font: 11px/1.9 var(--serif); }.footer-links { display: flex; flex-direction: column; align-items: flex-start; gap: 11px; }.footer-links strong { color: #d2b28c; font: 12px var(--serif); margin-bottom: 11px; }.footer-links a,.footer-links button,.footer-links span { color: #8e9a94; font-size: 10px; padding: 0; transition: .2s; }.footer-links a:hover,.footer-links button:hover { color: white; }.wechat { display: flex; gap: 14px; align-items: flex-start; }.qr { width: 72px; height: 72px; background: #e9e2d8; position: relative; color: var(--forest); display: grid; place-items: center; overflow: hidden; }.qr span { position: absolute; width: 19px; height: 19px; border: 4px solid var(--forest); }.qr span:nth-child(1) { left: 6px; top: 6px; }.qr span:nth-child(2) { right: 6px; top: 6px; }.qr span:nth-child(3) { left: 6px; bottom: 6px; }.qr i { font-size: 6px; font-style: normal; transform: rotate(-45deg); }.wechat p { margin: 8px 0 0; font: 11px/1.7 var(--serif); }.wechat small { color: #78857f; font: 8px var(--sans); }.footer-bottom { border-top: 1px solid rgba(255,255,255,.08); min-height: 58px; display: flex; justify-content: space-between; align-items: center; color: #65736c; font-size: 8px; letter-spacing: .06em; }.footer-bottom div { display: flex; gap: 25px; }

/* Secondary pages */
.nav button.active:not(.nav-cta)::after { left: 0; right: 0; }
.subpage { background: var(--paper); }
.sub-hero { height: 370px; position: relative; overflow: hidden; background: #eee5d9; display: flex; align-items: center; }
.sub-hero::after { content: ""; position: absolute; inset: 0; opacity: .25; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E"); }
.subpage-rooms .sub-hero { background: #e4e2da; }.subpage-meals .sub-hero { background: #eadacc; }.subpage-stories .sub-hero { background: #e5d3cc; }.subpage-insights .sub-hero { background: #e2e5dc; }
.sub-orbit { position: absolute; width: 480px; height: 480px; border: 1px solid rgba(158,47,44,.13); border-radius: 50%; right: -80px; top: -260px; }.sub-orbit::before,.sub-orbit::after { content: ""; position: absolute; border: 1px solid rgba(158,47,44,.1); border-radius: 50%; inset: 55px; }.sub-orbit::after { inset: 115px; }
.sub-hero-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: end; position: relative; z-index: 2; }.sub-index { display: block; margin-bottom: 27px; color: rgba(44,41,38,.4); font-size: 9px; letter-spacing: .18em; }.sub-hero h1 { font: 500 clamp(48px,6vw,72px)/1.2 var(--serif); margin: 12px 0 0; }.sub-hero-grid > p { align-self: end; justify-self: end; margin: 0 0 8px; font: 17px/2 var(--serif); color: #615a54; min-width: 340px; }.breadcrumb { position: absolute; left: 50%; transform: translateX(-50%); bottom: 25px; display: flex; gap: 10px; z-index: 2; color: #8c847d; font-size: 9px; }.breadcrumb button { border: 0; padding: 0; background: transparent; color: inherit; cursor: pointer; }.breadcrumb strong { font-weight: 400; color: var(--red); }
.sub-section { padding: 110px 0; }.sub-intro { max-width: 760px; margin-bottom: 62px; }.sub-intro h2,.story-copy h2,.meal-origin h2,.included h2,.story-moment h2,.sub-cta h2 { font: 400 clamp(32px,4vw,48px)/1.5 var(--serif); margin: 14px 0 18px; }.sub-intro p,.story-copy p,.meal-origin-grid > div > p { color: var(--muted); font: 13px/2 var(--serif); max-width: 650px; }
.brand-story-grid { display: grid; grid-template-columns: .92fr 1.08fr; gap: 105px; align-items: center; }.story-portrait { position: relative; padding: 0 35px 35px 0; }.story-portrait::after { content: ""; position: absolute; right: 0; bottom: 0; width: 78%; height: 78%; border: 1px solid rgba(158,47,44,.2); }.story-portrait img { position: relative; z-index: 1; height: 520px; object-fit: cover; filter: saturate(.67) sepia(.08); }.story-portrait span { position: absolute; z-index: 2; right: -28px; top: 50%; transform: rotate(90deg); font-size: 8px; letter-spacing: .2em; color: var(--red); }.story-copy h2 { margin-bottom: 28px; }.story-copy p { margin: 0 0 18px; }.signature { margin-top: 35px; color: var(--red); font: italic 18px var(--serif); }.signature small { display: block; color: var(--muted); font: 9px var(--sans); margin-top: 6px; letter-spacing: .13em; }
.brand-values { background: var(--ivory); }.value-grid { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 58px; border: 1px solid var(--line); }.value-grid article { min-height: 320px; padding: 35px; border-right: 1px solid var(--line); position: relative; }.value-grid article:last-child { border: 0; }.value-grid article > span { position: absolute; right: 25px; top: 22px; color: rgba(44,41,38,.25); font-size: 10px; }.value-grid svg { color: var(--red); margin: 30px 0; }.value-grid h3 { font: 20px var(--serif); margin: 0 0 18px; }.value-grid p { color: var(--muted); font: 12px/1.9 var(--serif); }
.team-strip { padding: 28px 0; background: var(--red); color: rgba(255,255,255,.75); }.team-strip .container { display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: 9px; letter-spacing: .14em; }.team-strip i { width: 4px; height: 4px; border: 1px solid white; transform: rotate(45deg); }
.room-list { display: flex; flex-direction: column; gap: 75px; }.room-card { display: grid; grid-template-columns: 1.25fr .75fr; min-height: 415px; background: #f2ece3; }.room-card:nth-child(even) .room-photo { order: 2; }.room-card:nth-child(even) .room-info { order: 1; }.room-photo { position: relative; overflow: hidden; }.room-photo img { height: 100%; object-fit: cover; filter: saturate(.67) sepia(.07); transition: transform .7s; }.room-card:hover .room-photo img { transform: scale(1.025); }.room-photo > span { position: absolute; top: 0; left: 0; width: 54px; height: 54px; display: grid; place-items: center; background: var(--red); color: white; font: 11px var(--serif); }.room-card:nth-child(even) .room-photo > span { left: auto; right: 0; }.room-info { padding: 50px 48px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }.room-info small { color: var(--red); font-size: 8px; letter-spacing: .16em; }.room-info h3 { font: 28px var(--serif); margin: 12px 0 18px; }.room-info > p { color: var(--muted); font: 12px/1.9 var(--serif); }.room-info ul { width: 100%; list-style: none; padding: 17px 0; margin: 10px 0; border-top: 1px solid var(--line); }.room-info li { display: flex; gap: 8px; align-items: center; margin: 8px 0; font-size: 10px; }.room-info li svg { color: var(--sage); }.room-info button,.story-moment button,.sub-cta button { display: flex; align-items: center; gap: 11px; border: 0; padding: 0 0 6px; background: transparent; border-bottom: 1px solid currentColor; cursor: pointer; font-size: 10px; letter-spacing: .12em; }
.included { padding: 95px 0; background: var(--forest); color: white; }.included-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 110px; }.included h2 { margin-bottom: 0; }.included-list { display: grid; grid-template-columns: 1fr 1fr; }.included-list span { display: flex; align-items: center; gap: 15px; border-bottom: 1px solid rgba(255,255,255,.12); padding: 17px 5px; color: #c0c8c3; font: 11px var(--serif); }.included-list b { color: #c7aa82; font: 8px var(--sans); }
.meal-origin-grid { display: grid; grid-template-columns: .87fr 1.13fr; align-items: center; gap: 100px; }.meal-principles { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; margin-top: 35px; }.meal-principles span { display: flex; gap: 9px; align-items: center; font: 11px var(--serif); }.meal-principles svg { color: var(--red); }.meal-feature { position: relative; padding: 0 0 38px 38px; }.meal-feature::before { content: ""; position: absolute; left: 0; bottom: 0; width: 70%; height: 75%; border: 1px solid rgba(158,47,44,.2); }.meal-feature img { position: relative; height: 480px; object-fit: cover; filter: saturate(.75) sepia(.05); }.meal-feature > div { position: absolute; right: -25px; bottom: 0; width: 126px; height: 126px; border-radius: 50%; background: var(--red); color: white; display: flex; align-items: center; justify-content: center; gap: 9px; }.meal-feature strong { font: 43px var(--serif); }.meal-feature span { font-size: 8px; line-height: 1.6; letter-spacing: .12em; }
.meal-phases { background: #eaded0; }.phase-grid { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 60px; border-top: 1px solid rgba(44,41,38,.17); border-bottom: 1px solid rgba(44,41,38,.17); }.phase-grid article { min-height: 380px; padding: 30px 25px; border-right: 1px solid rgba(44,41,38,.17); display: flex; flex-direction: column; }.phase-grid article:first-child { border-left: 1px solid rgba(44,41,38,.17); }.phase-grid article > div { display: flex; justify-content: space-between; color: var(--red); }.phase-grid article > div > span { font: 13px var(--serif); }.phase-grid small { font-size: 8px; letter-spacing: .15em; }.phase-grid article > b { margin-top: 55px; color: var(--red); font-size: 9px; letter-spacing: .12em; }.phase-grid h3 { font: 21px var(--serif); margin: 10px 0 18px; }.phase-grid p { color: var(--muted); font: 12px/1.9 var(--serif); }.phase-grid em { margin-top: auto; border-top: 1px solid rgba(44,41,38,.14); padding-top: 17px; color: #756b62; font: normal 9px/1.7 var(--serif); }.chef-note { padding: 85px 0; background: var(--red); color: white; text-align: center; }.chef-note svg { color: #e3c4ae; }.chef-note p { font: 22px/1.9 var(--serif); }.chef-note span { color: rgba(255,255,255,.55); font-size: 9px; letter-spacing: .13em; }
.story-score { display: flex; align-items: center; gap: 35px; padding-bottom: 40px; border-bottom: 1px solid var(--line); }.story-score > div:first-child { display: flex; align-items: baseline; }.story-score strong { color: var(--red); font: 52px var(--serif); }.story-score span { color: var(--muted); font-size: 10px; }.story-score p { font: 13px/1.7 var(--serif); }.story-score p small { color: var(--muted); font: 9px var(--sans); }.score-stars { margin-left: auto; color: #b38a5e; letter-spacing: .22em; }
.mother-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 25px; margin-top: 50px; }.mother-grid article { min-height: 440px; padding: 35px; background: #f0e7dc; position: relative; display: flex; flex-direction: column; }.mother-grid article:nth-child(2) { background: #e2e6dc; }.mother-grid article:nth-child(3) { background: #eadad3; }.story-number { position: absolute; right: 25px; top: 20px; color: rgba(44,41,38,.3); font-size: 9px; }.mother-grid article > svg { color: var(--red); opacity: .6; margin: 28px 0; }.mother-grid article > p { font: 15px/2 var(--serif); flex-grow: 1; }.mother-author { display: flex; gap: 12px; align-items: center; border-top: 1px solid var(--line); padding-top: 20px; }.mother-author > span { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--red); color: white; font: 13px var(--serif); }.mother-author > div { display: flex; flex-direction: column; }.mother-author strong { font: 12px var(--serif); }.mother-author small { color: var(--muted); font-size: 8px; margin-top: 4px; }.mother-grid article > em { position: absolute; right: 25px; bottom: 42px; color: var(--red); font: normal 9px var(--serif); }.story-moment { padding: 110px 0; background: #dfc9bc; text-align: center; }.story-moment > div > span { color: var(--red); font-size: 9px; letter-spacing: .17em; }.story-moment h2 { margin: 20px auto 30px; }.story-moment button { margin: auto; }
.insight-toolbar { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); padding-bottom: 18px; }.insight-toolbar > div { display: flex; gap: 28px; }.insight-toolbar button { border: 0; background: transparent; padding: 5px 0; color: var(--muted); cursor: pointer; font-size: 11px; }.insight-toolbar button.active { color: var(--red); border-bottom: 1px solid var(--red); }.insight-toolbar > span { color: var(--muted); font-size: 8px; letter-spacing: .12em; }.insight-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 50px 30px; margin-top: 42px; }.insight-card .article-art { height: 230px; }.insight-card .article-art > b { position: absolute; right: 18px; bottom: 14px; color: rgba(44,41,38,.25); font: 10px var(--sans); }.insight-card h3 { font: 18px/1.65 var(--serif); margin: 13px 0 10px; }.insight-card > p { color: var(--muted); font: 12px/1.8 var(--serif); }.insight-card button { display: flex; align-items: center; gap: 10px; border: 0; border-bottom: 1px solid var(--line); background: none; padding: 8px 0; cursor: pointer; font-size: 10px; }
.sub-cta { padding: 70px 0; background: var(--forest); color: white; }.sub-cta > div { display: flex; align-items: center; justify-content: space-between; gap: 35px; }.sub-cta h2 { font-size: 27px; margin: 10px 0 0; }.sub-cta button { padding: 16px 23px; background: var(--red); border: 0; color: white; flex-shrink: 0; }

@media (max-width: 1000px) {
  .nav { gap: 15px; }.nav button { font-size: 12px; }.nav-cta.desktop { display: none; }
  .hero { height: 700px; }.hero-grid { gap: 45px; }.hero-visual { height: 495px; }
  .service-grid { grid-template-columns: 1fr 1fr; }.service-card:nth-child(2) { border-right: 1px solid rgba(255,255,255,.15); }.service-card { border-bottom: 1px solid rgba(255,255,255,.15); }
  .stats { padding-left: 0; }.nutrition-grid { gap: 60px; }.residence-grid { gap: 50px; }.faq-grid,.contact-grid { gap: 65px; }.footer-main { gap: 35px; }
  .brand-story-grid,.meal-origin-grid { gap: 55px; }.included-grid { gap: 55px; }.phase-grid { grid-template-columns: 1fr 1fr; }.phase-grid article:nth-child(2) { border-right: 1px solid rgba(44,41,38,.17); }.mother-grid article { padding: 28px; }
}

@media (max-width: 760px) {
  .container { width: min(100% - 36px, 580px); }.section { padding: 78px 0; }
  .topbar { height: 29px; }.topbar-inner > span,.topbar .location { display: none; }.topbar-inner { justify-content: flex-end; }
  .header { height: 76px; }.brand-mark { width: 37px; height: 37px; }.brand-type strong { font-size: 14px; }.brand-type small { font-size: 6px; }
  .menu-toggle { display: grid; place-items: center; border: 0; background: none; padding: 8px; cursor: pointer; z-index: 4; }
  .nav { display: flex; position: fixed; inset: 105px 0 auto; background: var(--paper); padding: 25px 24px 32px; flex-direction: column; align-items: stretch; gap: 3px; border-bottom: 1px solid var(--line); box-shadow: 0 20px 30px rgba(44,41,38,.12); transform: translateY(-130%); opacity: 0; transition: .3s; z-index: -1; }.nav.open { transform: none; opacity: 1; }.nav button { font: 15px var(--serif); text-align: left; padding: 12px 3px; }.nav .nav-cta.mobile { display: flex; margin-top: 12px; color: white; font: 11px var(--sans); padding: 15px; text-align: center; }
  .hero { height: auto; max-height: none; min-height: 0; padding: 75px 0 65px; }.hero-grid { grid-template-columns: 1fr; gap: 55px; }.hero h1 { font-size: 53px; margin-top: 20px; }.hero-lead { font-size: 14px; }.desktop-break { display: none; }.hero-actions { align-items: flex-start; flex-direction: column; gap: 20px; }.trust-row { margin-top: 35px; }.hero-visual { height: 470px; width: 92%; margin-left: auto; }.image-frame { border-radius: 48% 48% 5px 5px / 22% 22% 5px 5px; }.hero-badge { left: -30px; bottom: 28px; padding: 15px 18px; }.leaf-line { right: -17px; }.hero-bottom { display: none; }
  .intro-grid { grid-template-columns: 1fr; gap: 32px; }.intro-main h2 { font-size: 33px; }.intro-body { grid-template-columns: 1fr; gap: 18px; margin-top: 32px; }.stats { grid-template-columns: 1fr 1fr; gap: 34px 0; margin-top: 60px; padding-top: 35px; }.stats div { padding-left: 18px; }
  .section-heading { align-items: flex-start; flex-direction: column; }.section-heading > p { margin-top: 5px; }.service-grid { grid-template-columns: 1fr; margin-top: 40px; }.service-card { border-left: 1px solid rgba(255,255,255,.15); min-height: 400px; padding: 30px; }.service-card:hover { transform: none; }
  .nutrition-grid,.residence-grid,.faq-grid,.contact-grid { grid-template-columns: 1fr; gap: 55px; }.nutrition-visual { padding-left: 24px; }.nutrition-visual img { height: 390px; }.nutrition-note { width: 106px; height: 106px; right: -8px; }.phases div { grid-template-columns: 77px 66px 1fr; }.residence-copy { padding-left: 0; }.residence-images { padding: 0 0 65px 45px; }.room-main { height: 360px; }.room-detail { width: 210px; min-height: 135px; padding: 24px; }
  .timeline { grid-template-columns: 1fr; margin-top: 45px; }.step { display: grid; grid-template-columns: 68px 1fr; grid-template-rows: auto auto; text-align: left; margin-bottom: 15px; }.step-circle { grid-row: 1/3; }.step-circle i { width: 1px; height: calc(100% + 45px); top: 50%; left: 50%; }.step h3 { margin: 8px 0 4px; }.step p { margin: 0; }.testimonial { padding: 78px 0 100px; }.testimonial-text { font-size: 22px; }.testimonial-nav { bottom: -55px; left: 50%; right: auto; transform: translateX(-50%); }
  .article-grid { grid-template-columns: 1fr; gap: 50px; }.article-art { height: 250px; }.journal-heading { flex-direction: row; align-items: flex-end; }.journal-heading .all-link { flex-shrink: 0; }.faq-title p { max-width: 100%; }.contact { padding: 78px 0; }.contact-form { padding: 28px 22px; }.form-row { grid-template-columns: 1fr; gap: 0; }
  .footer-main { grid-template-columns: 1fr 1fr; }.footer-brand { grid-column: 1/-1; }.footer-brand p { margin-left: 0; }.footer-bottom { padding: 19px 0; flex-direction: column; align-items: flex-start; gap: 12px; }
  .sub-hero { height: 330px; }.sub-hero-grid { grid-template-columns: 1fr; gap: 25px; }.sub-hero-grid > p { justify-self: start; min-width: 0; font-size: 14px; }.sub-index { margin-bottom: 16px; }.sub-hero h1 { font-size: 48px; }.sub-section { padding: 75px 0; }
  .brand-story-grid,.meal-origin-grid { grid-template-columns: 1fr; gap: 55px; }.story-portrait { width: 92%; }.story-portrait img { height: 440px; }.value-grid { grid-template-columns: 1fr; }.value-grid article { border-right: 0; border-bottom: 1px solid var(--line); min-height: 260px; }.team-strip .container { flex-wrap: wrap; justify-content: center; }
  .room-list { gap: 38px; }.room-card { grid-template-columns: 1fr; }.room-card:nth-child(even) .room-photo { order: 1; }.room-card:nth-child(even) .room-info { order: 2; }.room-photo { height: 330px; }.room-info { padding: 35px 28px; }.included-grid { grid-template-columns: 1fr; gap: 35px; }.included-list { grid-template-columns: 1fr; }
  .meal-feature { width: 94%; }.meal-feature img { height: 390px; }.phase-grid { grid-template-columns: 1fr; }.phase-grid article { min-height: 320px; border-left: 1px solid rgba(44,41,38,.17); }.mother-grid,.insight-grid { grid-template-columns: 1fr; }.mother-grid article { min-height: 390px; }.story-score { align-items: flex-start; flex-wrap: wrap; }.score-stars { margin-left: 0; }.insight-toolbar { align-items: flex-start; gap: 20px; }.insight-toolbar > div { flex-wrap: wrap; gap: 15px 22px; }.insight-grid { gap: 45px; }.sub-cta > div { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 400px) {
  .container { width: calc(100% - 28px); }.brand-type strong { font-size: 13px; }.brand-type small { letter-spacing: .09em; }.hero h1 { font-size: 46px; }.hero-visual { height: 420px; }.hero-badge { left: -15px; }.amenities { grid-template-columns: 1fr; }.journal-heading { flex-direction: column; align-items: flex-start; }.footer-main { grid-template-columns: 1fr; }.footer-brand { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* Article detail page */
.subpage-article .sub-hero,
.article-hero { background: #efe5d6; }
.article-hero { min-height: 360px; height: auto; padding: 110px 0 70px; position: relative; overflow: hidden; display: flex; align-items: center; }
.article-hero .sub-orbit { top: -300px; right: -140px; }
.article-hero-inner { position: relative; z-index: 2; max-width: 880px; }
.article-hero-meta { display: flex; align-items: center; gap: 18px; color: var(--muted); font-size: 10px; letter-spacing: .12em; }
.article-hero-meta .article-hero-cat { color: var(--red); font-weight: 500; }
.article-hero-meta i { width: 18px; height: 1px; background: var(--line); }
.article-hero h1 { font: 500 clamp(36px,4.4vw,52px)/1.35 var(--serif); margin: 18px 0 22px; letter-spacing: .01em; }
.article-hero-lead { font: 16px/2 var(--serif); color: #615a54; max-width: 720px; }
.article-hero-author { display: flex; align-items: center; gap: 12px; margin-top: 28px; }
.article-hero-author .author-avatar { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--red); color: white; font: 15px var(--serif); }
.article-hero-author strong { font: 13px var(--serif); }
.article-hero-author small { color: var(--muted); font-size: 10px; margin-top: 4px; }

.subpage-article .breadcrumb strong { color: var(--ink); }

.article-body-grid { display: grid; grid-template-columns: 240px 1fr; gap: 90px; align-items: start; }
.article-body-aside { position: sticky; top: 130px; }
.aside-block { padding: 22px 0; border-top: 1px solid var(--line); }
.aside-block:first-child { padding-top: 0; border-top: 0; }
.aside-block .mini-label { display: block; margin-bottom: 14px; color: var(--red); }
.toc-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.toc-list li { font: 12px var(--serif); color: var(--muted); }
.aside-tags div { display: flex; flex-wrap: wrap; gap: 8px; }
.aside-tags span { font-size: 10px; padding: 5px 9px; border: 1px solid var(--line); color: var(--muted); }
.aside-share button { display: flex; align-items: center; gap: 8px; border: 0; border-bottom: 1px solid var(--ink); padding: 0 0 6px; background: transparent; cursor: pointer; font-size: 11px; }

.article-body-main { color: var(--ink); max-width: 760px; }
.article-content { font: 16px/2 var(--serif); color: #2c2926; }
.article-content > :first-child { margin-top: 0; }
.article-content > :last-child { margin-bottom: 0; }
.article-content h2 { font: 26px var(--serif); font-weight: 500; margin: 50px 0 18px; letter-spacing: .01em; }
.article-content h3 { font: 20px var(--serif); font-weight: 500; margin: 36px 0 14px; }
.article-content p { margin: 0 0 22px; }
.article-content ul, .article-content ol { padding-left: 1.4em; margin: 0 0 22px; }
.article-content li { margin: 6px 0; }
.article-content strong { color: var(--red); font-weight: 500; }
.article-content em { font-style: normal; color: var(--red-dark); }
.article-content blockquote { margin: 30px 0; padding: 26px 28px; border-left: 3px solid var(--red); background: #f4ecdf; font: 16px/2 var(--serif); color: #584c43; }
.article-content blockquote p { margin: 0; }
.article-content code { font: 13px/1.4 ui-monospace, monospace; padding: 2px 6px; background: #f0e9df; border-radius: 3px; }
.article-content a { color: var(--red); border-bottom: 1px solid rgba(158,47,44,.4); }
.article-content hr { border: 0; border-top: 1px solid var(--line); margin: 40px 0; }

.article-divider { margin: 50px 0 32px; border-top: 1px solid var(--line); }
.article-signoff { display: flex; align-items: center; gap: 14px; }
.article-signoff .author-avatar { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--red); color: white; font: 15px var(--serif); }
.article-signoff strong { font: 14px var(--serif); display: block; }
.article-signoff small { font-size: 10px; color: var(--muted); letter-spacing: .08em; }

.article-related { background: var(--ivory); border-top: 1px solid var(--line); }
.article-related .section-heading h2 { font-size: clamp(28px,3.5vw,40px); margin-top: 12px; }
.related-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; margin-top: 48px; }
.related-card { display: flex; flex-direction: column; }
.related-card .article-art { height: 200px; padding: 18px; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; color: rgba(112,33,31,.65); transition: .35s; }
.related-card:hover .article-art { transform: translateY(-5px); }
.related-card .article-art::before, .related-card .article-art::after { content: ""; position: absolute; border: 1px solid currentColor; opacity: .18; border-radius: 50%; }
.related-card .article-art::before { width: 160px; height: 160px; }
.related-card .article-art::after { width: 220px; height: 220px; }
.related-card .article-art > span { position: absolute; left: 16px; top: 14px; color: rgba(44,41,38,.6); font-size: 9px; letter-spacing: .13em; }
.related-card h3 { font: 17px/1.6 var(--serif); margin: 13px 0 8px; }
.related-card > p { color: var(--muted); font: 12px/1.8 var(--serif); }
.related-card button { margin-top: 14px; display: inline-flex; align-items: center; gap: 10px; border: 0; background: none; padding: 6px 0; cursor: pointer; font-size: 10px; letter-spacing: .12em; border-bottom: 1px solid var(--line); align-self: flex-start; }

@media (max-width: 1000px) {
  .meal-gallery-grid { grid-template-columns: repeat(3,1fr); }
  .article-body-grid { grid-template-columns: 1fr; gap: 50px; }
  .article-body-aside { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
  .article-body-aside .aside-block { padding: 16px 0; }
  .related-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .meal-gallery-grid { grid-template-columns: repeat(2,1fr); }
  .article-hero { padding: 80px 0 50px; }
  .article-hero h1 { font-size: 32px; }
  .article-content { font-size: 15px; }
  .article-content h2 { font-size: 22px; margin: 36px 0 14px; }
  .article-content h3 { font-size: 18px; }
  .article-body-aside { grid-template-columns: 1fr; gap: 16px; }
  .related-grid { grid-template-columns: 1fr; gap: 32px; }
}

/* Skeleton placeholders */
@keyframes skelShimmer { from { background-position: -200px 0; } to { background-position: 200px 0; } }
.skeleton-bar { display: block; background: linear-gradient(90deg, rgba(255,255,255,0) 0, rgba(158,47,44,.08) 40%, rgba(158,47,44,.18) 50%, rgba(158,47,44,.08) 60%, rgba(255,255,255,0) 100%); background-size: 200px 100%; background-color: rgba(44,41,38,.08); background-repeat: no-repeat; animation: skelShimmer 1.4s linear infinite; border-radius: 4px; height: 14px; margin: 8px 0; }
.skeleton-title { height: 18px; width: 60%; }
.skeleton-line { width: 100%; }
.skeleton-line.short { width: 70%; }
.skeleton-link { height: 10px; width: 36%; margin-top: 16px; }
.skeleton-meta { height: 10px; width: 220px; }
.skeleton-headline { height: 56px; width: 86%; margin-top: 18px; }
.skeleton-lead { height: 16px; width: 90%; }
.article-hero-loading { padding: 120px 0 80px; }
.skeleton-card .article-art { background-color: rgba(44,41,38,.05); }

/* Article not found */
.article-missing { text-align: center; padding: 80px 0; max-width: 520px; margin: 0 auto; }
.article-missing h2 { font: 32px var(--serif); margin: 12px 0 16px; }
.article-missing p { color: var(--muted); margin-bottom: 28px; }
.article-missing .primary-btn { margin: 0 auto; display: inline-flex; }


/* 详情页面包屑（news.html / stories_detail.html）：
   二者面包屑均为 <article> 的直接子元素，不是 <main> 的 */
.insight-article > .container.breadcrumb { position: static; transform: none; left: auto; bottom: auto; padding: 24px 0 0; margin-bottom: 0; justify-content: flex-start; background: transparent; }
.insight-article > .container.breadcrumb strong { color: var(--ink); }
.insight-article > .container.breadcrumb a { color: var(--muted); }

/* Meal gallery (meals.html 餐食样品区) */
.meal-gallery { background: var(--ivory); }
.meal-gallery-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 22px; margin-top: 55px; }
.meal-gallery-card { background: white; border: 1px solid var(--line); display: flex; flex-direction: column; transition: transform .35s; }
.meal-gallery-card:hover { transform: translateY(-4px); }
.meal-gallery-card .meal-img { position: relative; height: 220px; overflow: hidden; }
.meal-gallery-card .meal-img img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.78) sepia(.04); }
.meal-gallery-card .meal-img span { position: absolute; top: 0; left: 0; width: 44px; height: 44px; display: grid; place-items: center; background: var(--red); color: white; font: 11px var(--serif); }
.meal-gallery-card .meal-body { padding: 22px 20px 24px; display: flex; flex-direction: column; flex-grow: 1; }
.meal-gallery-card .meal-body small { color: var(--red); font: 8px var(--sans); letter-spacing: .16em; }
.meal-gallery-card .meal-body h3 { font: 18px var(--serif); margin: 9px 0 10px; }
.meal-gallery-card .meal-body p { color: var(--muted); font: 11px/1.8 var(--serif); margin-top: auto; }

/* ========== Insight card image (real image or placeholder) ========== */
.insight-card .article-art { position: relative; overflow: hidden; }
.insight-card .article-art img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; filter: saturate(.78) sepia(.04); }
.insight-card .article-art:hover img { transform: scale(1.04); }
.insight-card .article-art .art-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 22px; pointer-events: none; }
.insight-card .article-art .art-overlay span { color: rgba(255,255,255,.85); font-size: 9px; letter-spacing: .13em; text-shadow: 0 1px 3px rgba(0,0,0,.35); }
.insight-card .article-art .art-overlay b { align-self: flex-end; color: rgba(255,255,255,.65); font: 10px var(--sans); letter-spacing: .08em; text-shadow: 0 1px 3px rgba(0,0,0,.35); }
.insight-card .article-art .art-placeholder { width: 100%; height: 100%; padding: 22px; display: flex; align-items: center; justify-content: center; position: relative; color: rgba(112,33,31,.65); }
.insight-card .article-art .art-placeholder > span { position: absolute; left: 22px; top: 18px; color: rgba(44,41,38,.6); font-size: 9px; letter-spacing: .13em; }
.insight-card .article-art .art-placeholder > b { position: absolute; right: 22px; bottom: 18px; color: rgba(44,41,38,.3); font: 10px var(--sans); }
.insight-card .article-art .art-placeholder svg { position: relative; z-index: 2; }

/* ========== Pagination ========== */
.pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 60px; padding-top: 36px; border-top: 1px solid var(--line); }
.pagination .page-status { color: var(--muted); font-size: 10px; letter-spacing: .12em; padding: 8px 14px; align-self: center; }
.pagination .page-index, .pagination .page-pre, .pagination .page-next, .pagination .page-last { display: inline-block; }
.pagination a { display: inline-block; min-width: 38px; height: 38px; line-height: 36px; padding: 0 12px; border: 1px solid var(--line); background: white; color: var(--ink); text-align: center; font: 12px var(--sans); letter-spacing: .04em; transition: .25s; }
.pagination a:hover { border-color: var(--red); color: var(--red); }
.pagination .page-num { display: inline-block; }
.pagination .page-num a { min-width: 38px; }
.pagination .page-num-current, .pagination .page-num-current:hover { background: var(--red); border-color: var(--red); color: white; cursor: default; }
.pagination .page-num span.page-num { padding: 0 8px; color: var(--muted); }

/* ========== Article nav (prev / next with titles) ========== */
.article-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 50px; padding-top: 36px; border-top: 1px solid var(--line); }
.article-nav .nav-item { display: flex; flex-direction: column; gap: 8px; padding: 22px 26px; border: 1px solid var(--line); background: white; transition: .3s; min-height: 92px; }
.article-nav .nav-item:hover { border-color: var(--red); transform: translateY(-2px); }
.article-nav .nav-item .nav-label { color: var(--red); font-size: 9px; letter-spacing: .18em; }
.article-nav .nav-item .nav-title { color: var(--ink); font: 14px/1.6 var(--serif); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.article-nav .nav-next { text-align: right; align-items: flex-end; }
.article-nav .nav-next .nav-label::after { content: " →"; }
.article-nav .nav-prev .nav-label::before { content: "← "; }

/* ========== Related articles ========== */
.related-articles { background: var(--ivory); padding: 90px 0; border-top: 1px solid var(--line); }
.related-articles .center-heading { text-align: center; margin-bottom: 55px; }
.related-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 35px; }
.related-card { background: white; border: 1px solid var(--line); display: flex; flex-direction: column; transition: transform .35s, box-shadow .35s; }
.related-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(44,41,38,.08); }
.related-thumb { display: block; position: relative; height: 210px; overflow: hidden; background: #dfc3b4; }
.related-thumb img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.78) sepia(.04); transition: transform .6s; }
.related-thumb:hover img { transform: scale(1.05); }
.related-thumb .related-date { position: absolute; top: 14px; left: 14px; background: rgba(255,255,255,.92); color: var(--red); font-size: 9px; letter-spacing: .13em; padding: 6px 11px; }
.related-thumb .related-placeholder { width: 100%; height: 100%; display: grid; place-items: center; color: rgba(112,33,31,.4); }
.related-body { padding: 22px 24px 24px; flex-grow: 1; display: flex; flex-direction: column; }
.related-body h3 { font: 17px/1.55 var(--serif); margin: 0 0 10px; }
.related-body h3 a { color: var(--ink); }
.related-body h3 a:hover { color: var(--red); }
.related-body p { color: var(--muted); font: 12px/1.85 var(--serif); margin: 0 0 14px; flex-grow: 1; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.related-more { display: inline-flex; align-items: center; gap: 7px; color: var(--red); font-size: 10px; letter-spacing: .14em; align-self: flex-start; padding-bottom: 4px; border-bottom: 1px solid var(--red); }

@media (max-width: 1000px) {
  .related-grid { grid-template-columns: repeat(2,1fr); }
  .article-nav { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .related-grid { grid-template-columns: 1fr; }
  .related-thumb { height: 180px; }
  .insight-card .article-art, .insight-card .article-art .art-placeholder { height: 200px; }
  .pagination a { min-width: 34px; height: 34px; line-height: 32px; padding: 0 9px; font-size: 11px; }
}
/* Related card image/placeholder CSS swap (avoids nested {pboot:if}) */
.related-thumb[data-isico="1"] .related-placeholder { display: none; }
.related-thumb[data-isico="0"] .related-img,
.related-thumb[data-isico="0"] .related-img[src=""] { display: none; }
.related-thumb[data-isico="0"] .related-placeholder { display: grid; }
/* 相关阅读：严格限制为 3 篇（列表多取一条用于排除当前文章，多余候选在此裁掉） */
.related-grid article:nth-child(n+4) { display: none; }
/* ==========================================================================
   静态模板适配层
   原 CSS 按 React SPA 的 <button> 编写，静态化后模板使用 <a> / <details>，
   此处在文件末尾统一补齐选择器，避免改动既有规则带来的回归风险。
   ========================================================================== */

/* ---------- 主导航：鼠标响应（下划线滑入 + 文字变红） ---------- */
.nav a { font-size: 13px; position: relative; white-space: nowrap; display: inline-flex; align-items: center; transition: color .22s ease; }
.nav a:not(.nav-cta)::after { content: ""; position: absolute; left: 50%; right: 50%; bottom: 0; height: 1px; background: var(--red); transition: left .25s ease, right .25s ease; }
.nav a:not(.nav-cta):hover { color: var(--red); }
.nav a:not(.nav-cta):hover::after { left: 0; right: 0; }
.nav a.active:not(.nav-cta) { color: var(--red); }
.nav a.active:not(.nav-cta)::after { left: 0; right: 0; }

/* ---------- 顶部条 / 面包屑 / 筛选工具栏 ---------- */
.topbar a { transition: color .2s ease; }
.topbar a:hover { color: #fff; }
.breadcrumb a { color: inherit; transition: color .2s ease; }
.breadcrumb a:hover { color: var(--red); }
.insight-toolbar a { border: 0; background: transparent; padding: 5px 0; color: var(--muted); cursor: pointer; font-size: 11px; transition: color .2s ease; }
.insight-toolbar a:hover { color: var(--ink); }
.insight-toolbar a.active { color: var(--red); border-bottom: 1px solid var(--red); }

/* ---------- 服务卡片 / 文章卡片 ---------- */
.service-card a { color: #d4ba94; margin-top: auto; }
.service-card a:hover { color: #f0dcc0; }
.service-card a svg, .article a svg, .insight-card a svg, .all-link svg, .dark-link svg,
.outline-btn svg, .room-info a svg, .sub-cta a svg, .faq-title a svg { transition: transform .25s ease; }
.service-card a:hover svg, .article a:hover svg, .insight-card a:hover svg, .all-link:hover svg,
.dark-link:hover svg, .outline-btn:hover svg, .room-info a:hover svg { transform: translateX(4px); }
.article a { display: flex; align-items: center; gap: 10px; width: fit-content; font-size: 10px; letter-spacing: .12em; padding: 8px 0; border-bottom: 1px solid var(--line); transition: color .2s ease; }
.article a:hover { color: var(--red); }
.insight-card a { display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); padding: 8px 0; font-size: 10px; letter-spacing: .12em; width: fit-content; transition: color .2s ease; }
.insight-card a:hover { color: var(--red); }
.all-link:hover, .dark-link:hover, .outline-btn:hover { color: var(--red); }
.outline-btn { border-bottom: 1px solid currentColor; }

/* ---------- 口碑 / 房型 / 底部 CTA / 页脚 ---------- */
.testimonial-nav a { font-size: 8px; letter-spacing: .12em; color: rgba(255,255,255,.75); transition: color .2s ease; }
.testimonial-nav a:hover { color: #fff; }
.room-info a, .story-moment a { display: flex; align-items: center; gap: 11px; padding: 0 0 6px; border-bottom: 1px solid currentColor; font-size: 10px; letter-spacing: .12em; width: fit-content; transition: color .2s ease; }
.room-info a:hover, .story-moment a:hover { color: var(--red); }
.sub-cta a { display: flex; align-items: center; gap: 11px; padding: 16px 23px; background: var(--red); color: #fff; flex-shrink: 0; font-size: 10px; letter-spacing: .12em; transition: background .25s ease, transform .25s ease, box-shadow .25s ease; }
.sub-cta a:hover { background: var(--red-dark); transform: translateY(-2px); box-shadow: 0 12px 24px rgba(0,0,0,.22); }
.sub-cta a:hover svg { transform: translateX(4px); }

/* 微信二维码：有图时铺满容器 */
.qr img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 2; }

/* ---------- FAQ 手风琴（原生 <details>/<summary>） ---------- */
.faq-item summary { list-style: none; width: 100%; display: grid; grid-template-columns: 45px 1fr 30px; align-items: center; gap: 10px; padding: 22px 0; cursor: pointer; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::marker { content: ""; }
.faq-item summary > span { color: var(--red); font-size: 10px; }
.faq-item summary strong { font: 14px var(--serif); font-weight: 400; transition: color .25s ease; }
.faq-item summary i { width: 27px; height: 27px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 14px; line-height: 1; transition: transform .3s ease, background .3s ease, color .3s ease, border-color .3s ease; }
.faq-item summary:hover strong { color: var(--red); }
.faq-item summary:hover i { border-color: rgba(158,47,44,.45); }
.faq-item[open] summary i { transform: rotate(45deg); background: var(--red); color: #fff; border-color: var(--red); }
.faq-answer { height: 0; overflow: hidden; transition: height .32s ease; }
.faq-item[open] .faq-answer { height: auto; }
.faq-answer p { margin: 0 30px 0 55px; color: var(--muted); font: 12px/1.9 var(--serif); }
.faq-item[open] .faq-answer p { padding-bottom: 25px; }

@media (max-width: 1000px) {
  .nav a { font-size: 12px; }
}
@media (max-width: 760px) {
  .faq-answer p { margin: 0 0 0 55px; }
}
/* ---------- 微信联系弹窗 ---------- */
.wechat-modal { position: fixed; inset: 0; z-index: 200; display: none; }
.wechat-modal.is-open { display: block; }
.wechat-modal-mask { position: absolute; inset: 0; background: rgba(25,42,35,.6); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .3s ease; }
.wechat-modal.is-open .wechat-modal-mask { opacity: 1; }
.wechat-modal-card { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) scale(.94); width: min(398px, calc(100vw - 36px)); max-height: calc(100vh - 44px); overflow-y: auto; background: var(--paper); padding: 48px 40px 40px; text-align: center; box-shadow: 0 34px 80px rgba(25,42,35,.34); opacity: 0; transition: opacity .3s ease, transform .34s cubic-bezier(.2,.85,.3,1); }
.wechat-modal.is-open .wechat-modal-card { opacity: 1; transform: translate(-50%,-50%) scale(1); }
.wechat-modal-card::before { content: ""; position: absolute; inset: 9px; border: 1px solid rgba(158,47,44,.16); pointer-events: none; }
.wechat-modal-close { position: absolute; right: 14px; top: 14px; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: var(--muted); cursor: pointer; transition: .28s ease; z-index: 2; }
.wechat-modal-close:hover { background: var(--red); border-color: var(--red); color: #fff; transform: rotate(90deg); }
.wechat-modal-eyebrow { display: inline-block; color: var(--red); font-size: 9px; letter-spacing: .22em; }
.wechat-modal-card h3 { font: 400 25px/1.5 var(--serif); margin: 13px 0 11px; color: var(--ink); }
.wechat-modal-desc { color: var(--muted); font: 12px/1.85 var(--serif); margin: 0 0 26px; }
.wechat-modal-qr { position: relative; width: 174px; height: 174px; margin: 0 auto 24px; padding: 12px; background: #fff; border: 1px solid var(--line); }
.wechat-modal-qr img { width: 100%; height: 100%; object-fit: cover; }
.wechat-modal-qr::before, .wechat-modal-qr::after { content: ""; position: absolute; width: 20px; height: 20px; }
.wechat-modal-qr::before { left: -1px; top: -1px; border-left: 2px solid var(--red); border-top: 2px solid var(--red); }
.wechat-modal-qr::after { right: -1px; bottom: -1px; border-right: 2px solid var(--red); border-bottom: 2px solid var(--red); }
.wechat-modal-id { width: 100%; display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; border: 1px dashed rgba(158,47,44,.38); background: var(--ivory); padding: 14px 16px; cursor: pointer; font: inherit; color: inherit; transition: .25s ease; }
.wechat-modal-id:hover { border-color: var(--red); border-style: solid; background: #f2eadc; }
.wechat-modal-id-label { color: var(--muted); font-size: 10px; letter-spacing: .1em; }
.wechat-modal-id strong { font: 400 15px var(--serif); color: var(--red); letter-spacing: .05em; }
.wechat-modal-id-action { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 9px; letter-spacing: .08em; transition: color .25s ease; }
.wechat-modal-id:hover .wechat-modal-id-action { color: var(--red); }
.wechat-modal-toast { position: fixed; left: 50%; bottom: 44px; transform: translate(-50%, 14px); display: inline-flex; align-items: center; gap: 8px; background: var(--forest); color: #fff; font-size: 11px; letter-spacing: .07em; padding: 12px 20px; box-shadow: 0 14px 30px rgba(25,42,35,.3); opacity: 0; pointer-events: none; transition: opacity .28s ease, transform .28s ease; z-index: 201; }
.wechat-modal-toast svg { color: #9dc6a8; }
.wechat-modal-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 760px) {
  .nav-cta { padding: 11px 14px; font-size: 11px; letter-spacing: .06em; gap: 8px; }
  .wechat-modal-card { padding: 46px 24px 32px; }
  .wechat-modal-qr { width: 152px; height: 152px; }
  .wechat-modal-toast { bottom: 32px; }
}
/* ==========================================================================
   Insights 列表新版式：无缩略图 / 主标题加大 / 副标题缩小 / 15 卡网格
   ========================================================================== */
.insight-grid { grid-template-columns: repeat(3, 1fr); gap: 26px; margin-top: 42px; }
.insight-card { background: #fff; border: 1px solid var(--line); padding: 30px 28px 24px; position: relative; overflow: hidden; display: flex; flex-direction: column; transition: border-color .35s ease, transform .35s ease, box-shadow .35s ease; }
.insight-card::after { content: ""; position: absolute; left: 0; top: 0; width: 0; height: 2px; background: var(--red); transition: width .45s ease; }
.insight-card:hover { border-color: rgba(158, 47, 44, .42); transform: translateY(-4px); box-shadow: 0 18px 38px rgba(44, 41, 38, .09); }
.insight-card:hover::after { width: 100%; }
.insight-card-head { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.insight-no { font: 500 32px/1 var(--serif); color: rgba(158, 47, 44, .24); }
.insight-date { color: var(--muted); font-size: 9px; letter-spacing: .16em; }
.insight-card h3 { font: 500 22px/1.55 var(--serif); margin: 20px 0 12px; }
.insight-card h3 a { display: block; width: auto; border: 0; padding: 0; font: inherit; letter-spacing: 0; color: var(--ink); transition: color .25s ease; }
.insight-card h3 a:hover { color: var(--red); }
.insight-card > p { margin: 0; color: var(--muted); font: 11px/1.95 var(--serif); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.insight-card-foot { margin-top: auto; padding-top: 22px; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.insight-card-foot .article-meta { margin-top: 0; }
.insight-card .insight-more { display: inline-flex; align-items: center; gap: 8px; width: fit-content; flex-shrink: 0; border: 0; border-bottom: 1px solid var(--line); padding: 6px 0; font-size: 9px; letter-spacing: .14em; color: var(--ink); transition: color .25s ease, border-color .25s ease; }
.insight-card .insight-more:hover { color: var(--red); border-color: var(--red); }
.insight-card .insight-more svg { width: 14px; height: 14px; }

@media (max-width: 1000px) {
  .insight-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .insight-grid { grid-template-columns: 1fr; gap: 18px; }
  .insight-card { padding: 26px 22px 22px; }
  .insight-card h3 { font-size: 20px; }
}

/* ==========================================================================
   详情页 GEO 摘要段
   ========================================================================== */
.article-summary { margin-top: 28px; padding: 22px 26px; border-left: 3px solid var(--red); background: #f4ecdf; }
.article-summary-label { display: inline-block; margin-bottom: 10px; color: var(--red); font: 9px var(--sans); letter-spacing: .18em; }
.article-summary p { margin: 0; color: #584c43; font: 15px/2 var(--serif); }

/* ========== 详情页语义化（阶段4）========== */
.article-summary { background: var(--ivory, #faf8f3); border-left: 4px solid var(--forest, #2d5016); padding: 16px 20px; margin: 24px 0; font-size: 16px; line-height: 1.8; color: #333; }
.article-header h1 { font-family: "Noto Serif SC", serif; color: var(--forest); font-size: 28px; line-height: 1.4; }
.article-footer { padding: 0 0 70px; }
/* ========== FAQ 结构（阶段6）========== */
.faq-item { margin: 16px 0; padding-left: 14px; border-left: 3px solid var(--red, #a62c2b); }
.faq-item h3 { font-size: 16px; color: var(--forest); }
/* ========== 品牌实体 + 来源引用（阶段8）========== */
.article-brand { margin-top: 30px; padding: 18px 20px; background: #f4ecdf; border-left: 3px solid var(--red); font-size: 13px; line-height: 1.8; color: #555; }
.article-brand strong { color: var(--red); }
.article-source { margin-top: 20px; font-size: 12px; color: #666; }
.article-source ul { list-style: none; padding: 0; margin: 6px 0 0; }
.article-source a { color: var(--red); }

/* ==========================================================================
   7 项模板优化（2026-09-23）
   ========================================================================== */

/* ---- 需求3：详情页封面图（正文容器 40%、居中、圆角、上下留白、自适应屏幕） ---- */
.article-cover { margin: 24px 0; }
.article-cover img { display: block; width: 40%; max-width: 400px; min-width: 200px; margin: 0 auto; height: auto; border-radius: 8px; }
@media (max-width: 768px) { .article-cover img { width: 60%; } }
@media (max-width: 480px) { .article-cover img { width: 100%; max-width: 100%; min-width: 0; } }
/* 兜底：若被 SEO og 兜底图填充（说明该文并无真实封面），整块隐藏，避免输出假封面 */
.article-cover:has(img[src*="og-default"]) { display: none; }

/* ---- 需求4 / 5：首页「月中知悦」卡片改纯文字版式，标题醒目、摘要柔和 ---- */
.journal .article { display: flex; flex-direction: column; min-height: 272px; padding-top: 26px; border-top: 1px solid var(--line); }
.journal .article .article-meta { margin-top: 0; }
.journal .article h3 { font: 500 20px/1.45 var(--serif); margin: 14px 0 12px; }
.journal .article > p { margin: 0; color: var(--muted); font: 11px/1.75 var(--serif); flex-grow: 1; }
.journal .article > a { margin-top: 16px; }

/* ---- 需求7：stories「查看完整故事」按钮（品牌主色 --forest 实心） ---- */
.story-more { display: inline-flex; align-items: center; justify-content: center; gap: 10px;
              align-self: flex-start; margin-top: 20px; padding: 14px 22px;
              background: var(--forest); color: #fff; border-radius: 6px;
              font-size: 11px; letter-spacing: .12em; text-align: center;
              transition: background .25s ease, transform .25s ease, box-shadow .25s ease; }
.story-more:hover { background: #1a2b24; color: #fff; transform: translateY(-2px); box-shadow: 0 12px 24px rgba(38, 59, 50, .24); }