/* ============================================================
   ADASH — Inner pages: Articles, Vibration Analysis, Downloads,
           News page, Exhibitions page, About, Contact, Videos,
           Registration, Search
   ============================================================ */

/* ---- Articles ---- */
.articles-page { background: var(--lighter-bg); min-height: 100vh; padding: 3rem 0; }
.articles-page-title { font-size: 1.875rem; font-weight: 300; color: var(--dark-blue); margin-bottom: 2rem; }
.articles-list { background: var(--white); padding: 2rem; border: 1px solid var(--border-200); }
.article-item {
  display: flex; flex-direction: column; gap: 2rem;
  padding: 2rem 0; border-bottom: 1px solid var(--border-200);
}
.article-item:last-child { border-bottom: none; }
@media (min-width: 768px) { .article-item { flex-direction: row; } }
.article-img { flex-shrink: 0; width: 100%; }
.article-img img { width: 100%; height: 200px; object-fit: cover; }
@media (min-width: 768px) { .article-img { width: 33.333%; } }
.article-body { display: flex; flex-direction: column; justify-content: center; }
@media (min-width: 768px) { .article-body { width: 66.667%; } }
.article-title { color: var(--dark-blue); font-weight: 600; font-size: 1.125rem; margin-bottom: 0.75rem; }
.article-desc { font-size: 0.875rem; color: var(--text-600); margin-bottom: 1.5rem; line-height: 1.625; }
.btn-read-more {
  display: inline-block; background: var(--teal); color: var(--white);
  padding: 0.5rem 1.5rem; font-size: 0.875rem;
  transition: background 0.2s; text-decoration: none; align-self: flex-start;
}
.btn-read-more:hover { background: var(--teal-hover); text-decoration: none; color: var(--white); }


/* ---- Vibration Analysis Support Page ---- */
.va-page { padding: 3rem 0; }
.va-page-title { font-size: 1.875rem; font-weight: 300; color: var(--dark-blue); margin-bottom: 3rem; }
.va-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 768px) { .va-grid { grid-template-columns: repeat(3, 1fr); } }
.va-chapter {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; padding: 1.5rem;
  border: 1px solid transparent; transition: border-color 0.2s; text-decoration: none;
}
.va-chapter:hover { border-color: var(--border-200); text-decoration: none; }
.va-chapter-img {
  margin-bottom: 1.5rem; background: #f9fafb;
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 180px;
}
.va-chapter-img img { max-height: 170px; max-width: 100%; object-fit: contain; }
.va-chapter-title { color: var(--dark-blue); font-weight: 600; font-size: 0.875rem; }


/* ---- Download pages (datasheets, firmware, software) ---- */
.downloads-page { padding: 3rem 0; }
.downloads-title { font-size: 1.875rem; font-weight: 300; color: var(--dark-blue); margin-bottom: 2rem; }
.download-item {
  display: flex; flex-direction: column; gap: 2rem;
  padding: 2rem 0; border-bottom: 1px solid var(--border-200);
}
.download-item:last-child { border-bottom: none; }
@media (min-width: 768px) { .download-item { flex-direction: row; } }
.download-item-img { flex-shrink: 0; width: 100%; }
.download-item-img img { width: 100%; height: 200px; object-fit: cover; }
@media (min-width: 768px) { .download-item-img { width: 33.333%; } }
.download-item-body { display: flex; flex-direction: column; justify-content: flex-start; }
@media (min-width: 768px) { .download-item-body { width: 66.667%; } }
.download-item-title { color: var(--dark-blue); font-weight: 600; font-size: 1.125rem; margin-bottom: 1rem; }
.download-link-row { display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.375rem; }
.download-link-arrow { color: var(--teal3); }
.download-link-text { color: #1f2937; font-size: 0.875rem; text-decoration: none; }
.download-link-text:hover { text-decoration: underline; }
.download-lang-links { display: flex; flex-wrap: wrap; gap: 0.25rem 1.5rem; margin-top: 0.5rem; }
.download-lang-link { font-size: 0.75rem; color: var(--teal3); text-decoration: none; }
.download-lang-link:hover { text-decoration: underline; }
.download-product-link { color: var(--teal); font-size: 0.875rem; font-weight: 500; text-transform: uppercase; text-decoration: none; }
.download-product-link:hover { color: var(--teal-hover); text-decoration: none; }


/* ---- News Page ---- */
.news-page { background: var(--white); padding-top: 2rem; padding-bottom: 4rem; }
.news-page-title { font-size: 2.25rem; font-weight: 300; color: var(--blue); margin-bottom: 2rem; }
.news-item {
  display: flex; flex-direction: column; gap: 2rem;
  border-bottom: 1px solid #f3f4f6; padding-bottom: 3rem; margin-bottom: 3rem;
}
.news-item:last-child { border-bottom: none; }
@media (min-width: 768px) { .news-item { flex-direction: row; } }
.news-item-img { width: 100%; flex-shrink: 0; }
.news-item-img-inner { aspect-ratio: 16/9; background: #f3f4f6; overflow: hidden; position: relative; }
.news-item-img-inner img { width: 100%; height: 100%; object-fit: cover; display: block; }
.news-item-img-inner--empty { background: #f8fafc; border: 1px solid #e5e7eb; display: flex; align-items: center; justify-content: center; }
.news-item-img-placeholder { color: #9ca3af; font-size: .8125rem; font-weight: 500; letter-spacing: .01em; }
a.news-item-img-inner--empty { text-decoration: none; }
a.news-item-img-inner--empty:hover .news-item-img-placeholder { color: #6b7280; }
@media (min-width: 768px) { .news-item-img { width: 33.333%; } }
.news-item-body { display: flex; flex-direction: column; justify-content: center; }
@media (min-width: 768px) { .news-item-body { width: 66.667%; } }
.news-item-date { font-size: 0.875rem; color: #6b7280; margin-bottom: 0.5rem; font-weight: 500; }
.news-item-title { color: #005eb8; font-weight: 700; font-size: 1.25rem; margin-bottom: 0.75rem; }
.news-item-title a { color: inherit; text-decoration: none; }
.news-item-title a:hover { text-decoration: underline; }
.news-item-desc { color: #4b5563; margin-bottom: 1.5rem; line-height: 1.625; }
.news-item-btn {
  display: inline-block; background: #66cdaa; color: var(--white);
  font-weight: 700; padding: 0.5rem 1.5rem; font-size: 0.875rem;
  text-transform: uppercase; text-decoration: none; border-radius: 2px;
  transition: background 0.2s;
}
.news-item-btn:hover { background: #5bb899; color: var(--white); text-decoration: none; }
.news-item-video-tag { background: var(--blue); color: var(--white); font-size: 0.75rem; font-weight: 700; padding: 0.125rem 0.5rem; text-transform: uppercase; display: inline-block; margin-bottom: 0.5rem; }
.news-pagination-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.5rem; font-size: 0.875rem; color: #6b7280; margin-bottom: 2rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 1rem; }
.news-pagination-bar a { color: #005eb8; text-decoration: none; margin: 0 0.25rem; }
.news-pagination-bar a:hover { text-decoration: underline; }
.news-pagination-sep { margin: 0 0.25rem; }


/* ---- Exhibitions Page ---- */
.exhibitions-page { background: var(--white); padding-top: 2rem; padding-bottom: 4rem; }
.exhibitions-page-title { font-size: 2.25rem; font-weight: 300; color: var(--blue); margin-bottom: 2rem; }
.exhibitions-page-subtitle { color: var(--text-500); font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 3rem; }
.ex-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 768px) { .ex-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .ex-grid { grid-template-columns: repeat(3, 1fr); } }
.ex-card {
  display: block; background: var(--white); border: 1px solid #f3f4f6;
  box-shadow: 0 1px 3px rgba(0,0,0,.06); border-radius: 0.5rem; overflow: hidden;
  text-decoration: none; transition: box-shadow 0.3s;
}
.ex-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,.1); text-decoration: none; }
.ex-card-img { aspect-ratio: 16/9; background: #f3f4f6; overflow: hidden; position: relative; }
.ex-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; display: block; }
.ex-card:hover .ex-card-img img { transform: scale(1.05); }
.ex-card-body { padding: 1.5rem; }
.ex-card-title { font-size: 1.125rem; font-weight: 700; color: #005eb8; text-transform: uppercase; margin-bottom: 1rem; height: 3.5rem; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ex-card-title-gray { font-size: 1.125rem; font-weight: 700; color: #374151; text-transform: uppercase; margin-bottom: 1rem; height: 3.5rem; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; transition: color 0.3s; }
.ex-card:hover .ex-card-title-gray { color: #005eb8; }
.ex-card-info { display: flex; flex-direction: column; gap: 0.5rem; font-size: 0.875rem; color: #4b5563; }
.ex-card-info-row { display: flex; align-items: center; gap: 0.5rem; }
.ex-card-info-icon { width: 1rem; height: 1rem; color: #9ca3af; flex-shrink: 0; }
.ex-card-country { padding-left: 1.5rem; color: #6b7280; font-size: 0.75rem; text-transform: uppercase; font-weight: 500; }
.ex-card-past { opacity: 0.8; }
.ex-card-past .ex-card-img img { filter: grayscale(100%); transition: filter 0.5s, transform 0.5s; }
.ex-card-past:hover .ex-card-img img { filter: grayscale(0); }
.ex-card-past:hover { opacity: 1; }
.ex-past-title { font-size: 1.875rem; font-weight: 300; color: #005eb8; margin-bottom: 2rem; margin-top: 4rem; }


/* ---- About Page ---- */
.about-page { background: var(--light-bg); padding-top: 3rem; }
.about-title { font-size: 1.875rem; font-weight: 300; color: #1f2937; margin-bottom: 3rem; text-transform: uppercase; }
.timeline-section { position: relative; padding-bottom: 4rem; }
.timeline-line {
  position: absolute; left: 50%; top: 0; bottom: 0;
  width: 1px; background: #d1d5db; transform: translateX(-50%);
}
@media (max-width: 767px) { .timeline-line { display: none; } }
.timeline-year {
  position: relative; z-index: 10;
  display: inline-block; padding: 0.5rem 1rem;
  font-size: 1.25rem; font-weight: 500; color: #374151;
  background: var(--light-bg); margin-bottom: 3rem;
}
.timeline-label { font-size: 1.25rem; font-weight: 500; color: #374151; text-transform: uppercase; background: var(--light-bg); position: relative; z-index: 10; display: inline-block; padding: 0.5rem 1rem; }
.timeline-row { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; margin-bottom: 4rem; }
@media (max-width: 767px) {
  .timeline-row { grid-template-columns: 1fr; }
  .timeline-row .text-right,
  .timeline-row .text-left { text-align: left; }
}
.text-right { text-align: right; }
.text-left { text-align: left; }

.about-timeline-photo {
  width: 100%;
  max-width: 22rem;
  height: auto;
  object-fit: cover;
  border-radius: 4px;
}
.about-timeline-photo--portrait {
  max-width: 18rem;
  max-height: 14rem;
  object-fit: cover;
  object-position: top center;
}
.about-timeline-photo--vibrio {
  max-width: 12rem;
  object-fit: contain;
}

.about-vibrio-evo {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem 1rem;
  margin: 0 auto 4rem;
  max-width: 56rem;
  align-items: start;
}
@media (min-width: 768px) {
  .about-vibrio-evo { grid-template-columns: repeat(4, 1fr); }
}
.about-vibrio-evo-item { text-align: center; }
.about-vibrio-evo-item img {
  width: 100%;
  max-width: 10rem;
  height: auto;
  object-fit: contain;
  margin: 0 auto 0.75rem;
  display: block;
}
.about-vibrio-evo-item span {
  font-size: 0.875rem;
  color: var(--text-600);
  font-weight: 500;
}

.about-map-video {
  width: 100%;
  max-width: 56rem;
  margin: 0 auto;
  display: block;
  border-radius: 4px;
  background: #0f172a;
}
.timeline-section-title { font-size: 1.875rem; font-weight: 300; color: #1f2937; margin-bottom: 1rem; }
.timeline-text { color: var(--text-600); font-size: 0.875rem; line-height: 1.625; }

.about-black { background: var(--black); padding: 6rem 0; text-align: center; }
.about-black h2 { font-size: 2.25rem; font-weight: 300; color: var(--white); text-transform: uppercase; margin-bottom: 2rem; }
.btn-about-cta {
  display: inline-block; border: 1px solid var(--white); color: var(--white);
  padding: 0.75rem 2rem; text-transform: uppercase; letter-spacing: 0.05em;
  transition: background 0.2s, color 0.2s; text-decoration: none;
}
.btn-about-cta:hover { background: var(--white); color: var(--black); text-decoration: none; }


/* ---- Contact Page ---- */
.contact-page { background: var(--black); color: var(--white); padding: 4rem 0; }
.contact-page-title { font-size: clamp(1.875rem, 6vw, 3rem); font-weight: 300; color: var(--white); text-align: center; margin-bottom: 0.5rem; }
.contact-page-subtitle { font-size: 1.125rem; color: rgba(255,255,255,0.6); text-align: center; margin-bottom: 3rem; }
.contact-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; }
@media (min-width: 768px) { .contact-grid { grid-template-columns: repeat(3, 1fr); } }
.contact-section-title { font-size: 1.125rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 1rem; }
.contact-input, .contact-textarea, .contact-select {
  width: 100%; background: #3a3a3a; border: none;
  padding: 0.75rem; font-size: 0.875rem; color: var(--white);
  outline: none; font-family: inherit;
}
.contact-select { color: var(--black); background: var(--white); }
.contact-textarea { resize: vertical; min-height: 120px; }
.btn-contact {
  display: inline-block; border: 1px solid var(--white); color: var(--white);
  padding: 0.5rem 1.5rem; font-size: 0.875rem;
  transition: background 0.2s, color 0.2s; background: none; cursor: pointer; font-family: inherit;
  text-transform: uppercase;
}
.btn-contact:hover { background: var(--white); color: var(--black); }


/* ---- Videos Page ---- */
.videos-page { background: var(--lighter-bg); min-height: 100vh; padding: 3rem 0; }
.videos-title { font-size: 1.875rem; font-weight: 300; color: var(--dark-blue); margin-bottom: 2rem; }
.video-cats { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 2rem; }
.video-cat-btn {
  padding: 0.375rem 1rem; font-size: 0.75rem; font-weight: 700; text-transform: uppercase;
  border: 1px solid var(--border-200); background: var(--white); color: var(--text-600);
  cursor: pointer; font-family: inherit; border-radius: 2px; transition: all 0.2s;
}
.video-cat-btn.active, .video-cat-btn:hover { background: var(--blue); color: var(--white); border-color: var(--blue); }
.video-list { background: var(--white); border: 1px solid var(--border-200); padding: 0 1.5rem; }
.video-item {
  display: flex; flex-direction: column; gap: 1.5rem;
  padding: 1.5rem 0; border-bottom: 1px solid var(--border-100);
}
.video-item:last-child { border-bottom: none; }
@media (min-width: 768px) { .video-item { flex-direction: row; } }
.video-thumb { flex-shrink: 0; width: 100%; cursor: pointer; }
.video-thumb img { width: 100%; height: 120px; object-fit: cover; }
@media (min-width: 768px) { .video-thumb { width: 25%; } }
.video-body { display: flex; flex-direction: column; justify-content: center; }
.video-title { color: var(--dark-blue); font-weight: 600; font-size: 1rem; margin-bottom: 0.5rem; cursor: pointer; }
.video-title:hover { text-decoration: underline; }
.video-desc {
  font-size: 0.875rem; color: var(--text-600);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}


/* ---- Registration Page ---- */
.registration-page { padding: 3rem 0; background: var(--lighter-bg); min-height: 100vh; }
.registration-title { font-size: 1.875rem; font-weight: 300; color: var(--dark-blue); margin-bottom: 2rem; }
.registration-form { background: var(--white); padding: 2rem; border: 1px solid var(--border-200); max-width: 600px; }
.form-row { margin-bottom: 1rem; }
.form-label { display: block; font-size: 0.875rem; font-weight: 600; color: var(--text-600); margin-bottom: 0.375rem; }
.form-input, .form-select {
  width: 100%; border: 1px solid var(--border-200); padding: 0.5rem 0.75rem;
  font-size: 0.875rem; outline: none; font-family: inherit;
}
.form-input:focus { border-color: var(--blue); }
.btn-teal {
  display: inline-block; background: var(--teal); color: var(--white);
  padding: 0.5rem 1.5rem; font-size: 0.875rem; font-weight: 600;
  transition: background 0.2s; border: none; cursor: pointer; font-family: inherit;
}
.btn-teal:hover { background: var(--teal-hover); }