/* --- added by the Aug 2026 fix pass: layout for new/changed elements only --- */
.btn-inquiry, .btn-inquiry-secondary {
  display: inline-block; padding: 10px 25px; font-weight: 500; border-radius: 8px;
  text-decoration: none; margin: 6px 8px;
}
.btn-inquiry { background-color: #82795f; color: #fff; }
.btn-inquiry-secondary { background-color: transparent; color: #82795f; border: 1px solid #82795f; }
.product-card { border: 1px solid #eee; border-radius: 10px; padding: 12px; text-align: center; height: 100%; }
.product-card img { border-radius: 6px; margin-bottom: 8px; width: 100%; height: auto; }
.breadcrumb { background: transparent; padding-left: 0; font-size: 14px; }
.faq-item { margin-bottom: 18px; }
.faq-item h4 { font-size: 16px; margin-bottom: 4px; }
table.table th { white-space: nowrap; background: #f8f6f2; }

/* Placeholder MOQ/packaging blocks -- deliberately loud so nobody mistakes these
   for confirmed data. Remove this whole block from a page once real figures
   replace the placeholder call in build_site.py. */
.placeholder-note {
  border: 2px dashed #c0862a; background: #fbf3e2; border-radius: 8px;
  padding: 14px 16px; margin-top: 16px;
}
.placeholder-tag {
  display: inline-block; background: #c0862a; color: #fff; font-size: 11px;
  font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  padding: 3px 9px; border-radius: 4px;
}
.placeholder-note table th { background: transparent; }
.placeholder-note em { color: #6b5a33; font-size: 13.5px; }

/* Hero banner (image behind heading) -- this existed only as page-specific inline
   <style> blocks on the live site (never in the shared stylesheet), so every rebuilt
   page was silently missing it. Restored here, sitewide, with a dark overlay added
   for text contrast regardless of which photo is used. */
.about_hero_banner { position: relative; height: 420px; overflow: hidden; }
.about_hero_banner::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(20,20,15,.35), rgba(20,20,15,.55));
}
.about_hero_banner .banner-image { width: 100%; height: 100%; object-fit: cover; display: block; }
.about_hero_banner .hero_text {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  z-index: 2; width: 100%; max-width: 900px; padding: 0 24px; text-align: center;
}
.about_hero_banner .about-title {
  color: #fff; font-size: 44px; margin: 0; text-shadow: 0 2px 14px rgba(0,0,0,.45);
}
.about_hero_banner .hero-lead {
  color: #f3f1ea; font-size: 18px; margin: 14px 0 22px; text-shadow: 0 1px 8px rgba(0,0,0,.4);
}
@media (max-width: 767px) {
  .about_hero_banner { height: 320px; }
  .about_hero_banner .about-title { font-size: 30px; }
}
/* secondary button needs light text/border when sitting on the dark hero photo */
.hero_text .btn-inquiry-secondary { color: #fff; border-color: #fff; }
.hero-home { height: 620px; }
@media (max-width: 767px) { .hero-home { height: 480px; } }
body.sub_page { background: #f8f6f2; }
.category-section { background-color: #f8f6f2; }
.product-card { display: flex; flex-direction: column; justify-content: center; min-height: 120px; }
.product-card img { aspect-ratio: 4/3; object-fit: cover; }
.mv-card { background-color: #71684f; color: #fff; border-radius: 10px; padding: 32px; height: 100%; }
.mv-card h3 { color: #fff; }
.mv-card p { margin: 0; }
.why-card { background: #fff; border-radius: 10px; padding: 28px 22px; height: 100%; box-shadow: 0 4px 14px rgba(130,121,95,.10); text-align: center; transition: transform .25s ease, box-shadow .25s ease; }
.why-card i { font-size: 28px; color: #82795f; margin-bottom: 10px; display: block; }
.why-card h4 { margin: 6px 0; }
.why-card p { margin: 0; font-size: 14.5px; color: #555; }

/* --- redesign pass (Aug 2026): hover/active/focus states + tinted shadows on
   elements this rebuild introduced. The inherited theme already handles this
   correctly elsewhere; these rules only cover .btn-inquiry/.product-card/.why-card,
   which had none. Kept deliberately restrained (no motion/glass/grain effects) --
   this is a B2B export site, not a SaaS landing page. */
.btn-inquiry, .btn-inquiry-secondary {
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease;
}
.btn-inquiry:hover { background-color: #6f6750; box-shadow: 0 6px 16px rgba(130,121,95,.35); transform: translateY(-2px); }
.btn-inquiry-secondary:hover { background-color: #82795f; color: #fff; }
.btn-inquiry:active, .btn-inquiry-secondary:active { transform: translateY(0); box-shadow: none; }
.btn-inquiry:focus-visible, .btn-inquiry-secondary:focus-visible {
  outline: 2px solid #82795f; outline-offset: 2px;
}
.product-card { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.product-card:hover { transform: translateY(-4px); box-shadow: 0 10px 22px rgba(130,121,95,.14); border-color: #d8d3c4; }
.why-card:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(130,121,95,.16); }
.mv-card { transition: transform .25s ease, box-shadow .25s ease; }
.mv-card:hover { transform: translateY(-4px); box-shadow: 0 14px 28px -10px rgba(44,42,30,.35); }
.about_hero_banner .about-title, .why-card h4, .mv-card h3 { text-wrap: balance; }

/* Icon-reveal on hover -- applies to ANY card-style container whose class
   ends in "-card" (mv-card, why-card, product-card, and any future card
   class following the same naming convention), as long as it contains a
   ".card-icon" element. No CSS changes needed to extend this to new cards
   later -- just follow the naming convention and add a .card-icon svg. */
[class$="-card"] { position: relative; }
.card-icon {
  position: absolute; top: 20px; right: 20px; width: 28px; height: 28px;
  opacity: 0; transform: translate(8px, -8px); pointer-events: none;
  transition: opacity .3s ease, transform .3s ease;
}
[class$="-card"]:hover .card-icon { opacity: .9; transform: translate(0, 0); }
@media (prefers-reduced-motion: reduce) {
  .btn-inquiry, .btn-inquiry-secondary, .product-card, .why-card, .mv-card, .card-icon { transition: none; }
  .btn-inquiry:hover, .product-card:hover, .why-card:hover, .mv-card:hover { transform: none; }
}

/* --- plain page title (replaces the old soil-photo banner on every sub-page
   except the homepage, which keeps its own hero-home banner) --- */
.page-title { margin: 22px 0 4px; font-weight: 800; letter-spacing: -.01em; color: #2c2c28; text-wrap: balance; }

/* --- brochure showcase (About page, above Why Choose) --- */
.brochure-showcase {
  background: #ece3d1; border-radius: 14px; box-shadow: 0 16px 40px -22px rgba(44,42,30,.4);
  padding: 44px; display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 44px; align-items: center;
  position: relative; overflow: hidden;
}
.sc-leaf { position: absolute; right: -16px; bottom: -20px; width: 140px; height: 140px; opacity: .3; color: #82795f; }
.sc-content { position: relative; z-index: 1; }
.sc-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #82795f; margin: 0 0 10px; }
.sc-content h3 { font-size: 30px; font-weight: 900; margin: 0 0 12px; color: #2c2c28; letter-spacing: -.01em; text-wrap: balance; }
.sc-content p { margin: 0 0 20px; color: #58554a; max-width: 34ch; line-height: 1.65; }
.btn-showcase {
  display: inline-flex; align-items: center; gap: 0; background: transparent; color: #82795f;
  font-size: 13px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  padding: 4px 20px 4px 4px; border-radius: 999px; border: 1.6px solid #82795f;
  text-decoration: none; cursor: pointer; transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.btn-showcase:hover { background: #82795f; color: #fff; transform: translateY(-1px); }
.btn-showcase:hover .btn-showcase-icon { background: #fff; color: #82795f; }
.btn-showcase:active { transform: translateY(0); }
.btn-showcase:focus-visible { outline: 2px solid #2c2c28; outline-offset: 2px; }
.btn-showcase-icon {
  width: 34px; height: 34px; border-radius: 50%; background: #82795f; color: #fff;
  display: flex; align-items: center; justify-content: center; margin-right: 12px; flex-shrink: 0;
  transition: background-color .2s ease, color .2s ease;
}
.btn-showcase-icon svg { width: 14px; height: 14px; }
.book-wrap { position: relative; z-index: 1; }
.book { display: flex; border-radius: 12px; overflow: hidden; box-shadow: 0 20px 44px -18px rgba(44,42,30,.4); background: #fff; height: 360px; }
.book-page { flex: 1; position: relative; overflow: hidden; }
.book-page.left img { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity .3s ease; }
.book-page.left::after {
  content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 18px;
  background: linear-gradient(90deg, transparent, rgba(0,0,0,.18));
}
.book-page.right { background: #fdfcf9; padding: 34px 38px; display: flex; flex-direction: column; justify-content: center; }
.book-page.right::before {
  content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 18px;
  background: linear-gradient(270deg, transparent, rgba(0,0,0,.12));
}
.book-page.right .pg-label { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #2c2c28; margin: 0 0 14px; }
.book-page.right .pg-text { font-size: 15px; line-height: 1.7; color: #58554a; margin: 0; }
.book-page.right .pg-list { list-style: none; margin: 0; padding: 0; font-size: 14px; color: #58554a; line-height: 2; column-count: 2; column-gap: 20px; }
.book-nav {
  position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 50%;
  background: rgba(255,255,255,.92); border: 1px solid #e0d9c6; display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: #2c2c28; box-shadow: 0 6px 16px rgba(44,42,30,.18); z-index: 2;
  transition: background-color .2s ease;
}
.book-nav:hover { background: #fff; }
.book-nav:focus-visible { outline: 2px solid #82795f; outline-offset: 2px; }
.book-nav.prev { left: -20px; }
.book-nav.next { right: -20px; }
.book-nav svg { width: 17px; height: 17px; }
.book-dots { display: flex; justify-content: center; gap: 8px; margin-top: 16px; }
.book-dots button {
  width: 8px; height: 8px; border-radius: 50%; border: none; background: #d5cdb6; padding: 0; cursor: pointer;
}
.book-dots button.active { background: #82795f; width: 22px; border-radius: 4px; transition: width .2s ease; }
.book-dots button:focus-visible { outline: 2px solid #82795f; outline-offset: 2px; }
@media (max-width: 767px) {
  .brochure-showcase { grid-template-columns: 1fr; padding: 28px; gap: 28px; }
  .book { flex-direction: column; height: auto; }
  .book-page.right { padding: 24px; }
  .book-page.left { height: 200px; }
  .book-page.left::after { top: auto; left: 0; right: 0; bottom: 0; width: auto; height: 18px; background: linear-gradient(180deg, transparent, rgba(0,0,0,.18)); }
  .book-page.right::before { top: 0; left: 0; right: 0; bottom: auto; width: auto; height: 18px; background: linear-gradient(0deg, transparent, rgba(0,0,0,.1)); }
  .book-nav.prev { left: 8px; }
  .book-nav.next { right: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .book-page.left img { transition: none; }
}

/* --- cursor ring: trails the real (still-visible) OS cursor, mouse-only.
   Position/scale are driven by GSAP quickTo in SCRIPTS; only opacity and
   border-color transition here. --- */
@media (pointer: fine) {
  .custom-cursor-ring {
    position: fixed; top: 0; left: 0; pointer-events: none; z-index: 9999;
    width: 34px; height: 34px; border-radius: 50%;
    border: 1.5px solid rgba(130,121,95,.7); opacity: 0;
    transition: opacity .2s ease, border-color .2s ease;
  }
  .custom-cursor-ring.is-hover { border-color: #82795f; }
}

/* --- floating WhatsApp button: fixed bottom-right, every page --- */
.whatsapp-fab {
  position: fixed; right: 24px; bottom: 24px; z-index: 1000;
  width: 58px; height: 58px; border-radius: 50%; background: #25d366;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 20px rgba(37,211,102,.45);
  transition: transform .2s ease, box-shadow .2s ease;
}
.whatsapp-fab i { color: #fff; font-size: 30px; }
.whatsapp-fab:hover { transform: scale(1.08); box-shadow: 0 10px 26px rgba(37,211,102,.55); }
.whatsapp-fab:focus-visible { outline: 2px solid #128c43; outline-offset: 3px; }
@media (max-width: 767px) {
  .whatsapp-fab { width: 50px; height: 50px; right: 16px; bottom: 16px; }
  .whatsapp-fab i { font-size: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .whatsapp-fab { transition: none; }
  .whatsapp-fab:hover { transform: none; }
}

/* --- footer: compact "slim bar" pass. Reordered to Info / Products / Links /
   Address (was Address / Info / Products / Links), and copyright merged into
   this same olive surface instead of sitting as a separate white strip
   below it (the old .footer_section, now unused/removed). --- */
.info_section { padding: 26px 0 6px; }
.info_section h4, .info_section h2 {
  font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  opacity: .85; margin-bottom: 10px;
}
.info_section .info_col { margin-bottom: 14px; }
.info_section .info_detail p { font-size: 11.5px; line-height: 1.55; opacity: .88; margin: 0; }
.info_section .info_links a {
  position: relative; font-size: 11.5px; margin-bottom: 6px; opacity: .9;
  padding-left: 0; transition: opacity .2s ease, padding-left .2s ease;
}
.info_section .info_links a::before {
  content: ""; position: absolute; left: -10px; top: 50%; width: 4px; height: 4px; border-radius: 50%;
  background: #fff; opacity: 0; transform: translateY(-50%) scale(.4);
  transition: opacity .2s ease, transform .2s ease;
}
.info_section .info_links a:hover { opacity: 1; padding-left: 12px; }
.info_section .info_links a:hover::before { opacity: 1; transform: translateY(-50%) scale(1); }
@media (prefers-reduced-motion: reduce) {
  .info_section .info_links a, .info_section .info_links a::before { transition: none; }
}
.info_section .info_contact .contact_link_box a { font-size: 11.5px; margin: 2px 0; opacity: .9; }
.info_section .info_contact .contact_link_box a i { font-size: 11px; }
.info_section .info_social { margin-top: 8px; margin-bottom: 0; }
.info_section .info_social a {
  width: 24px; height: 24px; font-size: 12px; margin-right: 8px;
  border: 1px solid rgba(255,255,255,.5); transition: background-color .15s ease;
}
.info_section .info_social a:hover { background-color: rgba(255,255,255,.18); }
.footer_divider { height: 1px; background: rgba(255,255,255,.16); margin: 16px 0 10px; }
.footer_copyright { text-align: center; font-size: 10.5px; opacity: .75; padding-bottom: 14px; margin: 0; }

/* --- Oct 2026 contrast pass: white on #82795f was 4.33:1 and the .75-.9
   opacities pushed small footer text further below WCAG AA. Darker olive
   (#655d46, 6.55:1 with white), full-opacity text, larger sizes. --- */
.info_section { background-color: #655d46; }
.info_section h4, .info_section h2 { font-size: 12.5px; opacity: 1; }
.info_section .info_detail p,
.info_section .info_links a,
.info_section .info_contact .contact_link_box a,
.info_section .footer-phones { font-size: 13px; opacity: 1; }
.info_section .footer-phones { color: #fff; margin: 2px 0; line-height: 1.6; }
.info_section .footer-phones i { font-size: 11px; margin-right: 5px; }
.info_section .footer-phones a { display: inline; margin: 0; }
.info_section .info_contact .contact_link_box a i { font-size: 12px; }
.footer_copyright { font-size: 12px; opacity: 1; }
.footer_divider { background: rgba(255,255,255,.28); }
@media (max-width: 767px) {
  .info_section { padding-top: 32px; }
  .info_section h4, .info_section h2 { font-size: 13px; margin-bottom: 12px; }
  .info_section .info_detail p,
  .info_section .info_links a,
  .info_section .info_contact .contact_link_box a,
  .info_section .footer-phones { font-size: 14.5px; line-height: 1.6; }
  .info_section .info_links a { min-height: 32px; margin-bottom: 4px; }
  .info_section .info_contact .contact_link_box a,
  .info_section .footer-phones { margin: 6px 0; }
  .info_section .footer-phones a { display: inline-block; padding: 4px 0; }
  .info_section .info_social a { width: 40px; height: 40px; font-size: 17px; }
  .footer_copyright { font-size: 12.5px; }
}

/* --- Aug 2026 Import/Export redesign: DESIGN.md tokens + mega-menu, tag
   pills, spec tables, side/catalogue cards. Scoped to the new nav/catalogue
   markup only -- does not touch the inherited olive-theme (#82795f) styling
   used elsewhere on the site. See DESIGN.md for the full rationale. --- */
:root {
  --ink: #14313B;
  --export: #94461F; /* was #B85C34: 3.6:1 on its pill, now 5.3:1 */
  --export-bg: #F3E3D8;
  --import: #4A6D8C;
  --import-bg: #DCE6EC;
  --paper: #FAF8F4;
  --paper-border: #E4DDD0;
}
.tag-pill {
  display: inline-flex; align-items: center; font-weight: 700;
  font-size: 11px; text-transform: uppercase; letter-spacing: .06em;
  padding: 4px 10px; border-radius: 999px; margin-bottom: 10px;
}
.tag-export { background: var(--export-bg); color: var(--export); }
.tag-import { background: var(--import-bg); color: var(--import); }

/* Products menu: independent rounded import and export panels. */
.custom_nav-container { position: relative; }
.megamenu-parent { position: static; }
.megamenu-panel {
  position: absolute; top: 100%; left: var(--menu-left, auto); right: 0; transform: none;
  width: min(760px, calc(100vw - 32px)); max-width: calc(100vw - 32px);
  padding: 8px 0 0; border: 0; border-radius: 0; background: transparent;
  box-shadow: none; margin-top: 0;
}
.megamenu { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
.megamenu-col { display: flex; flex-direction: column; min-width: 0; padding: 24px; background: #f8f6f2; color: #2c2c28; border: 1px solid #d8d3c4; border-radius: 18px; box-shadow: 0 16px 34px -20px rgba(44,44,40,.32); }
.megamenu-head { padding-bottom: 18px; border-bottom: 1px solid #d8d3c4; }
.megamenu-head h4 { margin: 0; font-size: 21px; font-weight: 600; letter-spacing: -.02em; }
.megamenu-head h4 a { display: flex; justify-content: space-between; align-items: center; color: #71684f; text-decoration: none; }
.megamenu-head p { margin: 7px 0 0; font-size: 12px; color: #59574f; }
.megamenu-body { flex: 1; padding-bottom: 4px; }
.megamenu-cat-link {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  font-size: 14px; font-weight: 600; color: #2c2c28; text-decoration: none;
  padding: 12px 2px; border-bottom: 1px solid #eeece3;
}
.megamenu-cat-link:last-child { border-bottom: 0; }
.megamenu-cat-link span { font-size: 12px; color: #71684f; flex-shrink: 0; }
.megamenu-cat-link.dim { color: #71684f; font-weight: 600; font-size: 13px; }
.megamenu-view-all { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 16px; border-top: 1px solid #d8d3c4; color: #71684f; font-size: 13px; font-weight: 600; text-decoration: none; }
.megamenu a:hover { color: #59513e; text-decoration: underline; text-underline-offset: 3px; }
.megamenu a:focus-visible { outline: 2px solid #71684f; outline-offset: 4px; }
@media (max-width: 991px) {
  .megamenu-panel { position: static; width: 100%; max-width: 100%; transform: none; padding: 12px 0; }
  .megamenu { grid-template-columns: 1fr; gap: 14px; }
  .megamenu-col { padding: 22px; }
}
@media (pointer: coarse) { .megamenu a { min-height: 44px; display: flex; align-items: center; } }

/* Blur page content while keeping the active popup crisp and usable. */
.popup-focus-backdrop { position: fixed; inset: 0; z-index: 999; pointer-events: none; background: rgba(44,44,40,.07); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity: 0; visibility: hidden; transition: opacity .18s ease, visibility .18s ease; }
.popup-focus-backdrop.is-visible { opacity: 1; visibility: visible; }
.navigation-popup-open .hero_area { z-index: 1000; }
@media (prefers-reduced-motion: reduce) { .popup-focus-backdrop { transition: none; } }

/* catalogue cards (category/side listing pages) */
.catalogue-card { text-align: left; justify-content: flex-start; }
.catalogue-meta { font-size: 12px; color: #6b6156; margin-top: 4px; }
.cat-section-head { display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: baseline; justify-content: space-between; margin-bottom: 14px; }
.cat-section-head h2 { margin: 0; }
.cat-section-link { font-size: 13.5px; font-weight: 600; text-decoration: none; color: var(--ink); white-space: nowrap; }
.cat-section-link:hover { text-decoration: underline; }
.side-crosslink { margin: 6px 0 0; font-size: 14px; }
.side-crosslink a { color: var(--ink); font-weight: 600; }

/* side cards (products.html, homepage) */
.side-card {
  border: 1px solid var(--paper-border); border-radius: 10px; padding: 28px; height: 100%;
  background: var(--paper); transition: transform .25s ease, box-shadow .25s ease;
}
.side-card:hover { transform: translateY(-4px); box-shadow: 0 14px 28px -14px rgba(20,49,59,.28); }
.side-card h2, .side-card h3 { margin: 0 0 8px; }
.side-card p { margin: 0; color: #58554a; }
@media (prefers-reduced-motion: reduce) { .side-card { transition: none; } .side-card:hover { transform: none; } }

/* product detail: spec table + photo-pending placeholder */
.spec-table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 14px 0 22px; }
.spec-table td:first-child { color: #6b6156; padding: 8px 12px 8px 0; white-space: nowrap; width: 1%; }
.spec-table td:last-child { padding: 8px 0; border-bottom: 1px solid var(--paper-border); }
.feature-list { list-style: none; padding: 0; margin: 0 0 18px; }
.feature-list li { font-size: 14.5px; padding: 4px 0 4px 18px; position: relative; }
.feature-list li::before { content: "-"; position: absolute; left: 0; color: var(--export); }

/* Hamburger toggler (Oct 2026). The markup has three bars (.s-1/.s-2/.s-3), but style.css
   also draws ::before/::after lines on every bar -- rules written for a single-bar
   toggler -- so it rendered as a stack of nine lines. Draw only the three real bars,
   and morph .s-1/.s-3 into a clean X when the menu is open. */
.custom_nav-container .navbar-toggler { width: 44px; height: 44px; border: 0; }
/* Flex only below the navbar-expand-lg breakpoint; at 992px+ Bootstrap hides the toggler. */
@media (max-width: 991.98px) { .custom_nav-container .navbar-toggler { display: flex; flex-direction: column; align-items: center; justify-content: center; } }
.custom_nav-container .navbar-toggler:focus { box-shadow: none; }
.custom_nav-container .navbar-toggler:focus-visible { outline: 2px solid #82795f; outline-offset: 2px; }
.custom_nav-container .navbar-toggler span { width: 28px; height: 3px; margin: 3px 0; border-radius: 3px; }
.custom_nav-container .navbar-toggler span::before,
.custom_nav-container .navbar-toggler span::after { display: none; }
.custom_nav-container .navbar-toggler[aria-expanded="true"] { transform: none; }
.custom_nav-container .navbar-toggler[aria-expanded="true"] .s-1 { margin: 0; transform: translateY(1.5px) rotate(45deg); }
.custom_nav-container .navbar-toggler[aria-expanded="true"] .s-3 { margin: 0; transform: translateY(-1.5px) rotate(-45deg); }

/* Page loader (Oct 2026) -- new-3d's PageLoader behaviour in Avinya's own colours (option A):
   paper background, the full logo in its olive, and an olive line under it that fills once,
   left to right, then holds full (it never loops). Markup: LOADER in build_site.py;
   behaviour: js/page-loader.js. The 8s fail-safe animation hides it even if every script fails. */
.site-loader { position: fixed; inset: 0; z-index: 10000; display: grid; place-items: center; background: #f8f6f2; opacity: 1; visibility: visible; transition: opacity .25s ease, visibility .25s; animation: site-loader-failsafe 0s 8s forwards; }
.site-loader.is-hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.site-loader-mark { display: flex; flex-direction: column; align-items: center; padding: 30px; }
.site-loader-mark img { width: 140px; height: auto; }
.site-loader-bar { display: block; width: 150px; height: 1.5px; margin-top: 26px; overflow: hidden; border-radius: 2px; background: #d8d3c4; }
.site-loader-bar i { display: block; width: 100%; height: 100%; background: #82795f; transform: scaleX(0); transform-origin: left center; animation: site-loader-fill 1.6s ease-out forwards; }
@keyframes site-loader-fill { to { transform: scaleX(1); } }
@keyframes site-loader-failsafe { to { opacity: 0; visibility: hidden; pointer-events: none; } }
@media (prefers-reduced-motion: reduce) { .site-loader { transition: none; } .site-loader-bar i { animation: none; transform: none; } }

/* Home header (Oct 2026) -- new-3d's Navbar: transparent over the dark hero with light text,
   solid ivory once the page scrolls past 64px or the mobile menu opens (.is-solid, toggled in
   js/navigation-menu.js). Other pages keep the white header. */
body.home-page .hero_area { min-height: 0; }
body.home-page .header_section { position: fixed; top: 0; left: 0; right: 0; z-index: 1030; background: transparent; box-shadow: none; border-bottom: 1px solid transparent; transition: background-color .5s, border-color .5s; }
body.home-page .header_section .header_bottom { background: transparent; }
body.home-page .header_section.is-solid { background: rgba(242, 235, 223, .92); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom-color: rgba(9, 14, 12, .1); }
body.home-page .custom_nav-container { min-height: 80px; }
.navbar-brand .brand-wordmark { display: flex; flex-direction: column; font-family: 'Fraunces', Georgia, serif; text-transform: uppercase; line-height: 1; white-space: nowrap; color: #f2ebdf; transition: color .5s; }
/* style.css paints every .navbar-brand span black and bold; the wordmark sets its own. */
.navbar-brand .brand-wordmark > span { font-size: 25px; font-weight: 400; letter-spacing: .16em; color: inherit; }
.brand-wordmark > small { margin-top: 6px; font-size: 8px; letter-spacing: .36em; color: #b68a40; }
.is-solid .navbar-brand .brand-wordmark { color: #0d130f; }
body.home-page .header_section .navbar-nav .nav-item .nav-link { color: #f2ebdf; }
body.home-page .header_section .navbar-nav .nav-item:hover .nav-link,
body.home-page .header_section .navbar-nav .nav-item.active .nav-link { color: #d6a64c; }
body.home-page .header_section.is-solid .navbar-nav .nav-item .nav-link { color: #0d130f; }
body.home-page .header_section.is-solid .navbar-nav .nav-item:hover .nav-link,
body.home-page .header_section.is-solid .navbar-nav .nav-item.active .nav-link { color: #82795f; }
body.home-page .header_section .navbar-toggler span { background-color: #f2ebdf; }
body.home-page .header_section.is-solid .navbar-toggler span { background-color: #000; }
body.home-page .header_section .navbar-toggler:focus-visible { outline-color: #d6a64c; }

/* --- Oct 2026 accessibility pass ---
   Text in the brand olive #82795f was 4.33:1 on white / 4.0:1 on the cream page
   background, under the WCAG AA 4.5:1 minimum. #71684f is the site's existing darker
   olive (already used on certification + product pages): 5.5:1 / 5.1:1. Only text and
   buttons-with-white-text move; olive backgrounds/decoration elsewhere are unchanged. */
a { color: #71684f; }
.custom_nav-container .navbar-nav .nav-item:hover .nav-link,
.custom_nav-container .navbar-nav .nav-item.active .nav-link,
body.home-page .header_section.is-solid .navbar-nav .nav-item:hover .nav-link,
body.home-page .header_section.is-solid .navbar-nav .nav-item.active .nav-link { color: #71684f; }
/* The homepage's translucent ivory header is darker than white, so it needs a deeper olive (5.2:1). */
body.home-page .header_section.is-solid .navbar-nav .nav-item:hover .nav-link,
body.home-page .header_section.is-solid .navbar-nav .nav-item.active .nav-link { color: #5f5745; }
.breadcrumb-item a { color: #71684f; }
.btn-inquiry { background-color: #71684f; }
.btn-inquiry-secondary { color: #71684f; border-color: #71684f; }
.btn-inquiry-secondary:hover { background-color: #71684f; }
/* Tiny "INTERNATIONAL" under the wordmark: gold reads fine on the dark hero (6:1) but
   was 2.5:1 once the header turns light on scroll. */
.is-solid .brand-wordmark > small { color: #654c1f; }

/* Skip link: hidden until a keyboard user tabs to it. */
.skip-link { position: absolute; left: 12px; top: -60px; z-index: 10000; background: #2c2c28; color: #fff; padding: 10px 16px; border-radius: 4px; font-weight: 600; transition: top .15s; }
.skip-link:focus { top: 12px; color: #fff; }
#main-content:focus { outline: none; }
/* Current-page breadcrumb (Bootstrap grey #6c757d was 4.3:1 on cream) and About buttons. */
.breadcrumb-item.active { color: #59574f; }
.av-about .av-button { background: #71684f; }

/* Logo (Oct 2026) -- the client's (TM) logo, stacked emblem + wordmark, on every page. style.css sized
   the old logo with object-fit: cover at 202x109, which would crop this one, so it is contained here.
   Home: cream copy over the dark hero, olive copy once the header turns solid. */
.brand_logo { width: auto; overflow: visible; }
.brand_logo img { width: auto; height: 92px; object-fit: contain; display: block; }
.brand_logo--home { position: relative; }
.brand_logo--home .brand-logo-dark { position: absolute; inset: 0; opacity: 0; }
.brand_logo--home img { transition: opacity .5s; }
.is-solid .brand_logo--home .brand-logo-light { opacity: 0; }
.is-solid .brand_logo--home .brand-logo-dark { opacity: 1; }
@media (max-width: 991px) { .brand_logo img { height: 72px; } }

/* Arrows (Oct 2026) -- build_site.svg_arrows() swaps every decorative arrow character for an inline
   SVG (iOS showed them as blue emoji tiles). Sized in em so they follow the text around them. */
.arw { display: inline-flex; vertical-align: -0.12em; line-height: 1; }
.arw-svg { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s ease; }
a:hover .arw-ne .arw-svg, a:focus-visible .arw-ne .arw-svg, a:active .arw-ne .arw-svg { transform: translate(2px, -2px); }
a:hover .arw-sw .arw-svg, a:focus-visible .arw-sw .arw-svg, a:active .arw-sw .arw-svg { transform: translate(-2px, 2px); }
/* Touch screens have no hover, so the round "explore" buttons get a slow idle nudge instead. */
@keyframes arw-nudge { 0%, 70%, 100% { transform: translate(0, 0); } 80% { transform: translate(3px, -3px); } 90% { transform: translate(0, 0); } }
@media (hover: none) {
  .mh-round-link .arw-svg, .mh-product-arrow .arw-svg, .mh-photo-arrow .arw-svg { animation: arw-nudge 3.2s ease-in-out infinite; }
  .mh-round-link:active { background: var(--mh-gold, #c9b27c); color: var(--mh-ink, #16150f); }
}
@media (prefers-reduced-motion: reduce) { .arw-svg { transition: none; animation: none !important; } }

/* Footer (Oct 2026) -- logo in place of the company-name heading; on phones the two link lists sit
   side by side instead of one long column, and the copyright clears the floating WhatsApp button. */
.info_section .footer-brand { margin: 0 0 12px; }
.info_section .footer-brand img { height: 74px; width: auto; display: block; }
@media (max-width: 767px) {
  .info_section .row { display: grid; grid-template-columns: 1fr 1fr; column-gap: 18px; margin: 0; }
  .info_section .row > .info_col { width: auto; max-width: none; padding: 0; margin-bottom: 22px; }
  .info_section .row > .info_col:first-child, .info_section .row > .info_col:last-child { grid-column: 1 / -1; }
  .info_section .footer-brand img { height: 64px; }
  .info_section .info_detail p { font-size: 13.5px; line-height: 1.6; max-width: 40ch; }
  .info_section .info_links a { min-height: 30px; margin-bottom: 2px; font-size: 14px; }
  .info_section .row > .info_col:last-child { padding-top: 18px; border-top: 1px solid rgba(255,255,255,.18); }
  .info_section .info_contact .contact_link_box a, .info_section .footer-phones { font-size: 13.5px; line-height: 1.55; }
  .footer_copyright { padding-bottom: 84px; font-size: 11.5px; }
}

/* Catalogue listings on phones (Oct 2026): two cards per row instead of one full-width card each
   (export.html was ~14,500px tall at 390px wide). */
@media (max-width: 767px) {
  .row > .col-md-4:has(> a > .catalogue-card) { flex: 0 0 50%; max-width: 50%; padding-left: 6px; padding-right: 6px; margin-bottom: 12px !important; }
  .catalogue-card { padding: 8px; }
  .catalogue-card .h4 { font-size: 15px; line-height: 1.3; margin: 2px 0 4px; overflow-wrap: break-word; hyphens: auto; } /* h2 on category pages, h3 elsewhere */
  .catalogue-card .catalogue-meta { font-size: 11px; line-height: 1.4; }
}
/* Tablets (Oct 2026): 3-4 cards per row are only ~160-220px wide, so 24px titles wrapped to 3-4 lines. */
@media (min-width: 768px) and (max-width: 1199px) {
  .catalogue-card .h4 { font-size: 17px; line-height: 1.3; overflow-wrap: break-word; hyphens: auto; }
}

/* Mobile menu scroll (Oct 2026) -- on the home page the header is position: fixed, so once Products
   was opened the menu (~1,200px) ran past the bottom of the screen and could not be scrolled.
   The open menu now scrolls inside itself, on every page, below the desktop breakpoint. */
@media (max-width: 991px) {
  .header_section .navbar-collapse.show, .header_section .navbar-collapse.collapsing {
    max-height: calc(100vh - 90px); max-height: calc(100dvh - 90px);
    overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  }
}

/* Phone/tablet product menu (Oct 2026, option C) -- Export and Import as two compact boxes, each
   category a wrapping chip, so the open menu fits on one screen. Desktop keeps the mega-menu cards. */
.megamenu-mobile { display: none; }
@media (max-width: 991px) {
  .megamenu-col > .megamenu-head, .megamenu-col > .megamenu-body, .megamenu-col > .megamenu-view-all { display: none; }
  .megamenu-mobile { display: block; }
  .megamenu { gap: 10px; }
  .megamenu-panel { padding: 6px 0 10px; }
  .megamenu-col { padding: 14px 14px 15px; border-radius: 14px; text-align: left; box-shadow: 0 10px 22px -18px rgba(44,44,40,.35); }
  .mm-chip-head { display: flex; align-items: center; gap: 8px; margin-bottom: 11px; }
  .mm-tag { font-size: 10px; font-weight: 700; letter-spacing: .08em; padding: 4px 9px; border-radius: 999px; }
  .mm-chip-sub { font-size: 14px; font-weight: 600; color: #2c2c28; }
  .megamenu .mm-chip-head a { margin-left: auto; font-size: 12px; font-weight: 600; color: #71684f; text-decoration: none; min-height: 0; display: inline; }
  .mm-chips { display: flex; flex-wrap: wrap; gap: 7px; }
  .megamenu .mm-chips a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 13px; font-size: 13px; color: #2c2c28; background: #fff; border: 1px solid #d8d3c4; border-radius: 999px; text-decoration: none; }
  .megamenu .mm-chips a:active, .megamenu .mm-chips a:hover { border-color: #82795f; color: #59513e; text-decoration: none; }
}

/* Back-to-top (Oct 2026) -- olive circle centred above the WhatsApp button; fades in after scrolling
   1.5 screens. Toggled by the small script in SCRIPTS (build_site.py). */
.back-to-top { position: fixed; z-index: 999; right: 31px; bottom: 94px; width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.35); background: #71684f; color: #fff;
  box-shadow: 0 8px 20px -6px rgba(44,44,40,.45); cursor: pointer;
  opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .25s ease, transform .25s ease, visibility .25s, background .2s; }
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.back-to-top:hover { background: #59513e; }
.back-to-top:focus-visible { outline: 2px solid #2c2c28; outline-offset: 3px; }
.back-to-top svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.back-to-top:hover svg { transform: translateY(-2px); }
@media (max-width: 767px) { .back-to-top { right: 20px; bottom: 76px; width: 42px; height: 42px; } }
@media (prefers-reduced-motion: reduce) { .back-to-top, .back-to-top svg { transition: none; } }

/* Legal pages (privacy.html) */
.legal-page { max-width: 780px; font-family: 'Open Sans', sans-serif; color: #2c2c28; }
.legal-page .legal-updated { color: #71684f; font-size: 13px; margin: 6px 0 28px; }
.legal-page h2 { font-size: 19px; font-weight: 700; margin: 34px 0 8px; color: #2c2c28; }
.legal-page p, .legal-page li { color: #59574f; font-size: 15px; line-height: 1.8; }
.legal-page ul { padding-left: 20px; margin: 0 0 14px; }
.legal-page a { color: #59513e; text-decoration: underline; text-underline-offset: 3px; }

/* ICONS-START (generated by scripts/build_icons.py - do not edit by hand) */
/* The 9 Font Awesome 4.7 icons this site uses (Font Awesome by Dave Gandy, font under SIL OFL 1.1),
   drawn from their own glyph outlines as SVG masks. line-height 0 removes the text strut and the box
   hangs 0.142857em below the baseline, exactly as the glyph's em box did, so nothing moves. */
.fa { display: inline-block; font-size: inherit; line-height: 0; }
.fa::before { content: ""; display: inline-block; height: 1em; vertical-align: -0.142857em;
  /* browsers lay text out on whole-pixel ascent/descent; round the same way so the icon sits where the glyph did */
  vertical-align: calc(-1 * round(0.142857em, 1px));
  background-color: currentColor; -webkit-mask: var(--fa-icon) center / 100% 100% no-repeat; mask: var(--fa-icon) center / 100% 100% no-repeat; }
@media (forced-colors: active) { .fa::before { background-color: CanvasText; } }
.fa-envelope::before { width: 1em; --fa-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1792 1792'%3E%3Cpath d='M1792 710V1504Q1792 1570 1745.0 1617.0Q1698 1664 1632 1664H160Q94 1664 47.0 1617.0Q0 1570 0 1504V710Q44 759 101 797Q463 1043 598 1142Q655 1184 690.5 1207.5Q726 1231 785.0 1255.5Q844 1280 895 1280H896H897Q948 1280 1007.0 1255.5Q1066 1231 1101.5 1207.5Q1137 1184 1194 1142Q1364 1019 1692 797Q1749 758 1792 710ZM1792 416Q1792 495 1743.0 567.0Q1694 639 1621 690Q1245 951 1153 1015Q1143 1022 1110.5 1045.5Q1078 1069 1056.5 1083.5Q1035 1098 1004.5 1116.0Q974 1134 947.0 1143.0Q920 1152 897 1152H896H895Q872 1152 845.0 1143.0Q818 1134 787.5 1116.0Q757 1098 735.5 1083.5Q714 1069 681.5 1045.5Q649 1022 639 1015Q548 951 377.0 832.5Q206 714 172 690Q110 648 55.0 574.5Q0 501 0 438Q0 360 41.5 308.0Q83 256 160 256H1632Q1697 256 1744.5 303.0Q1792 350 1792 416Z'/%3E%3C/svg%3E"); }
.fa-whatsapp::before { width: 0.857143em; --fa-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1536 1792'%3E%3Cpath d='M1172 1071Q1174 1076 1174 1086Q1174 1119 1157 1162Q1141 1201 1086.0 1227.5Q1031 1254 984 1254Q927 1254 794 1192Q696 1147 624.0 1074.0Q552 1001 476 889Q404 782 405 695V687Q408 596 479 529Q503 507 531 507Q537 507 549.0 508.5Q561 510 568 510Q587 510 594.5 516.5Q602 523 610 544Q618 564 643.0 632.0Q668 700 668 707Q668 728 633.5 764.5Q599 801 599 811Q599 818 604 826Q638 899 706 963Q762 1016 857 1064Q869 1071 879 1071Q894 1071 933.0 1022.5Q972 974 985.0 974.0Q998 974 1082.5 1018.0Q1167 1062 1172 1071ZM782 1504Q909 1504 1025.5 1454.0Q1142 1404 1226.0 1320.0Q1310 1236 1360.0 1119.5Q1410 1003 1410.0 876.0Q1410 749 1360.0 632.5Q1310 516 1226.0 432.0Q1142 348 1025.5 298.0Q909 248 782.0 248.0Q655 248 538.5 298.0Q422 348 338.0 432.0Q254 516 204.0 632.5Q154 749 154 876Q154 1079 274 1244L195 1477L437 1400Q595 1504 782 1504ZM782 1630Q587 1630 417 1536L0 1670L136 1265Q28 1087 28 876Q28 723 88.0 583.5Q148 444 249.0 343.0Q350 242 489.5 182.0Q629 122 782.0 122.0Q935 122 1074.5 182.0Q1214 242 1315.0 343.0Q1416 444 1476.0 583.5Q1536 723 1536.0 876.0Q1536 1029 1476.0 1168.5Q1416 1308 1315.0 1409.0Q1214 1510 1074.5 1570.0Q935 1630 782 1630Z'/%3E%3C/svg%3E"); }
.fa-phone::before { width: 0.785714em; --fa-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1408 1792'%3E%3Cpath d='M1408 1240Q1408 1267 1398.0 1310.5Q1388 1354 1377 1379Q1356 1429 1255 1485Q1161 1536 1069 1536Q1042 1536 1016.0 1532.5Q990 1529 958.5 1520.0Q927 1511 911.5 1505.5Q896 1500 856.0 1485.0Q816 1470 807 1467Q709 1432 632 1384Q505 1305 368.0 1168.0Q231 1031 152 904Q104 827 69 729Q66 720 51.0 680.0Q36 640 30.5 624.5Q25 609 16.0 577.5Q7 546 3.5 520.0Q0 494 0 467Q0 375 51 281Q107 180 157 159Q182 148 225.5 138.0Q269 128 296 128Q310 128 317 131Q335 137 370 207Q381 226 400.0 261.0Q419 296 435.0 324.5Q451 353 466 378Q469 382 483.5 403.0Q498 424 505.0 438.5Q512 453 512 467Q512 487 483.5 517.0Q455 547 421.5 572.0Q388 597 359.5 625.0Q331 653 331 671Q331 680 336.0 693.5Q341 707 344.5 714.0Q348 721 358.5 738.0Q369 755 370 757Q446 894 544.0 992.0Q642 1090 779 1166Q781 1167 798.0 1177.5Q815 1188 822.0 1191.5Q829 1195 842.5 1200.0Q856 1205 865 1205Q883 1205 911.0 1176.5Q939 1148 964.0 1114.5Q989 1081 1019.0 1052.5Q1049 1024 1069 1024Q1083 1024 1097.5 1031.0Q1112 1038 1133.0 1052.5Q1154 1067 1158 1070Q1183 1085 1211.5 1101.0Q1240 1117 1275.0 1136.0Q1310 1155 1329 1166Q1399 1201 1405 1219Q1408 1226 1408 1240Z'/%3E%3C/svg%3E"); }
.fa-map-marker::before { width: 0.571429em; --fa-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1792'%3E%3Cpath d='M693.0 821.0Q768 746 768.0 640.0Q768 534 693.0 459.0Q618 384 512.0 384.0Q406 384 331.0 459.0Q256 534 256.0 640.0Q256 746 331.0 821.0Q406 896 512.0 896.0Q618 896 693.0 821.0ZM1024 640Q1024 749 991 819L627 1593Q611 1626 579.5 1645.0Q548 1664 512.0 1664.0Q476 1664 444.5 1645.0Q413 1626 398 1593L33 819Q0 749 0 640Q0 428 150.0 278.0Q300 128 512.0 128.0Q724 128 874.0 278.0Q1024 428 1024 640Z'/%3E%3C/svg%3E"); }
.fa-linkedin::before { width: 0.857143em; --fa-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1536 1792'%3E%3Cpath d='M349 625V1616H19V625ZM370 319Q371 392 319.5 441.0Q268 490 184 490H182Q100 490 50.0 441.0Q0 392 0 319Q0 245 51.5 196.5Q103 148 186.0 148.0Q269 148 319.0 196.5Q369 245 370 319ZM1536 1048V1616H1207V1086Q1207 981 1166.5 921.5Q1126 862 1040 862Q977 862 934.5 896.5Q892 931 871 982Q860 1012 860 1063V1616H531Q533 1217 533.0 969.0Q533 721 532 673L531 625H860V769H858Q878 737 899.0 713.0Q920 689 955.5 661.0Q991 633 1042.5 617.5Q1094 602 1157 602Q1328 602 1432.0 715.5Q1536 829 1536 1048Z'/%3E%3C/svg%3E"); }
.fa-instagram::before { width: 0.857143em; --fa-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1536 1792'%3E%3Cpath d='M949.0 1077.0Q1024 1002 1024.0 896.0Q1024 790 949.0 715.0Q874 640 768.0 640.0Q662 640 587.0 715.0Q512 790 512.0 896.0Q512 1002 587.0 1077.0Q662 1152 768.0 1152.0Q874 1152 949.0 1077.0ZM1047.0 617.0Q1162 732 1162.0 896.0Q1162 1060 1047.0 1175.0Q932 1290 768.0 1290.0Q604 1290 489.0 1175.0Q374 1060 374.0 896.0Q374 732 489.0 617.0Q604 502 768.0 502.0Q932 502 1047.0 617.0ZM1243.0 421.0Q1270 448 1270.0 486.0Q1270 524 1243.0 551.0Q1216 578 1178.0 578.0Q1140 578 1113.0 551.0Q1086 524 1086.0 486.0Q1086 448 1113.0 421.0Q1140 394 1178.0 394.0Q1216 394 1243.0 421.0ZM315 297Q265 317 227.0 355.0Q189 393 169 443Q158 472 150.5 514.5Q143 557 140.5 617.5Q138 678 137.5 714.0Q137 750 137.5 819.5Q138 889 138.0 896.0Q138 903 137.5 972.5Q137 1042 137.5 1078.0Q138 1114 140.5 1174.5Q143 1235 150.5 1277.5Q158 1320 169 1349Q189 1399 227.0 1437.0Q265 1475 315 1495Q344 1506 386.5 1513.5Q429 1521 489.5 1523.5Q550 1526 586.0 1526.5Q622 1527 691.5 1526.5Q761 1526 768.0 1526.0Q775 1526 844.5 1526.5Q914 1527 950.0 1526.5Q986 1526 1046.5 1523.5Q1107 1521 1149.5 1513.5Q1192 1506 1221 1495Q1271 1475 1309.0 1437.0Q1347 1399 1367 1349Q1378 1320 1385.5 1277.5Q1393 1235 1395.5 1174.5Q1398 1114 1398.5 1078.0Q1399 1042 1398.5 972.5Q1398 903 1398.0 896.0Q1398 889 1398.5 819.5Q1399 750 1398.5 714.0Q1398 678 1395.5 617.5Q1393 557 1385.5 514.5Q1378 472 1367 443Q1347 393 1309.0 355.0Q1271 317 1221 297Q1192 286 1149.5 278.5Q1107 271 1046.5 268.5Q986 266 950.0 265.5Q914 265 844.5 265.5Q775 266 768.0 266.0Q761 266 691.5 265.5Q622 265 586.0 265.5Q550 266 489.5 268.5Q429 271 386.5 278.5Q344 286 315 297ZM1531 1213Q1521 1421 1407.0 1535.0Q1293 1649 1085 1659Q997 1664 768.0 1664.0Q539 1664 451 1659Q243 1649 129.0 1535.0Q15 1421 5 1213Q0 1125 0.0 896.0Q0 667 5 579Q15 371 129.0 257.0Q243 143 451 133Q539 128 768.0 128.0Q997 128 1085 133Q1293 143 1407.0 257.0Q1521 371 1531 579Q1536 667 1536.0 896.0Q1536 1125 1531 1213Z'/%3E%3C/svg%3E"); }
.fa-facebook::before { width: 0.571429em; --fa-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1792'%3E%3Cpath d='M959 12V276H802Q716 276 686.0 312.0Q656 348 656 420V609H949L910 905H656V1664H350V905H95V609H350V391Q350 205 454.0 102.5Q558 0 731 0Q878 0 959 12Z'/%3E%3C/svg%3E"); }
.fa-copy::before { width: 1em; --fa-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1792 1792'%3E%3Cpath d='M1696 384Q1736 384 1764.0 412.0Q1792 440 1792 480V1696Q1792 1736 1764.0 1764.0Q1736 1792 1696 1792H736Q696 1792 668.0 1764.0Q640 1736 640 1696V1408H96Q56 1408 28.0 1380.0Q0 1352 0 1312V640Q0 600 20.0 552.0Q40 504 68 476L476 68Q504 40 552.0 20.0Q600 0 640 0H1056Q1096 0 1124.0 28.0Q1152 56 1152 96V424Q1220 384 1280 384ZM1152 597 853 896H1152ZM512 213 213 512H512ZM708 860 1024 544V128H640V544Q640 584 612.0 612.0Q584 640 544 640H128V1280H640V1024Q640 984 660.0 936.0Q680 888 708 860ZM1664 1664V512H1280V928Q1280 968 1252.0 996.0Q1224 1024 1184 1024H768V1664Z'/%3E%3C/svg%3E"); }
.fa-check-circle::before { width: 0.857143em; --fa-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1536 1792'%3E%3Cpath d='M1284 734Q1284 706 1266 688L1175 598Q1156 579 1130.0 579.0Q1104 579 1085 598L677 1005L451 779Q432 760 406.0 760.0Q380 760 361 779L270 869Q252 887 252 915Q252 942 270 960L632 1322Q651 1341 677 1341Q704 1341 723 1322L1266 779Q1284 761 1284 734ZM1433.0 510.5Q1536 687 1536.0 896.0Q1536 1105 1433.0 1281.5Q1330 1458 1153.5 1561.0Q977 1664 768.0 1664.0Q559 1664 382.5 1561.0Q206 1458 103.0 1281.5Q0 1105 0.0 896.0Q0 687 103.0 510.5Q206 334 382.5 231.0Q559 128 768.0 128.0Q977 128 1153.5 231.0Q1330 334 1433.0 510.5Z'/%3E%3C/svg%3E"); }
/* ICONS-END */