
/* OngTeh RC4: preserve original visual identity and extend it with accessible, editorial layouts */
:root { --sage: #56684c; --day-cream: #f5e8cf; --night-brown: #2b2119; --quiet-gold: #e7bf76; }
.site-nav { gap: clamp(.6rem, 1.5vw, 1.4rem); }
.site-nav a { white-space: nowrap; }
.brand__text small { white-space: nowrap; }
.hero__status { max-width: 38rem; }
.cta-inline { display:inline-flex; align-items:center; gap:.55rem; color:var(--tea-brown); font-size:.79rem; text-transform:uppercase; letter-spacing:.08em; font-weight:600; text-decoration-color:var(--gold); text-underline-offset:.32rem; }
.section-intro { max-width: 53rem; color:var(--ink-soft); font-family:'EB Garamond',Georgia,serif; font-size:clamp(1.14rem,1.8vw,1.45rem); }
.moments-feature { background:#f3e6ce; padding:var(--section-space) 0; }
.moments-feature__top { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:end; gap:1.5rem; margin-bottom:2.6rem; }
.moments-feature__top .section-heading { max-width: 44rem; margin:0; }
.moment-feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.25rem; }
.moment-panel { position:relative; display:flex; flex-direction:column; min-height:26rem; padding:clamp(2rem,4vw,3.6rem); border-radius:1.2rem; border:1px solid #dcc7a2; background:#fffaf1; overflow:hidden; }
.moment-panel--night { color:#fcf0de; background:#2d2219; border-color:#2d2219; }
.moment-panel__eyebrow { font-size:.73rem; letter-spacing:.15em; text-transform:uppercase; color:#70502f; }
.moment-panel--night .moment-panel__eyebrow { color:#dfc79e; }
.moment-panel h2, .moment-panel h3 { font-family:'EB Garamond',Georgia,serif; font-weight:400; font-size:clamp(3rem,5vw,5.25rem); line-height:1.02; letter-spacing:-.04em; margin:2.1rem 0 1rem; }
.moment-panel h3 small { display:block; margin:.6rem 0 0; font-family:'Federo',Arial,sans-serif; font-size:.82rem; line-height:1.5; text-transform:uppercase; letter-spacing:.11em; }
.moment-panel p { max-width:29rem; margin:0 0 1.5rem; font-family:'EB Garamond',Georgia,serif; font-size:clamp(1.2rem,2vw,1.48rem); line-height:1.4; }
.moment-panel__bottom { margin-top:auto; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.85rem; }
.moment-tags { display:flex; flex-wrap:wrap; gap:.5rem; }
.moment-tag { font-size:.66rem; text-transform:uppercase; letter-spacing:.06em; border:1px solid currentColor; border-radius:50rem; padding:.38rem .65rem; }
.moment-panel a { color:inherit; font-size:.78rem; letter-spacing:.04em; text-underline-offset:.25rem; }
.moment-feature-note { font-size:.8rem; color:#5a4c41; margin:1.4rem 0 0; }
.page-slice { padding:clamp(3.5rem,7vw,6.8rem) 0; }
.page-slice--cream { background:#f3e6ce; }
.page-slice--dark { background:var(--tea-brown); color:#fff6e9; }
.page-slice--dark .eyebrow { color:#dfba79; }
.page-slice--dark p { color:#f2e3d0; }
.intro-actions { display:flex;flex-wrap:wrap; gap:1.3rem; align-items:center; margin-top:2rem; }
.editorial-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,6vw,7rem); align-items:start; }
.editorial-grid > div > p:not(.eyebrow) { font-family:'EB Garamond',Georgia,serif; font-size:clamp(1.16rem,1.8vw,1.43rem); }
.editorial-grid .section-heading { margin-top:0; }
.info-stack { padding:1.4rem 0; border-top:1px solid var(--line); }
.info-stack:last-child { border-bottom:1px solid var(--line); }
.info-stack h3 { margin:0 0 .35rem; font-family:'EB Garamond',Georgia,serif; font-size:1.85rem; font-weight:400; }
.info-stack p { margin:.25rem 0; color:var(--ink-soft); }
.info-stack small { text-transform:uppercase; font-size:.68rem;letter-spacing:.1em; color:#6d5333; }
.breadcrumb-wrap { margin:0 0 1.7rem; font-size:.76rem; }
.content-header { max-width:56rem; }
.content-header .page-title { margin-top:0; }
.page-lead--wide { max-width:52rem; }
.journal-note { border-inline-start:3px solid var(--gold); padding:1rem 1.5rem; background:#f8eddb; margin-top:2.5rem; }
.journal-note p { margin:.15rem 0; }
.tea-finder { margin-top:3rem; }
.tea-controls { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto; gap:.9rem; align-items:end; padding:1.6rem; background:#f1e2c7; border:1px solid #dfc7a4; border-radius:1rem; }
.tea-control label {display:block; margin-bottom:.55rem; font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:#60421c;}
.tea-control select {display:block; width:100%; min-height:3.25rem; padding:.65rem 2rem .65rem .8rem; border-radius:.4rem;border:1px solid #c6a77b; background:#fffaf2;color:var(--ink);}
.tea-reset { min-height:3.25rem; padding:0 1.4rem; border:1px solid #8e744e; background:transparent; color:var(--tea-brown); border-radius:.4rem; cursor:pointer; }
.tea-reset:hover { background:#ead5b4; }
.tea-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:1.3rem; }
.tea-card { display:flex; flex-direction:column; border:1px solid #dccbb2; background:#fffaf2; border-radius:1rem; padding:clamp(1.4rem,2.5vw,2.2rem); min-height:19.5rem; }
.tea-card[hidden] {display:none !important;}
.tea-card__index { color:#98723b; font-family:'EB Garamond',Georgia,serif; font-size:1.6rem; }
.tea-card__label { margin:.7rem 0 .3rem; font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:#705326; }
.tea-card h3 {font-family:'EB Garamond',Georgia,serif;font-weight:400;font-size:clamp(1.8rem,2.5vw,2.4rem);line-height:1.1;margin:.3rem 0 .8rem;}
.tea-card p {color:#5b4c40;font-size:.94rem;line-height:1.65;}
.tea-card__meta { margin-top:auto; padding-top:1rem; border-top:1px solid var(--line); display:flex;flex-wrap:wrap;gap:.4rem; }
.tea-card__meta span {border:1px solid #dcc5a1; border-radius:50px;font-size:.65rem;padding:.28rem .6rem;}
.tea-count {font-size:.9rem; margin:1.3rem 0 0; color:var(--ink-soft);}
.tea-empty {margin:1rem 0;padding:2rem;border:1px solid var(--line);border-radius:1rem;text-align:center;}
.guide-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.3rem;margin-top:2rem;}
.guide-card {padding:2rem;border:1px solid #ddcbb0;border-radius:1rem;background:#fffaf1;}
.guide-card h3 {font-family:'EB Garamond',Georgia,serif;font-size:2rem;font-weight:400;margin:0 0 .65rem;}
.guide-card p {font-size:.93rem;color:#5b4b41;}
.guide-card a {font-size:.84rem;}
.guide-table {width:100%;border-collapse:collapse;margin:2rem 0 1rem;}
.guide-table th,.guide-table td {padding:1rem .8rem;text-align:left;border-bottom:1px solid #ceb99a;vertical-align:top;}
.guide-table th {font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;}
.guide-table td {font-size:.94rem;}
.faq-list {max-width:53rem; margin:2rem 0;}
.faq-list details {border-bottom:1px solid var(--line); padding:.95rem 0;}
.faq-list summary {font-family:'EB Garamond',Georgia,serif;font-size:1.5rem;cursor:pointer;}
.faq-list details p {color:var(--ink-soft);max-width:48rem;}
.teaser-links {display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem;}
.consent-banner {position:fixed;z-index:140;bottom:1.1rem;left:50%;width:min(57rem,calc(100% - 1.5rem));transform:translateX(-50%);padding:1.35rem 1.5rem;border:1px solid #bd9758;border-radius:.8rem;background:#fffaf0;color:var(--ink);box-shadow:0 1.6rem 4rem #20150942;display:grid;grid-template-columns:1fr auto;gap:1.25rem;align-items:center;}
.consent-banner[hidden] {display:none !important;}
.consent-banner h2 {font-family:'EB Garamond',Georgia,serif;font-weight:400;font-size:1.5rem;margin:0;}
.consent-banner p {font-size:.79rem;margin:.25rem 0 0;color:var(--ink-soft);line-height:1.55;}
.consent-actions {display:flex;flex-wrap:wrap;gap:.5rem;}
.consent-actions button, .privacy-settings-button {cursor:pointer;padding:.6rem 1rem;border:1px solid #644221;background:transparent;border-radius:.35rem;font-size:.77rem;}
.consent-actions button[data-analytics-choice="yes"] {background:var(--tea-brown);color:#fff7e8;}
.privacy-settings-button {margin-top:.8rem;background:#fff8ec;}
.privacy-settings-button:hover,.consent-actions button:hover {box-shadow:0 0 0 2px #cea960;}
.origin-links {display:flex;justify-content:end;gap:1rem;margin:1rem 0 0;}
.day-card__time {color:#dfb560;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;}
.page-main > .page-hero {padding-top:clamp(3.2rem,5.2vw,5rem);padding-bottom:0;}
.page-main > .page-hero .page-title {font-size:clamp(3.4rem,7vw,6rem);}
.page-main > .page-slice:first-of-type {padding-top:clamp(2.3rem,4vw,3.6rem);}

/* Do not alter original header grids at desktop widths; the new links are more compact. */
@media (min-width: 61.25rem) { .site-nav a { font-size:.73rem; } }
@media (max-width: 68rem) { .tea-grid {grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width: 61.249rem) { .editorial-grid{grid-template-columns:1fr;} }
@media (max-width: 43.75rem) {
 .moment-feature-grid, .tea-grid, .guide-grid {grid-template-columns:1fr;}
 .moment-panel { min-height:25rem; }
 .moments-feature__top {display:block;}
 .tea-controls {grid-template-columns:1fr;}
 .tea-reset{width:100%;}
 .guide-table{display:block;overflow-x:auto;}
 .consent-banner {grid-template-columns:1fr;bottom:.6rem;padding:1rem;gap:.7rem;}
 .consent-actions button {flex:1;}
 .origin-links{justify-content:start;}
}
@media (prefers-reduced-motion:reduce) { .moment-panel, .tea-card {transition:none !important;} }

/* RC4.1 - exact original, complete OngTeh crowned-cup / 王茶 logo */
:root { --header-height: 6.15rem; }
.site-header .header-inner { min-height: var(--header-height); }
.site-header .brand { gap: .85rem; }
.site-header .brand img {
  display: block;
  width: 4.85rem;
  height: auto;
  aspect-ratio: 512 / 483;
  object-fit: contain;
  flex: 0 0 auto;
}
.site-header .brand__text strong { font-size: 1.35rem; letter-spacing: .035em; }
.site-header .brand__text small { margin-top: .3rem; font-size: .81rem; }
.site-footer .footer-brand img {
  width: 5rem;
  height: auto;
  aspect-ratio: 512 / 483;
  object-fit: contain;
  flex: 0 0 auto;
}
@media (max-width: 61.249rem) {
  :root { --header-height: 5.5rem; }
  .site-header .brand img { width: 4.2rem; }
}
@media (max-width: 43.75rem) {
  :root { --header-height: 5.2rem; }
  .site-header .brand img { width: 3.8rem; }
  .site-header .brand__text strong { font-size: 1.2rem; }
}
/* RC4.1: The only illustrated element is the original approved mascot logo.
   Retain the user's photographic tea hero; suppress earlier non-photographic wave artwork. */
.brand-stripe { height: 1px; background: linear-gradient(90deg, transparent, #d7b783, transparent); }
.partner::before { background: none; height: 0; border-top: 1px solid currentColor; opacity: .15; }
/* Compact consent box prevents the first impression being obscured. */
.consent-banner {
  left: auto;
  right: 1.25rem;
  transform: none;
  width: min(25rem, calc(100% - 2.5rem));
  grid-template-columns: 1fr;
  gap: .8rem;
}
.consent-banner h2 { font-size: 1.3rem; }
.consent-banner .consent-actions { justify-content: flex-end; }
@media (max-width: 43.75rem) {
  .consent-banner { right: .6rem; left: .6rem; width: auto; }
}
