@charset "UTF-8";

/* Watoria Editorial Design System — Article v3.1.0 */
.watoria-article .watoria-article-hero {
  padding: clamp(46px, 7vw, 82px) 0 44px;
  border-bottom: 1px solid var(--wa-line);
}

.watoria-article .watoria-hero-copy {
  max-width: 980px;
}

.watoria-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 24px;
  color: var(--wa-muted);
  font-size: 0.78rem;
}
.watoria-breadcrumb a { color: inherit; text-decoration: none; }
.watoria-breadcrumb a:hover { color: var(--wa-gold-dark); }

.watoria-eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 14px !important;
  color: var(--wa-gold-dark);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.watoria-eyebrow::before {
  width: 30px;
  height: 1px;
  background: currentColor;
  content: "";
}

.watoria-article .watoria-hero-copy h1 {
  max-width: 930px;
  margin: 0 0 24px;
}

.watoria-dek {
  max-width: 800px;
  margin: 0 0 24px !important;
  color: #4c5966;
  font-family: var(--wa-serif);
  font-size: clamp(1.16rem, 2.1vw, 1.36rem);
  line-height: 1.58;
}

.watoria-article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  align-items: center;
  color: var(--wa-muted);
  font-size: 0.78rem;
}
.watoria-article-meta span + span { position: relative; }
.watoria-article-meta span + span::before {
  position: absolute;
  left: -11px;
  color: #b4aca0;
  content: "•";
}
.watoria-article-meta a { color: var(--wa-ink); font-weight: 700; text-decoration: none; }

.watoria-share {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 22px;
}
.watoria-share > span {
  margin-right: 3px;
  color: var(--wa-muted);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.watoria-share a,
.watoria-share button {
  display: inline-grid;
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  place-items: center;
  border: 1px solid var(--wa-line-strong);
  border-radius: 999px;
  background: #fff;
  color: var(--wa-text);
  font: 700 0.72rem/1 var(--wa-sans);
  text-decoration: none;
  cursor: pointer;
}
.watoria-share button { width: auto; }
.watoria-share a:hover,
.watoria-share button:hover { border-color: var(--wa-gold); color: var(--wa-gold-dark); }

.watoria-article .watoria-hero-media {
  margin-top: 36px;
}
.watoria-article .watoria-image--hero {
  margin: 0;
}
.watoria-article .watoria-image--hero img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border: 0;
  border-radius: 14px;
  background: #ece7dd;
  box-shadow: var(--wa-shadow);
}
.watoria-article .watoria-image--hero figcaption {
  max-width: var(--wa-reading);
  margin: 10px auto 0;
}

.watoria-article-layout {
  display: block;
  max-width: var(--wa-reading);
  margin: 58px auto 0;
}
.watoria-article-main { min-width: 0; }
.watoria-article-rail { min-width: 0; }

.watoria-toc {
  position: sticky;
  top: 110px;
  padding: 20px 0 20px 20px;
  border-left: 2px solid var(--wa-line);
}
.admin-bar .watoria-toc { top: 142px; }
.watoria-toc > p {
  margin: 0 0 13px;
  color: var(--wa-ink);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.watoria-toc ol { margin: 0; padding: 0; list-style: none; }
.watoria-toc li { margin: 0 !important; }
.watoria-toc a {
  display: block;
  padding: 7px 0;
  color: var(--wa-muted);
  font-size: 0.76rem;
  line-height: 1.42;
  text-decoration: none;
}
.watoria-toc a:hover,
.watoria-toc a[aria-current="location"] { color: var(--wa-gold-dark); font-weight: 700; }
.watoria-toc-mobile { display: none; }

.watoria-article .watoria-intro {
  margin: 0 0 48px;
  padding-bottom: 42px;
  border-bottom: 1px solid var(--wa-line);
  color: #3c4855;
  font-family: var(--wa-serif);
  font-size: 1.18rem;
  line-height: 1.78;
}
.watoria-article .watoria-reading-width,
.watoria-article .watoria-section-copy { max-width: var(--wa-reading); }

.watoria-article .watoria-section,
.watoria-article .watoria-story,
.watoria-article .watoria-maker,
.watoria-article .watoria-origin,
.watoria-article .watoria-material,
.watoria-article .watoria-authenticity,
.watoria-article .watoria-how-to-choose,
.watoria-article .watoria-care,
.watoria-article .watoria-experience,
.watoria-article .watoria-faq,
.watoria-article .watoria-related,
.watoria-article .watoria-official,
.watoria-article .watoria-final {
  scroll-margin-top: 120px;
  margin: 68px 0;
}

.watoria-section-heading {
  position: relative;
  margin-bottom: 26px;
  padding-top: 18px;
  border-top: 1px solid var(--wa-line-strong);
}
.watoria-section-heading::before {
  position: absolute;
  top: -2px;
  left: 0;
  width: 72px;
  height: 3px;
  background: var(--wa-gold);
  content: "";
}
.watoria-section-heading h2 { margin: 0; }

.watoria-quick-answer {
  margin: 0 0 54px;
  padding: 30px 34px 28px;
  border: 1px solid #dce8df;
  border-radius: var(--wa-radius);
  background: var(--wa-green-pale);
  box-shadow: 0 8px 24px rgba(41, 75, 56, 0.06);
}
.watoria-quick-answer h2 {
  margin: 0 0 14px;
  color: #294d3b;
  font-family: var(--wa-sans);
  font-size: 1.32rem;
  letter-spacing: -0.01em;
}
.watoria-quick-answer h2::before { margin-right: 10px; content: "✓"; }
.watoria-quick-answer .watoria-section-copy > :last-child { margin-bottom: 0; }

.watoria-learn {
  margin: 0 0 62px;
  padding: 28px 32px;
  border: 1px solid var(--wa-line);
  border-radius: var(--wa-radius);
  background: #fff;
  box-shadow: 0 10px 28px rgba(23, 32, 42, 0.045);
}
.watoria-learn h2 {
  margin: 0 0 16px;
  font-family: var(--wa-sans);
  font-size: 1.16rem;
}
.watoria-learn ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.watoria-learn li {
  position: relative;
  margin: 0 !important;
  padding: 9px 0 9px 24px;
  color: #485461;
  font-size: 0.92rem;
  line-height: 1.55;
}
.watoria-learn li::before {
  position: absolute;
  left: 0;
  color: var(--wa-gold);
  content: "◆";
}

.watoria-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 28px 0;
}
.watoria-card {
  min-width: 0;
  padding: 22px 24px;
  border: 1px solid var(--wa-line);
  border-radius: 14px;
  background: #fff;
}
.watoria-card h3,
.watoria-card h4 { margin: 0 0 10px; font-family: var(--wa-sans); font-size: 1rem; }
.watoria-card > :last-child { margin-bottom: 0; }

.watoria-best-fit ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 24px 0;
  padding: 0;
  list-style: none;
}
.watoria-best-fit li {
  margin: 0 !important;
  padding: 17px 18px;
  border-left: 3px solid var(--wa-gold);
  background: var(--wa-gold-pale);
  font-size: 0.93rem;
}

.watoria-steps {
  margin: 24px 0 0 !important;
  padding: 0 !important;
  counter-reset: watoria-step;
  list-style: none !important;
}
.watoria-steps > li {
  position: relative;
  min-height: 54px;
  margin: 0 0 18px !important;
  padding: 2px 0 18px 66px;
  border-bottom: 1px solid var(--wa-line);
  counter-increment: watoria-step;
}
.watoria-steps > li::before {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 50%;
  background: var(--wa-ink);
  color: #fff;
  font: 750 0.72rem/1 var(--wa-sans);
  content: counter(watoria-step, decimal-leading-zero);
}

.watoria-image {
  margin: 34px 0;
}
.watoria-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
  background: #ece8df;
}
.watoria-image--editorial img { aspect-ratio: 16 / 10; object-fit: cover; }
.watoria-image--diagram {
  padding: 16px;
  border: 1px solid var(--wa-line);
  border-radius: 14px;
  background: #fff;
}
.watoria-image--diagram img { object-fit: contain; border-radius: 6px; }
.watoria-caption,
.watoria-article figcaption {
  margin-top: 9px;
  color: var(--wa-muted);
  font-size: 0.74rem;
  line-height: 1.5;
}

.watoria-table-wrap {
  max-width: 100%;
  margin: 30px 0;
  overflow-x: auto;
  border: 1px solid var(--wa-line);
  border-radius: 12px;
  background: #fff;
  -webkit-overflow-scrolling: touch;
}
.watoria-table-wrap table { width: 100%; min-width: 620px; margin: 0; border: 0; border-collapse: collapse; font-size: 0.9rem; }
.watoria-table-wrap th,
.watoria-table-wrap td { padding: 13px 15px; border: 0; border-bottom: 1px solid var(--wa-line); text-align: left; vertical-align: top; }
.watoria-table-wrap th { background: #f6f3ed; color: var(--wa-ink); font-size: 0.76rem; letter-spacing: 0.04em; text-transform: uppercase; }

.watoria-faq-list { display: grid; gap: 11px; }
.watoria-faq-item {
  overflow: hidden;
  border: 1px solid var(--wa-line);
  border-radius: 12px;
  background: #fff;
}
.watoria-faq-item summary {
  position: relative;
  padding: 18px 48px 18px 20px;
  cursor: pointer;
  color: var(--wa-ink);
  font-weight: 700;
  list-style: none;
}
.watoria-faq-item summary::-webkit-details-marker { display: none; }
.watoria-faq-item summary::after {
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  color: var(--wa-gold-dark);
  font-size: 1.2rem;
  content: "+";
}
.watoria-faq-item[open] summary::after { content: "−"; }
.watoria-faq-answer { padding: 0 20px 18px; color: #485461; }
.watoria-faq-answer > :last-child { margin-bottom: 0; }

.watoria-official {
  padding: 28px 30px;
  border: 1px solid var(--wa-line);
  border-radius: 14px;
  background: #f1f3f4;
}
.watoria-official .watoria-section-heading { padding-top: 0; border-top: 0; }
.watoria-official .watoria-section-heading::before { display: none; }
.watoria-official h2 { font-family: var(--wa-sans); font-size: 1.34rem; }
.watoria-reference-list { margin-bottom: 0 !important; }

.watoria-final {
  padding-top: 36px;
  border-top: 1px solid var(--wa-line-strong);
}
.watoria-final .watoria-section-heading { padding-top: 0; border-top: 0; }
.watoria-final .watoria-section-heading::before { display: none; }
.watoria-final h2 { font-size: 1.8rem; }

.watoria-related {
  padding: 30px;
  border-radius: 16px;
  background: var(--wa-ink);
  color: #e6e9ec;
}
.watoria-related .watoria-section-heading { padding-top: 0; border-top: 0; }
.watoria-related .watoria-section-heading::before { display: none; }
.watoria-related h2 { color: #fff; font-size: 1.7rem; }
.watoria-related a { color: #f3d99d; }


/* v3.1.0: editorial finish after full-page acceptance review. */
.watoria-article .watoria-image--diagram {
  width: min(100%, 700px);
  margin-right: auto;
  margin-left: auto;
}

.watoria-related {
  padding: clamp(28px, 4vw, 42px);
  border: 1px solid var(--wa-line-strong);
  border-radius: 18px;
  background: #f4efe6;
  color: var(--wa-text);
}
.watoria-related h2 {
  color: var(--wa-ink);
  font-size: clamp(1.65rem, 2.8vw, 2.15rem);
}
.watoria-related .watoria-section-copy > p { color: #5b6470; }
.watoria-related-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 22px;
}
.watoria-related-card {
  position: relative;
  display: flex;
  min-height: 190px;
  padding: 22px 22px 48px;
  flex-direction: column;
  border: 1px solid rgba(112, 75, 13, 0.16);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.86);
  color: var(--wa-text) !important;
  text-decoration: none !important;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.watoria-related-card:last-child:nth-child(odd) {
  grid-column: 1 / -1;
  min-height: 0;
}
.watoria-related-card:hover {
  transform: translateY(-2px);
  border-color: rgba(168, 116, 25, 0.52);
  box-shadow: 0 12px 30px rgba(23, 32, 42, 0.08);
}
.watoria-related-card > span {
  margin-bottom: 10px;
  color: var(--wa-gold-dark);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.watoria-related-card > strong {
  margin-bottom: 8px;
  color: var(--wa-ink);
  font-family: var(--wa-serif);
  font-size: 1.22rem;
  line-height: 1.24;
}
.watoria-related-card > small {
  color: #5e6873;
  font-size: 0.82rem;
  line-height: 1.55;
}
.watoria-related-card > b {
  position: absolute;
  right: 20px;
  bottom: 17px;
  color: var(--wa-gold-dark);
  font-size: 1.08rem;
}

/* HASHILO_WATORIA_RELATED_LINK_CONTRAST_EXACT_20260904 */
.watoria-related .watoria-section-copy a,.watoria-related ul a{color:#5b4314!important;-webkit-text-fill-color:#5b4314!important;text-decoration-color:#9b8353!important;}
