/* 2026 visual layer: preserve original information architecture; refine the reading experience. */
:root {
  --primary: #823a2d;
  --primary-light: #b4674e;
  --primary-dark: #4a251f;
  --primary-glow: rgba(130, 58, 45, .15);
  --accent: #7a6543;
  --accent-light: #b89b68;
  --accent-dark: #4b402d;
  --bg-cream: #efe9dc;
  --bg-warm: #e4dac8;
  --bg-dark: #1d1916;
  --bg-card: #f7f1e6;
  --text-primary: #262018;
  --text-secondary: #665b4e;
  --text-light: #918574;
  --text-white: #f5eee2;
  --border: rgba(55, 42, 29, .17);
  --shadow: 0 11px 28px rgba(45, 34, 23, .08);
  --shadow-lg: 0 22px 46px rgba(45, 34, 23, .14);
  --section-padding: 120px 0;
}

body { background: var(--bg-cream); letter-spacing: .025em; }
body::before {
  content: ""; position: fixed; inset: 0; z-index: 99; pointer-events: none; opacity: .18; mix-blend-mode: multiply;
  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='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E");
}
.container { max-width: 1240px; padding: 0 32px; }
/* 重要正文永远可绘制、可抓取；不依赖滚动动画。 */
.brand-intro,.products,.tea-section,.contact { content-visibility: visible !important; contain-intrinsic-size: auto !important; }
.animate-on-scroll { opacity: 1 !important; transform: none !important; }
.navbar { padding: 13px 0; background: rgba(25, 21, 17, .92); border-bottom: 1px solid rgba(232, 214, 180, .2); }
.navbar.scrolled { padding: 10px 0; background: rgba(25, 21, 17, .96); box-shadow: none; }
.logo { gap: 11px; }.logo-icon { width: 40px; height: 40px; border-radius: 0; border: 1px solid #d7ba7d; background: transparent; color: #d7ba7d; font-family: var(--font-brush); font-weight: 400; transform: rotate(-5deg); }
.logo-text { font-size: 18px; letter-spacing: .13em; }
.nav-menu { gap: 4px; }.nav-menu a { font-size: 13px; letter-spacing: .11em; padding: 9px 13px; }.nav-menu a::after { background: #cda66b; height: 1px; }.nav-menu a:hover,.nav-menu a.active { color: #ecd9b8; }

.hero { min-height: 780px; background: #1b1714 url("../1200x630.webp") center/cover no-repeat; justify-content: flex-start; }
.hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(15,13,11,.95) 0%,rgba(15,13,11,.78) 39%,rgba(15,13,11,.28) 73%,rgba(15,13,11,.48)); }
.hero-overlay { background: linear-gradient(180deg,rgba(0,0,0,.2),transparent 50%,rgba(0,0,0,.4)); }
.hero-content { width:min(1240px,100%); margin: 80px auto 0; padding: 0 32px; text-align:left; }
.hero-subtitle { color: #d9ba82; font-size: 12px; letter-spacing: .24em; margin-bottom: 17px; }.hero-subtitle::before { content:""; display:inline-block; width:29px; height:1px; background:currentColor; vertical-align:middle; margin-right:12px; }
.hero-title { font-family: var(--font-serif); font-size: clamp(48px,6.5vw,84px); font-weight: 500; letter-spacing: .14em; margin-bottom: 12px; }.hero-tagline { font-family: var(--font-serif); color:#d9ba82; font-size: clamp(17px,2vw,25px); letter-spacing: .25em; }.hero-divider { justify-content:flex-start; margin:25px 0; }.hero-divider::before,.hero-divider::after { width:55px; background:linear-gradient(90deg,#cda66b,transparent); }.hero-divider::after { display:none; }.divider-leaf { margin:0 14px; }
.hero-desc { margin:0 0 33px; max-width:530px; color:rgba(245,238,226,.82); }.hero-buttons { justify-content:flex-start; gap:10px; }.btn { border-radius:0; padding:13px 23px; font-size:13px; letter-spacing:.14em; }.btn-primary { border-color:var(--primary); background:var(--primary); }.btn-primary:hover { background:#9d4b3b; border-color:#9d4b3b; box-shadow:none; }.btn-outline { border-color:rgba(245,238,226,.52); }.hero-scroll { left:auto; right:46px; transform:none; writing-mode:vertical-rl; letter-spacing:.18em; }.scroll-arrow { display:none; }

.section-header { margin-bottom: 52px; }.section-tag { border-radius:0; padding:0; background:none; color:var(--primary); font-size:12px; letter-spacing:.2em; }.section-tag::before { content:""; display:inline-block; width:26px; height:1px; margin-right:10px; vertical-align:middle; background:currentColor; }.section-header h2,.brand-content h3,.association-text h2,.contact-info h3,.contact-form-wrapper h3 { font-family:var(--font-serif); font-weight:500; letter-spacing:.1em; }.section-header h2 { font-size:clamp(31px,4vw,48px); }.section-line { width:42px; height:1px; background:var(--primary); }

.brand-intro { background:linear-gradient(90deg,#f2ece0 0%,#f2ece0 66%,#e6dbc9 66%); }.brand-grid { gap:84px; }.image-frame { border-radius:0; box-shadow:none; border:1px solid var(--border); }.image-frame::before { top:13px; left:13px; right:-13px; bottom:-13px; border:1px solid #a88550; border-radius:0; }.placeholder-img { min-height:450px; background:radial-gradient(circle at 70% 26%,rgba(176,130,73,.23),transparent 31%),linear-gradient(135deg,#34271d,#161310); color:#e3c18a; }.placeholder-img span:first-child { font-family:var(--font-brush); font-size:76px; }.brand-content h3 { font-size:32px; line-height:1.4; }.brand-content p { font-size:15px; line-height:2.05; }.brand-stats { border-top:1px solid var(--border); padding-top:20px; }.stat-number { color:var(--primary); font-family:Georgia,serif; }.stat-label { letter-spacing:.1em; }

.association { position:relative; background:#211c18; overflow:hidden; }.association::before { content:"洛"; position:absolute; right:-2vw; bottom:-13vw; font-family:var(--font-brush); font-size:42vw; color:rgba(205,166,107,.045); line-height:1; }.association-content { gap:88px; position:relative; }.association-text h2 { font-size:42px; }.association-subtitle { color:#d7b479; font-size:14px; letter-spacing:.14em; }.association-desc p { font-size:15px; color:rgba(245,238,226,.74); }.association-artists { border-top-color:rgba(222,191,142,.25); }.artist-item,.highlight-card { border-radius:0; border-color:rgba(222,191,142,.18); background:rgba(255,255,255,.025); }.artist-item:hover,.highlight-card:hover { background:rgba(205,166,107,.1); transform:translateY(-4px); }.artist-name,.highlight-card h4,.association-artists h4 { color:#f2e4cf; }.artist-type { color:#bda67e; }.highlight-card { padding:29px 22px; text-align:left; }.highlight-card p { color:rgba(245,238,226,.64); }.highlight-icon img { filter:sepia(1) saturate(.8) brightness(1.45); }

.philosophy { background:#e2d7c5; padding:82px 0; }.philosophy-grid { gap:0; border:1px solid var(--border); }.philosophy-card { border:0; border-right:1px solid var(--border); border-radius:0; box-shadow:none; background:transparent; padding:38px 24px; }.philosophy-card:last-child { border-right:0; }.philosophy-card:hover { background:#eee7db; box-shadow:none; transform:none; }.card-icon { width:52px; height:52px; border-radius:0; background:transparent; border:1px solid var(--primary); }.card-icon svg { color:var(--primary); width:22px; }.philosophy-card h4 { font-family:var(--font-serif); color:var(--primary-dark); }

.products { background:#f2ece0; }.product-filters { gap:0; margin-bottom:42px; }.filter-btn { border-radius:0; border-color:var(--border); margin-left:-1px; }.filter-btn:hover,.filter-btn.active { background:var(--primary); border-color:var(--primary); }.product-grid { gap:24px; }.product-card { border-radius:0; border-color:var(--border); box-shadow:none; background:#fbf7ef; }.product-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); }.product-image img { height:300px; filter:saturate(.86) contrast(.98); }.product-info { padding:24px; }.product-info h4 { font-family:var(--font-serif); font-weight:500; }.product-tag { background:#ece2d1; color:var(--primary-dark); border-radius:0; }

.tea-section { background:linear-gradient(135deg,#1d1916,#312720); }.tea-card { border-radius:0; background:rgba(255,255,255,.035); }.tea-placeholder { background:linear-gradient(135deg,#3e4a31,#72815b); }.tea-content { padding:29px; }.tea-content h4 { font-family:var(--font-serif); font-weight:500; }.tea-tags span { border-radius:0; color:#c7d0af; border-color:#76845c; background:rgba(111,128,82,.22); }

.tea-culture { background:#ded2bd; }.tea-culture-content { border-left:1px solid var(--primary); padding-left:34px; }.tea-culture-text h2 { font-family:var(--font-serif); font-weight:500; letter-spacing:.12em; }.contact { background:#f0e9dd; }.contact-grid { gap:84px; }.contact-icon { border-radius:0; background:var(--primary); }.contact-form-wrapper { border-radius:0; box-shadow:none; border:1px solid var(--border); background:#fbf7ef; }.form-group input,.form-group select,.form-group textarea { border-radius:0; background:#f6f0e5; }.form-group input:focus,.form-group select:focus,.form-group textarea:focus { box-shadow:0 0 0 3px var(--primary-glow); }

.footer { background:#1d1916; }.footer-top { border-bottom-color:rgba(222,191,142,.18); }.footer h5 { color:#d7ba7d; font-family:var(--font-serif); font-weight:500; letter-spacing:.13em; }.footer a:hover { color:#dfc28d; }.back-to-top,.float-contact { border-radius:0; background:var(--primary); }

.page-header { min-height:58vh; background:#1d1916 url("../1200x630.webp") center/cover no-repeat; }.page-header::before { content:""; position:absolute; inset:0; background:rgba(17,14,12,.7); }.page-header-content { max-width:800px; padding:0 24px; }.page-header h1 { font-family:var(--font-serif); font-weight:500; letter-spacing:.14em; }.page-tag { border-radius:0; background:rgba(204,165,105,.13); color:#ddc08a; }

@media (max-width: 768px) {
  :root { --section-padding: 75px 0; }.container { padding:0 19px; }.navbar { padding:9px 0; }.logo-icon { width:35px; height:35px; }.logo-text { font-size:16px; }.hero { min-height:710px; background-position:60% center; }.hero::before { background:linear-gradient(90deg,rgba(15,13,11,.92),rgba(15,13,11,.55)); }.hero-content { margin-top:58px; padding:0 24px; }.hero-title { font-size:48px; letter-spacing:.1em; }.hero-desc { font-size:14px; max-width:300px; }.hero-buttons { display:grid; grid-template-columns:1fr 1fr; max-width:300px; }.hero-buttons .btn:last-child { grid-column:1 / -1; }.hero-scroll { display:none; }.brand-intro { background:#f2ece0; }.brand-grid,.association-content,.contact-grid { gap:45px; }.placeholder-img { min-height:280px; }.association-text h2 { font-size:31px; }.artists-list { grid-template-columns:repeat(2,1fr); }.association-highlights { gap:10px; }.highlight-card { padding:20px 14px; }.philosophy-grid { grid-template-columns:1fr 1fr; }.philosophy-card { border-bottom:1px solid var(--border); }.philosophy-card:nth-child(2) { border-right:0; }.product-grid,.tea-grid { gap:16px; }.product-image img { height:250px; }.product-filters { justify-content:flex-start; }.filter-btn { padding:9px 14px; font-size:12px; }.tea-culture-content { padding-left:20px; }.page-header { min-height:420px; }
}