/*
 * Export page styles, extracted from "Export.dc.html".
 *
 * Generated by tools/extract-page.php. The numbered classes below are the design's
 * inline styles lifted verbatim, one class per unique declaration block, so the
 * computed result is identical while the markup stays free of style attributes the
 * Content-Security-Policy would drop.
 */

/* Page canvas. The 1440px cap is deliberately absent: full-width bands reach the
   viewport edge, and each section holds its own content on the --content-max grid. */
.export-s01 {
  position: relative;
  width: 100%;
  margin: 0 auto;
  background: var(--cream);
  overflow: hidden;
}

.export-s02 {
  position: relative;
  padding: 150px 48px 20px;
  text-align: center;
  background: var(--cream);
  overflow: hidden;
}

.export-s03 {
  position: absolute;
  top: 104px;
  left: 63%;
  width: 118px;
  opacity: .2;
  transform: rotate(10deg);
  pointer-events: none;
}

.export-s04 {
  max-width: 940px;
  margin: 0 auto;
  animation: govRise .7s ease both;
  position: relative;
}

.export-s05 {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .34em;
  color: var(--gold-text);
}

.export-s06 {
  width: 22px;
  height: 1px;
  background: rgba(201,162,75,.55);
}

.export-s07 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: clamp(46px,6.6vw,92px);
  line-height: 1.02;
  letter-spacing: -.01em;
  color: var(--blue-deep);
  margin: 22px 0 0;
}

.export-s08 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: clamp(18px,2vw,22px);
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 680px;
  margin: 20px auto 0;
}

.export-s09 {
  position: relative;
  padding: 14px 48px 90px;
  background: var(--cream);
}

.export-s10 {
  max-width: calc(1200px * var(--container-scale));
  margin: 0 auto;
}

.export-s11 {
  display: flex;
  gap: 12px;
  justify-content: center;
  margin-bottom: 40px;
}

.export-s12 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 14.5px;
  color: var(--ink);
  background: #fff;
  border: 1px solid rgba(201,162,75,.4);
  padding: 12px 26px;
  border-radius: 999px;
}

.export-s13 {
  position: relative;
  overflow: hidden;
  background: linear-gradient(130deg,#16307F 0%,#1B46C2 58%,#2A57E0 100%);
  border-radius: 16px;
  padding: 40px 44px 38px;
  margin-bottom: 44px;
  box-shadow: 0 22px 54px rgba(22,48,127,.24);
}
/* Anchored to the band's top right corner. The design pinned it at a fixed
   left offset, which drifted toward the middle as the container widened. */
.export-s14 {
  position: absolute;
  top: 16px;
  right: 26px;
  left: auto;
  width: 150px;
  opacity: .16;
  transform: rotate(-8deg);
  pointer-events: none;
}

.export-s15 {
  position: relative;
  max-width: 660px;
}

.export-s16 {
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--gold-lite);
  margin-bottom: 12px;
}

.export-s17 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: clamp(26px,3vw,40px);
  line-height: 1.05;
  color: #fff;
  margin: 0;
}

.export-s18 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 16px;
  line-height: 1.6;
  color: rgba(255,255,255,.82);
  margin: 12px 0 0;
}

.export-s19 {
  display: flex;
  gap: 10px;
  margin-top: 22px;
  max-width: 540px;
}

.export-s20 {
  position: relative;
  flex: 1;
}

.export-s21 {
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.export-s22 {
  width: 100%;
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 15px;
  color: var(--ink);
  background: #fff;
  border: none;
  border-radius: 999px;
  padding: 15px 18px 15px 44px;
}

.export-s23 {
  flex: none;
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 14.5px;
  color: var(--blue-deep);
  background: #ef9c2e;
  border: none;
  border-radius: 999px;
  padding: 0 26px;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(239,156,46,.4);
  /*
   * At desktop the button stretches to the search field's 48px. Once the row wraps it
   * has only its line box to stand on and collapses to 17px, under the 24px minimum in
   * WCAG 2.2 SC 2.5.8. This floor changes nothing above the wrap.
   */
  min-height: 48px;
}

.export-s24 {
  margin-top: 16px;
  min-height: 26px;
}

.export-s25 {
  margin-bottom: 48px;
}

.export-s26 {
  max-width: 760px;
  margin: 0 auto 30px;
  text-align: center;
}

.export-s27 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: clamp(26px,2.9vw,38px);
  line-height: 1.06;
  letter-spacing: -.005em;
  color: var(--blue-deep);
  margin: 0;
}

.export-s28 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 16.5px;
  line-height: 1.7;
  color: var(--ink-soft);
  margin: 16px 0 0;
  text-wrap: pretty;
}

.export-s29 {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
  margin-bottom: 16px;
}

.export-s30 {
  width: 26px;
  height: 1.5px;
  background: var(--gold-dark);
}

.export-s31 {
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-text);
}

.export-s32 {
  position: relative;
  overflow: hidden;
  border-top: 1px solid rgba(201,162,75,.3);
  border-bottom: 1px solid rgba(201,162,75,.3);
  padding: 18px 0;
  -webkit-mask-image: linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image: linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}

.export-s33 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 76px;
  min-width: 150px;
  margin: 0 12px;
  padding: 0 22px;
  background: #fff;
  border: 1px solid rgba(201,162,75,.24);
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(36,28,18,.06);
}

.export-s34 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 44px;
  align-items: center;
  margin-bottom: 52px;
}

.export-s35 {
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-text);
  margin-bottom: 16px;
}

.export-s36 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 17px;
  line-height: 1.72;
  color: var(--ink);
  margin: 0;
  /* Uncapped, this paragraph inherited its container and grew with it, reaching past a
     hundred characters a line on a wide monitor. Matches the measure used by the copy
     block above it. */
  max-width: 760px;
}

.export-s37 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.export-s38 {
  position: relative;
  background: #fff;
  border: 1px solid rgba(201,162,75,.28);
  border-radius: 14px;
  padding: 28px 24px 24px;
  box-shadow: 0 10px 30px rgba(36,28,18,.07);
  overflow: hidden;
}

.export-s39 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg,var(--gold-dark),var(--gold-lite));
}

.export-s40 {
  font-family: 'Anton',sans-serif;
  font-size: 54px;
  line-height: .85;
  color: var(--blue-deep);
  letter-spacing: .01em;
}

.export-s41 {
  font-family: 'Bricolage Grotesque';
  font-weight: 600;
  font-size: 13.5px;
  color: var(--ink-soft);
  margin-top: 12px;
}

.export-s42 {
  background: #fff;
  border: 1px solid rgba(201,162,75,.28);
  border-radius: 12px;
  padding: 34px 34px 30px;
  box-shadow: 0 16px 44px rgba(36,28,18,.08);
}

.export-s43 {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 22px;
}

.export-s44 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: clamp(24px,2.6vw,32px);
  line-height: 1.05;
  color: var(--blue-deep);
  margin: 0;
}

.export-s45 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 15px;
  color: var(--ink-soft);
  margin: 8px 0 0;
}

.export-s46 {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.export-s47 {
  display: flex;
  align-items: center;
  gap: 8px;
}

.export-s48 {
  width: 16px;
  height: 16px;
  border-radius: 4px;
  background: var(--gold);
  display: inline-block;
}

.export-s49 {
  font-family: 'Bricolage Grotesque';
  font-weight: 600;
  font-size: 13px;
  color: var(--ink-soft);
}

.export-s50 {
  width: 16px;
  height: 16px;
  border-radius: 4px;
  background: #E9DDC4;
  display: inline-block;
}

.export-s51 {
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid rgba(201,162,75,.3);
}

.export-s52 {
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-text);
  margin-bottom: 14px;
}

.export-s53 {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.export-s54 {
  font-family: 'Bricolage Grotesque';
  font-weight: 600;
  font-size: 13.5px;
  color: var(--ink);
  background: var(--cream-2);
  border: 1px solid rgba(201,162,75,.35);
  padding: 7px 15px;
  border-radius: 999px;
}

.export-s55 {
  max-width: 620px;
  margin: 56px 0 0;
}

.export-s56 {
  border-top: 1px solid rgba(201,162,75,.3);
}

.export-s57 {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 0;
  font-family: 'Bricolage Grotesque';
  font-weight: 600;
  font-size: 14.5px;
  color: var(--ink);
}

.export-s58 {
  flex: none;
  font-size: 18px;
  color: var(--gold-text);
  transition: transform .25s ease;
}

.export-s59 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 14px;
  color: var(--ink-soft);
  line-height: 1.6;
  padding: 0 0 18px;
}

.export-s60 {
  border-top: 1px solid rgba(201,162,75,.3);
  border-bottom: 1px solid rgba(201,162,75,.3);
}

.export-s61 {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 48px;
  align-items: start;
}

.export-s62 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: clamp(28px,3.2vw,42px);
  line-height: 1.05;
  color: var(--blue-deep);
  margin: 0 0 18px;
}

.export-s63 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 16.5px;
  line-height: 1.7;
  color: var(--ink-soft);
  margin: 0 0 26px;
}

.export-s64 {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.export-s65 {
  display: flex;
  align-items: center;
  gap: 12px;
}

.export-s66 {
  flex: none;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--cream-2);
  border: 1px solid rgba(201,162,75,.35);
  display: flex;
  align-items: center;
  justify-content: center;
}

.export-s67 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 14.5px;
  color: var(--ink);
}

.export-s68 {
  font-family: 'Bricolage Grotesque';
  font-weight: 600;
  font-size: 14px;
  color: var(--blue-deep);
  text-decoration: none;
}

.export-s69 {
  font-family: 'Bricolage Grotesque';
  font-weight: 600;
  font-size: 14px;
  color: var(--ink-soft);
}

.export-s70 {
  background: #fff;
  border: 1px solid rgba(201,162,75,.28);
  border-radius: 12px;
  padding: 34px 34px 36px;
  box-shadow: 0 16px 44px rgba(36,28,18,.08);
}

.export-s71 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
}

.export-s72 {
  width: 100%;
  font-family: 'Bricolage Grotesque';
  font-size: 14.5px;
  color: var(--ink);
  background: var(--cream);
  border: 1px solid rgba(201,162,75,.4);
  border-radius: 8px;
  padding: 13px 14px;
}

.export-s73 {
  grid-column: 1 / -1;
  width: 100%;
  font-family: 'Bricolage Grotesque';
  font-size: 14.5px;
  color: var(--ink);
  background: var(--cream);
  border: 1px solid rgba(201,162,75,.4);
  border-radius: 8px;
  padding: 13px 14px;
  resize: vertical;
}

.export-s74 {
  margin-top: 22px;
  width: 100%;
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 15px;
  color: #fff;
  background: var(--blue);
  border: none;
  padding: 14px 22px;
  border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(27,70,194,.28);
}

.export-s75 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 12.5px;
  color: var(--ink-soft);
  text-align: center;
  margin: 14px 0 0;
}

.export-s76 {
  display: none;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 26px 10px;
}

.export-s77 {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: rgba(31,138,91,.12);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}

.export-s78 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 24px;
  color: var(--blue-deep);
}

.export-s79 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 340px;
  margin: 10px 0 0;
}

.export-s80 {
  max-width: 860px;
  margin: 0 auto;
  text-align: center;
}

.export-s81 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: clamp(28px,3.4vw,44px);
  line-height: 1.08;
  color: var(--blue-deep);
  margin: 0 0 30px;
}

.export-s82 {
  max-width: 820px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid rgba(201,162,75,.28);
  border-radius: 12px;
  padding: 44px 48px 46px;
  box-shadow: 0 16px 44px rgba(36,28,18,.08);
}

.export-s83 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 17px;
  line-height: 1.8;
  color: var(--ink);
  margin: 0 0 20px;
}

.export-s84 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 17px;
  line-height: 1.8;
  color: var(--ink);
  margin: 0 0 26px;
}

.export-s85 {
  padding: 22px 26px;
  background: var(--cream-2);
  border-left: 4px solid var(--gold);
  border-radius: 6px;
}

.export-s86 {
  font-family: 'Bricolage Grotesque';
  font-weight: 600;
  font-size: 19px;
  line-height: 1.5;
  color: var(--blue-deep);
  margin: 0;
  font-style: italic;
}

.export-s87 {
  max-width: 820px;
  margin: 26px auto 0;
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 14px;
}

.export-s88 {
  background: #fff;
  border: 1px solid rgba(201,162,75,.28);
  border-radius: 12px;
  padding: 22px 18px 20px;
  box-shadow: 0 10px 26px rgba(36,28,18,.06);
}

.export-s89 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: var(--cream-2);
  font-family: 'Anton',sans-serif;
  font-size: 16px;
  color: var(--gold-text);
  margin-bottom: 12px;
}

.export-s90 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 14px;
  color: var(--blue-deep);
}

.export-s91 {
  font-family: 'Bricolage Grotesque';
  font-weight: 500;
  font-size: 12px;
  line-height: 1.45;
  color: var(--ink-soft);
  margin-top: 5px;
}

.export-s92 {
  position: fixed;
  right: 26px;
  bottom: 26px;
  z-index: 130;
  display: flex;
  align-items: center;
  gap: 14px;
  max-width: 308px;
  background: var(--cream);
  border: 1px solid rgba(201,162,75,.42);
  border-radius: 18px;
  padding: 15px 20px;
  box-shadow: 0 14px 40px rgba(36,28,18,.18);
  text-decoration: none;
}

.export-s93 {
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold-text);
}

.export-s94 {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 16.5px;
  line-height: 1.12;
  color: var(--blue-deep);
  margin-top: 3px;
}

.export-s95 {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--blue-deep);
  color: #fff;
  font-size: 19px;
  line-height: 1;
  transition: transform .25s ease;
}

.export-s96 {
  position: fixed;
  right: 18px;
  bottom: 92px;
  z-index: 131;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--ink);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Bricolage Grotesque';
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0,0,0,.25);
/* --------------------------------------------------------------------------
 * From the design's own <style> block and any <style> element hoisted out of
 * the page body. Tokens, the reset, the nav and the mobile drawer are omitted;
 * base.css already provides them.
 * ----------------------------------------------------------------------- */

}

/* ----------------------------------------------------------------------------
 * From the design's own <style> block. Review and trim: tokens, keyframes, the
 * nav and the mobile drawer are already in base.css.
 * -------------------------------------------------------------------------- */

a{color:var(--blue-deep);}
a:hover{color:var(--blue-bright);}
@keyframes govRise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
.about-menu:hover .about-panel{opacity:1!important;visibility:visible!important;transform:translateY(0)!important;pointer-events:auto!important;}
.gov-menu:hover .gov-panel{opacity:1!important;visibility:visible!important;transform:translateY(0)!important;pointer-events:auto!important;}
.brands-menu:hover .brands-panel{opacity:1!important;visibility:visible!important;transform:translateY(0)!important;pointer-events:auto!important;}
.people-menu:hover .people-panel{opacity:1!important;visibility:visible!important;transform:translateY(0)!important;pointer-events:auto!important;}
.ab-row{transition:background .16s ease,padding-left .16s ease;}
.ab-row:hover{background:rgba(201,162,75,.1)!important;padding-left:14px!important;}
.gov-link{transition:color .16s ease;}
.gov-link:hover{color:var(--blue-deep)!important;}
.gov-card:hover{transform:translateY(-3px)!important;box-shadow:0 20px 38px rgba(12,20,40,.16)!important;}
.bcol a{transition:color .16s ease,padding-left .16s ease;}
.bcol a:hover{color:var(--blue-deep)!important;padding-left:4px!important;}
.brand-chip{transition:background .18s ease,color .18s ease,border-color .18s ease;}
.brand-chip:hover{background:var(--blue-deep)!important;color:#fff!important;border-color:var(--blue-deep)!important;}

/* tabs */
.tab-btn{transition:color .2s ease,background .2s ease,border-color .2s ease;cursor:pointer;}
.tab-btn.is-active{color:#fff!important;background:var(--blue-deep)!important;border-color:var(--blue-deep)!important;box-shadow:0 10px 24px rgba(22,48,127,.24);}
.tabpanel{display:none;}
.tabpanel.is-shown{display:block;animation:govRise .5s ease both;}
details summary::-webkit-details-marker{display:none;}
details[open] .faq-x{transform:rotate(45deg);}

/* map */
#wmap{position:relative;}
#wmap svg{width:100%;height:auto;display:block;}
#wmap svg path{fill:#E9DDC4;stroke:#FBF5E9;stroke-width:.4;transition:fill .22s ease;}
#wmap svg #us,#wmap svg #us path,#wmap svg #ca,#wmap svg #ca path,#wmap svg #gb,#wmap svg #gb path,#wmap svg #ie,#wmap svg #ie path,#wmap svg #de,#wmap svg #de path,#wmap svg #it,#wmap svg #it path,#wmap svg #be,#wmap svg #be path,#wmap svg #nl,#wmap svg #nl path,#wmap svg #gr,#wmap svg #gr path,#wmap svg #lb,#wmap svg #lb path,#wmap svg #sa,#wmap svg #sa path,#wmap svg #ae,#wmap svg #ae path,#wmap svg #om,#wmap svg #om path,#wmap svg #qa,#wmap svg #qa path,#wmap svg #ir,#wmap svg #ir path,#wmap svg #af,#wmap svg #af path,#wmap svg #ng,#wmap svg #ng path,#wmap svg #za,#wmap svg #za path,#wmap svg #au,#wmap svg #au path,#wmap svg #nz,#wmap svg #nz path,#wmap svg #kr,#wmap svg #kr path,#wmap svg #fr>path:first-child{fill:var(--gold)!important;}
#wmap svg #fr>path:not(:first-child){fill:#E9DDC4!important;pointer-events:none;}
#wmap svg #us:hover,#wmap svg #us:hover path,#wmap svg #ca:hover,#wmap svg #ca:hover path,#wmap svg #gb:hover,#wmap svg #gb:hover path,#wmap svg #ie:hover,#wmap svg #ie:hover path,#wmap svg #de:hover,#wmap svg #de:hover path,#wmap svg #it:hover,#wmap svg #it:hover path,#wmap svg #be:hover,#wmap svg #be:hover path,#wmap svg #nl:hover,#wmap svg #nl:hover path,#wmap svg #gr:hover,#wmap svg #gr:hover path,#wmap svg #lb:hover,#wmap svg #lb:hover path,#wmap svg #sa:hover,#wmap svg #sa:hover path,#wmap svg #ae:hover,#wmap svg #ae:hover path,#wmap svg #om:hover,#wmap svg #om:hover path,#wmap svg #qa:hover,#wmap svg #qa:hover path,#wmap svg #ir:hover,#wmap svg #ir:hover path,#wmap svg #af:hover,#wmap svg #af:hover path,#wmap svg #ng:hover,#wmap svg #ng:hover path,#wmap svg #za:hover,#wmap svg #za:hover path,#wmap svg #au:hover,#wmap svg #au:hover path,#wmap svg #nz:hover,#wmap svg #nz:hover path,#wmap svg #kr:hover,#wmap svg #kr:hover path,#wmap svg #fr:hover>path:first-child{fill:var(--blue-deep)!important;cursor:pointer;}
#wmap svg #pk,#wmap svg #pk path{fill:#E9DDC4!important;cursor:default;}
#wmap-tip{position:absolute;transform:translate(-50%,-100%);pointer-events:none;opacity:0;transition:opacity .16s ease;background:#fff;border:1px solid rgba(201,162,75,.4);border-radius:10px;padding:9px 13px;box-shadow:0 12px 30px rgba(36,28,18,.2);z-index:5;white-space:nowrap;}
#wmap-tip .tn{font-family:'Bricolage Grotesque';font-weight:700;font-size:15px;color:var(--blue-deep);line-height:1.1;}
#wmap-tip .tk{font-family:'Bricolage Grotesque';font-weight:700;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-text);margin-top:3px;}
#wmap-tip[data-kind="home"] .tk{color:var(--orange);}

/* form */
.fin{transition:border-color .18s ease,box-shadow .18s ease;}
.fin:focus{outline:none;border-color:var(--blue-deep)!important;box-shadow:0 0 0 3px rgba(27,70,194,.12)!important;}
.sub-btn{transition:background .18s ease,transform .18s ease,box-shadow .18s ease;}
.sub-btn:hover{background:var(--blue-deep)!important;transform:translateY(-2px);box-shadow:0 14px 30px rgba(22,48,127,.3)!important;}

/* stat cards */
.stat-card{transition:transform .2s ease,box-shadow .2s ease;}
.stat-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(22,48,127,.14)!important;}
/* lab cards */
.lab-card{transition:transform .2s ease,box-shadow .2s ease;}
.lab-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(22,48,127,.14)!important;}
/* country finder */
.finder-chip{transition:background .18s ease,color .18s ease,border-color .18s ease;cursor:pointer;}
.finder-chip:hover{background:#fff!important;color:var(--blue-deep)!important;border-color:#fff!important;}
#finder-input:focus{outline:none;box-shadow:0 0 0 4px rgba(239,156,46,.35)!important;}
@keyframes mktFlash{0%,100%{fill:var(--gold-dark)}50%{fill:var(--blue-deep)}}
#wmap svg .mkt-flash,#wmap svg .mkt-flash path{fill:var(--blue-deep)!important;animation:mktFlash 1s ease-in-out infinite;}
@keyframes frPop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes expTicker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.exp-belt-track{display:flex;width:max-content;animation:expTicker 45s linear infinite;}
.exp-belt:hover .exp-belt-track{animation-play-state:paused;}
.exp-belt-track img { max-height: 32px; max-width: 132px; width: auto; height: auto; object-fit: contain; display: block; }
.exp-belt-track .exp-dist-logo--tall { max-height: 58px; max-width: 92px; }
.fr-card{animation:frPop .28s ease both;}
.fr-req{transition:color .16s ease;cursor:pointer;}
.fr-req:hover{color:#fff!important;}

@media (max-width:640px){ .finder-form{flex-direction:column!important;} }
@media (max-width:900px){
  .exp-grid{grid-template-columns:1fr!important;}
  .quote-grid{grid-template-columns:1fr!important;}
  .form-2{grid-template-columns:1fr!important;}
  .tabbar{flex-wrap:wrap!important;}
  .exp-stats{grid-template-columns:1fr 1fr!important;}
  .lab-grid{grid-template-columns:1fr 1fr!important;}
  .exp-footer-grid{grid-template-columns:1fr 1fr!important;gap:28px!important;}
  .finder-band{padding:34px 24px 32px!important;}
  .finder-band h2{font-size:26px!important;}
  .exp-sec-pad{padding-left:20px!important;padding-right:20px!important;}
}
/* Same squeeze as the home stat tiles: two cards per row on a phone leaves roughly 160px
   each, and 28px of padding either side is more than the 54px figure can spare, so "100%"
   was being clipped by the card's own overflow. */
@media (max-width:560px){
  .export-s38{padding:20px 14px 16px;}
  .export-s40{font-size:38px;}
  .export-s41{font-size:12.5px;line-height:1.3;}
}

@media (max-width:380px){
  .export-s38{padding:16px 10px 14px;}
  .export-s40{font-size:32px;}
}

@media (max-width:520px){
  .exp-stats{grid-template-columns:1fr 1fr!important;}
  .lab-grid{grid-template-columns:1fr 1fr!important;}
}
@media (prefers-reduced-motion: reduce){*{animation:none!important;}}

/* ------------------------------------------------------------ port additions */

/* Tab state carried by classes, since the CSP drops style attributes. */
.tab-btn { cursor: pointer; }
.tab-btn.is-on { background: var(--blue-deep); color: #fff; border-color: var(--blue-deep); }
.tabpanel[hidden] { display: none; }

/* --------------------------------------------------------- market finder */

.fr-result { margin-top: 16px; min-height: 48px; }

.fr-card {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  flex-wrap: wrap;
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .34);
  border-radius: 12px;
  padding: 12px 18px;
  font-family: 'Bricolage Grotesque';
  font-weight: 600;
  font-size: 14.5px;
  color: #fff;
}

.fr-card--no { background: rgba(255, 255, 255, .10); border-color: rgba(255, 255, 255, .26); color: rgba(255, 255, 255, .88); }
.fr-card--home { border-color: rgba(230, 204, 134, .6); }

.fr-req {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 13.5px;
  color: var(--blue-deep);
  background: var(--gold-lite);
  border: none;
  border-radius: 999px;
  padding: 7px 16px;
  cursor: pointer;
}

.fr-req:hover { background: #fff; }

/* The finder highlights the matched country on the map. */
.mkt-flash { fill: var(--orange) !important; transition: fill .3s ease; }

/* ------------------------------------------------------------ market belt */

/* -------------------------------------------------------------- quote form */

.quote-decoy { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.field--full { grid-column: 1 / -1; }

.quote-spinner {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, .38);
  border-top-color: #fff;
  animation: mfxSpin .7s linear infinite;
  display: inline-block;
  margin-left: 9px;
}

@keyframes mfxSpin { to { transform: rotate(360deg); } }

.sub-btn { display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.sub-btn:disabled { opacity: .72; cursor: progress; }

#quote-ok[hidden] { display: none; }

/* --------------------------------------------------------------------------
 * Hoisted from a <style> element in the design's page body (1 of 1).
 * ----------------------------------------------------------------------- */


/* --------------------------------------------------------------------------
 * Export hero: the saag banner runs the full width, with the title and its line
 * set at the left on the content grid. A cream wash carries the left third so
 * the copy stays legible, and the foot dissolves into the page so the banner
 * never ends on a hard horizontal line.
 * ----------------------------------------------------------------------- */
.exp-hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 540px;
  padding: 150px 0 66px;
  background: var(--cream);
  overflow: hidden;
}

.exp-hero-media { position: absolute; inset: 0; z-index: 0; }

.exp-hero-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 44%;
  display: block;
}

/* Weighted left, where the copy sits, and along the foot so the photograph melts
   into the cream rather than stopping on a line. */
/* Solid cream behind the copy, then the fade. The stop is anchored to the content
   grid rather than a percentage of the viewport, so it lands just past the end of
   "Export" at every width instead of drifting as the page grows. */
.exp-hero-fade {
  --copy-start: calc(50% - (var(--content-max) / 2) + var(--content-pad));
  --solid-end: calc(var(--copy-start) + 250px);

  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(to right,
      var(--cream) 0%,
      var(--cream) var(--solid-end),
      rgba(251,245,233,.88) calc(var(--solid-end) + 90px),
      rgba(251,245,233,.60) calc(var(--solid-end) + 220px),
      rgba(251,245,233,.20) calc(var(--solid-end) + 370px),
      rgba(251,245,233,0) calc(var(--solid-end) + 500px)),
    linear-gradient(to bottom,
      rgba(251,245,233,.42) 0%,
      rgba(251,245,233,0) 26%,
      rgba(251,245,233,0) 56%,
      rgba(251,245,233,.55) 82%,
      var(--cream) 100%);
}

.exp-hero-grid {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--content-max);
  margin: 0 auto;
  padding: 0 var(--content-pad);
}

.exp-hero-copy {
  max-width: 560px;
  margin: 0;
  text-align: left;
}

.exp-hero-copy .export-s07 { font-size: clamp(40px, 5vw, 72px); margin-top: 18px; }
.exp-hero-copy .export-s08 { margin: 16px 0 0; max-width: none; color: var(--ink); }

@media (max-width: 1100px) {
  .exp-hero { min-height: 470px; padding: 128px 0 56px; }
  .exp-hero-copy { max-width: 470px; }
}

@media (max-width: 900px) {
  .exp-hero { min-height: 430px; padding: 116px 0 48px; }
  .exp-hero-copy { max-width: none; }
  .exp-hero-img { object-position: 62% 50%; }
  /* The tighter mobile crop sits behind the full column, so the wash spans the width. */
  .exp-hero-fade {
    background:
      linear-gradient(to right, rgba(251,245,233,.96) 0%, rgba(251,245,233,.90) 52%, rgba(251,245,233,.66) 100%),
      linear-gradient(to bottom, rgba(251,245,233,.50) 0%, rgba(251,245,233,.10) 30%,
        rgba(251,245,233,.60) 84%, var(--cream) 100%);
  }
}

@media (max-width: 640px) {
  .exp-hero { min-height: 390px; padding: 104px 0 40px; }
}

@media (max-width: 520px) {
  .exp-hero { min-height: 350px; padding: 96px 0 34px; }
}