/* ETS Theme stylesheet
 * Loaded after theme.json. Everything here is layout and component styling;
 * colours, fonts and spacing come from theme.json custom properties so they
 * stay editable in Appearance > Editor > Styles.
 * Built from the approved mockups. Do not edit generated sections by hand.
 */

/* ============================================================
   ETS THEME - DESIGN TOKENS
   Everything below maps 1:1 to theme.json when this becomes
   the block theme. Change a value here, change it everywhere.
   ============================================================ */
:root{
  /* palette */
  --ets-purple-deep:#4d24a0;
  --ets-purple:#6734b9;
  --ets-purple-dark:#2d1655;
  --ets-orange:#e27f25;
  --ets-orange-dark:#c66a1a;
  --ets-ink:#191521;
  --ets-body:#4a4a55;
  --ets-muted:#6b6678;
  --ets-light:#a5a0b0;
  --ets-border:#e7e4ee;
  --ets-tint:#f5f1fc;
  --ets-lavender:#ded2f3;
  --ets-cream:#fefbf6;
  --ets-white:#fff;

  /* type */
  --ets-font-head:'Raleway',system-ui,sans-serif;
  --ets-font-body:'Open Sans',system-ui,sans-serif;

  /* layout */
  --ets-shell:1460px;
  --ets-gutter:clamp(16px,3vw,52px);
  --ets-measure:68ch;

  /* rhythm - the "air" that separates this from the old build */
  --ets-section:clamp(72px,9vw,144px);
  --ets-section-tight:clamp(56px,6vw,96px);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--ets-white);color:var(--ets-body);
  font-family:var(--ets-font-body);font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
  /* clip, not hidden: overflow-x:hidden makes body a scroll container,
     which silently kills position:sticky on the header inside it */
  overflow-x:clip}
img{max-width:100%;display:block}
a{color:inherit}

/* shared shell */
.shell{width:100%;max-width:var(--ets-shell);margin:0 auto;
  padding-left:var(--ets-gutter);padding-right:var(--ets-gutter)}

/* shared section head: eyebrow + headline left, lede right */
.sec{padding:var(--ets-section) 0}
/* "Cream" resolves to the light purple-gray section tint, per the approved
   palette change. To go back to the warm original, change --ets-sec-alt. */
.sec--cream{background:var(--ets-sec-alt)}
.sec--tint{background:var(--ets-tint)}
.sec--deep{background:var(--ets-purple-deep);color:rgba(255,255,255,.85)}
.head{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,4vw,64px);
  align-items:end;margin:0 0 clamp(40px,5vw,72px)}
.eyebrow{font-family:var(--ets-font-head);font-weight:800;font-size:12px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ets-orange);
  margin:0 0 18px}
.h2{font-family:var(--ets-font-head);font-weight:800;
  font-size:clamp(30px,4.4vw,54px);line-height:1.05;letter-spacing:-.03em;
  margin:0;color:var(--ets-ink)}
/* Accent italics are reserved for heroes and closing CTAs. A routine section
   head is plain by default, so the accent keeps its impact instead of reading
   as a tic. Add class "is-accent" to an em to opt a single head back in. */
.h2 em{font-style:normal;color:inherit;font-weight:inherit}
.h2 em.is-accent{color:var(--ets-orange);font-style:italic;font-weight:900}
.sec--deep .h2{color:#fff}
.lede{color:var(--ets-muted);font-size:clamp(15px,1.3vw,17.5px);line-height:1.7;
  max-width:56ch;margin:0}
.sec--deep .lede{color:rgba(255,255,255,.78)}

/* shared buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:16px 28px;background:var(--ets-purple);color:#fff;border:2px solid var(--ets-purple);
  font-family:var(--ets-font-head);font-weight:800;font-size:11.5px;letter-spacing:.13em;
  text-transform:uppercase;text-decoration:none;transition:.2s;white-space:nowrap}
.btn:hover{background:var(--ets-purple-deep);border-color:var(--ets-purple-deep)}
.btn svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .2s}
.btn:hover svg{transform:translateX(4px)}
.btn--orange{background:var(--ets-orange);border-color:var(--ets-orange)}
.btn--orange:hover{background:var(--ets-orange-dark);border-color:var(--ets-orange-dark)}
.btn--line{background:transparent;color:var(--ets-purple);border-color:var(--ets-lavender)}
.btn--line:hover{background:var(--ets-purple);color:#fff;border-color:var(--ets-purple)}

/* ============================================================
   SCROLL REVEAL
   IntersectionObserver, no library, disabled for reduced motion.
   ============================================================ */
html.ets-js .rv{opacity:0;transform:translateY(26px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}
.rv.is-in{opacity:1;transform:none}
.rv-d1{transition-delay:.08s}.rv-d2{transition-delay:.16s}
.rv-d3{transition-delay:.24s}.rv-d4{transition-delay:.32s}
.rv-d5{transition-delay:.40s}.rv-d6{transition-delay:.48s}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  .trust__track{animation:none !important}
}

/* ============================================================
   HEADER
   ============================================================ */
.hd__util{background:var(--ets-purple-deep);color:rgba(255,255,255,.88);font-size:14px}
.hd__util .shell{display:flex;align-items:center;justify-content:space-between;
  gap:20px;padding-top:11px;padding-bottom:11px}
.hd__tag{display:inline-flex;align-items:center;gap:10px}
.hd__tag i{width:7px;height:7px;background:var(--ets-orange);display:block;flex:none}
.hd__social{display:inline-flex;align-items:center;gap:10px}
.hd__social span{font-family:var(--ets-font-head);font-weight:800;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.72);margin-right:4px}
.hd__social a{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;
  background:rgba(255,255,255,.14);transition:background .18s,transform .18s}
.hd__social a:hover{background:var(--ets-orange);transform:translateY(-1px)}
.hd__social svg{width:16px;height:16px;fill:#fff}

.hd__bar{background:#fff;border-bottom:1px solid var(--ets-border);
  position:sticky;top:0;z-index:50}
.hd__bar .shell{display:flex;align-items:center;gap:22px;height:104px}
.hd__logo{flex:none;text-decoration:none;display:flex;align-items:center;gap:12px;
  font-family:var(--ets-font-head);font-weight:900;font-size:26px;letter-spacing:-.03em;
  color:var(--ets-purple)}
.hd__logo small{display:block;font-size:9.5px;letter-spacing:.16em;font-weight:800;
  text-transform:uppercase;color:var(--ets-light);line-height:1.3}
.hd__nav{display:flex;align-items:center;flex:1 0 auto}
.hd__link,.hd__drop>summary{display:inline-flex;align-items:center;gap:6px;
  padding:12px 15px;font-family:var(--ets-font-head);font-weight:700;font-size:16px;
  color:var(--ets-body);text-decoration:none;white-space:nowrap;cursor:pointer;
  list-style:none;transition:color .16s}
.hd__drop>summary::-webkit-details-marker{display:none}
.hd__link:hover,.hd__drop>summary:hover,.hd__drop[open]>summary{color:var(--ets-purple)}
.hd__drop{position:relative}
.hd__drop>summary::after{content:"";width:10px;height:10px;flex:none;transition:transform .2s;
  background:no-repeat center/contain
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234a4a55' stroke-width='2.8'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}
.hd__drop[open]>summary::after{transform:rotate(180deg)}
.hd__panel{position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--ets-border);
  border-top:3px solid var(--ets-orange);box-shadow:0 20px 44px -26px rgba(25,21,33,.5);
  min-width:290px;padding:8px 0;z-index:60}
.hd__panel--wide{min-width:560px;column-count:2;column-gap:0}
.hd__panel a{display:block;padding:10px 22px;font-size:14.5px;color:var(--ets-body);
  text-decoration:none;border-left:3px solid transparent;transition:.14s;break-inside:avoid}
.hd__panel a:hover{background:var(--ets-tint);border-left-color:var(--ets-purple);color:var(--ets-purple)}
.hd__grp{padding:14px 22px 6px;font-family:var(--ets-font-head);font-weight:800;
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ets-light);break-inside:avoid}
.hd__cta{display:flex;align-items:center;gap:10px;flex:none}
.hd__cta .btn{padding:14px 18px}
.hd__burger{display:none;width:46px;height:46px;border:2px solid var(--ets-purple);
  background:var(--ets-purple);cursor:pointer;place-items:center;flex:none;padding:0}
.hd__burger>summary{display:grid;place-items:center;width:100%;height:100%;list-style:none;cursor:pointer}
.hd__burger>summary::-webkit-details-marker{display:none}
.hd__burger svg{width:21px;height:21px;stroke:#fff;fill:none;stroke-width:2}
@media (max-width:1375px){
  .hd__nav,.hd__cta .btn--line{display:none}
  .hd__cta{margin-left:auto}
  .hd__burger{display:grid}
}
@media (max-width:640px){
  .hd__util .shell{flex-direction:column;gap:9px;text-align:center;font-size:12.5px}
  .hd__bar .shell{height:80px;gap:10px}
}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;display:flex;align-items:center;overflow:hidden;color:#fff;
  background:var(--ets-purple) center/cover no-repeat;
  min-height:clamp(560px,72vh,780px);
  padding:clamp(48px,6vw,72px) 0 clamp(56px,7vw,96px)}
.hero__scrim{position:absolute;inset:0;z-index:2;pointer-events:none;
  background-image:linear-gradient(105deg,
    rgba(45,22,85,.96) 0%, rgba(61,31,110,.9) 26%,
    rgba(103,52,185,.55) 62%, rgba(168,136,212,.18) 100%)}
.hero .shell{position:relative;z-index:5}
.hero__in{max-width:58%}
.hero__title{font-family:var(--ets-font-head);font-weight:800;
  font-size:clamp(36px,5.6vw,80px);line-height:1.01;letter-spacing:-.035em;
  margin:0 0 clamp(18px,2.2vw,30px);color:#fff}
.hero__title span{display:block}
.hero__title em{color:var(--ets-orange);font-style:italic;font-weight:800}
.hero__sub{font-size:clamp(16px,1.35vw,18.5px);line-height:1.6;
  color:rgba(255,255,255,.92);max-width:54ch;margin:0 0 clamp(24px,2.6vw,36px)}
.hero__sub strong{color:#fff;font-weight:700}
.hero__search{display:grid;grid-template-columns:1.2fr 1fr auto;background:#fff;max-width:640px;
  box-shadow:0 0 0 5px rgba(255,255,255,.15),0 18px 36px rgba(0,0,0,.34);transition:box-shadow .25s}
.hero__search:focus-within{box-shadow:0 0 0 5px rgba(226,127,37,.4),0 22px 42px rgba(0,0,0,.4)}
.hero__field{display:flex;align-items:center;gap:10px;padding:0 18px;
  border-right:1px solid var(--ets-border);min-width:0}
.hero__field svg{stroke:var(--ets-light);fill:none;stroke-width:2;flex:none}
.hero__search input{flex:1;border:0;outline:none;padding:18px 0;min-width:0;font-size:16px;
  font-family:var(--ets-font-body);color:var(--ets-ink);background:none}
.hero__search input::placeholder{color:var(--ets-light)}
.hero__search button{border:0;padding:0 28px;cursor:pointer;min-height:56px;
  background:var(--ets-orange);color:#fff;font-family:var(--ets-font-head);font-weight:800;
  font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;transition:background .2s;white-space:nowrap}
.hero__search button:hover{background:var(--ets-orange-dark)}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
.hero__alt{margin:18px 0 0;font-size:14.5px;color:rgba(255,255,255,.85);line-height:1.6}
.hero__alt a{color:#fff;font-weight:700;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.5)}
.hero__alt a:hover{color:var(--ets-orange);border-color:var(--ets-orange)}
.hero__proof{list-style:none;display:flex;flex-wrap:wrap;align-items:center;
  margin:clamp(24px,2.6vw,34px) 0 0;padding:0;row-gap:8px}
.hero__proof li{font-family:var(--ets-font-head);font-weight:800;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.8)}
.hero__proof li+li::before{content:"";display:inline-block;width:4px;height:4px;
  background:var(--ets-orange);margin:0 clamp(10px,1.2vw,15px);vertical-align:middle}
@media (max-width:1200px){.hero__in{max-width:74%}}
@media (max-width:860px){
  .hero__in{max-width:100%}
  .hero__search{max-width:520px;grid-template-columns:1fr 1fr;grid-template-areas:"kw loc" "btn btn"}
  .hero__field:first-of-type{grid-area:kw}
  .hero__field:nth-of-type(2){grid-area:loc;border-right:0}
  .hero__search button{grid-area:btn;padding:16px;border-top:1px solid var(--ets-border)}
}
@media (max-width:700px){
  .hero{min-height:0;padding:44px 0 52px}
  .hero__search{max-width:100%;grid-template-columns:1fr;grid-template-areas:"kw" "loc" "btn"}
  .hero__field{border-right:0;border-bottom:1px solid var(--ets-border)}
}

/* ============================================================
   STATS + TRUSTED BY
   ============================================================ */
@keyframes ets-ticker{from{transform:translateX(0)}to{transform:translateX(-100%)}}
.stats{padding:var(--ets-section-tight) 0}
.stats__grid{display:grid;grid-template-columns:repeat(4,1fr)}
.stats__item{padding:0 clamp(12px,2.4vw,36px);border-left:1px solid var(--ets-border);text-align:center}
.stats__item:first-child{border-left:0}
.stats__num{display:block;font-family:var(--ets-font-head);font-weight:900;
  font-size:clamp(38px,5vw,64px);line-height:1;letter-spacing:-.04em;color:var(--ets-purple);
  white-space:nowrap}
.stats__num sup{font-size:.42em;position:relative;top:-.62em;color:var(--ets-orange);line-height:0}
.stats__lbl{display:block;font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ets-muted);margin-top:14px;line-height:1.5}
.trust{border-top:1px solid var(--ets-border);margin-top:clamp(40px,5vw,64px);
  padding-top:clamp(28px,3vw,42px);display:flex;align-items:center;gap:clamp(18px,3vw,48px)}
.trust__lbl{font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ets-light);margin:0;flex:none;white-space:nowrap}
.trust__marquee{flex:1;min-width:0;display:flex;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 90%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 4%,#000 90%,transparent)}
.trust__track{display:flex;gap:clamp(28px,4vw,58px);align-items:center;
  padding-right:clamp(28px,4vw,58px);animation:ets-ticker 38s linear infinite;flex:none}
.trust__marquee:hover .trust__track{animation-play-state:paused}
.trust__brand{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(13px,1.35vw,17px);
  white-space:nowrap;color:var(--ets-light);transition:color .2s}
.trust__brand:hover{color:var(--ets-ink)}
@media (max-width:820px){
  .stats__grid{grid-template-columns:1fr 1fr;gap:34px 0}
  .stats__item:nth-child(3){border-left:0}
}
@media (max-width:600px){.trust{flex-direction:column;align-items:flex-start;gap:14px}
  .trust__marquee{width:100%}}

/* ============================================================
   TWO PATHS
   ============================================================ */
.paths__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.2vw,30px)}
.paths__card{background:#fff;border:1px solid var(--ets-border);display:flex;flex-direction:column;
  overflow:hidden;transition:border-color .24s,transform .24s,box-shadow .24s}
.paths__card:hover{border-color:var(--ets-purple);transform:translateY(-4px);
  box-shadow:0 18px 36px -22px rgba(25,21,33,.4)}
.paths__media{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--ets-lavender)}
.paths__media img{width:100%;height:100%;object-fit:cover}
.paths__tag{position:absolute;left:0;bottom:0;z-index:2;background:var(--ets-purple);color:#fff;
  font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;padding:9px 16px}
.paths__card--emp .paths__tag{background:var(--ets-orange)}
.paths__body{padding:clamp(26px,3vw,44px);display:flex;flex-direction:column;flex:1}
.paths__h{font-family:var(--ets-font-head);font-weight:800;
  font-size:clamp(22px,2.5vw,32px);line-height:1.14;letter-spacing:-.02em;
  margin:0 0 14px;color:var(--ets-ink)}
.paths__h em{color:var(--ets-orange);font-style:italic;font-weight:900}
.paths__p{color:var(--ets-muted);font-size:16.5px;line-height:1.68;
  margin:0 0 clamp(26px,3vw,34px);max-width:46ch}
.paths__card .btn{align-self:flex-start;margin-top:auto}
.paths__card--emp .btn{background:var(--ets-orange);border-color:var(--ets-orange)}
.paths__card--emp .btn:hover{background:var(--ets-orange-dark);border-color:var(--ets-orange-dark)}
@media (max-width:900px){.paths__grid{grid-template-columns:1fr}
  .paths__media{aspect-ratio:16/9}}

/* ============================================================
   SERVICES  (five ways to staff - one filled card among plain)
   ============================================================ */
.svc__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,20px)}
.svc__card{border:1px solid var(--ets-border);background:#fff;
  padding:clamp(24px,2.6vw,34px);text-decoration:none;display:flex;flex-direction:column;
  transition:border-color .22s,transform .22s,box-shadow .22s}
.svc__card:hover{border-color:var(--ets-purple);transform:translateY(-4px);
  box-shadow:0 18px 34px -24px rgba(25,21,33,.42)}
.svc__card--feature{grid-row:span 2;background:var(--ets-purple);border-color:var(--ets-purple);
  color:#fff;justify-content:space-between}
.svc__card--feature:hover{background:var(--ets-purple-deep);border-color:var(--ets-purple-deep)}
.svc__ico{width:40px;height:40px;display:grid;place-items:center;background:var(--ets-tint);
  margin:0 0 20px;flex:none;transition:background .22s}
.svc__card:hover .svc__ico{background:var(--ets-orange)}
.svc__ico svg{width:19px;height:19px;stroke:var(--ets-purple);fill:none;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;transition:stroke .22s}
.svc__card:hover .svc__ico svg{stroke:#fff}
.svc__card--feature .svc__ico{background:rgba(255,255,255,.16)}
.svc__card--feature:hover .svc__ico{background:rgba(255,255,255,.24)}
.svc__card--feature .svc__ico svg{stroke:#fff}
.svc__h{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(17px,1.7vw,21px);
  line-height:1.25;letter-spacing:-.015em;margin:0 0 10px;color:var(--ets-ink)}
.svc__card--feature .svc__h{color:#fff;font-size:clamp(20px,2vw,26px)}
.svc__p{color:var(--ets-muted);font-size:14.5px;line-height:1.65;margin:0 0 22px}
.svc__card--feature .svc__p{color:rgba(255,255,255,.82);font-size:15.5px}
.svc__more{margin-top:auto;font-family:var(--ets-font-head);font-weight:800;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ets-purple);
  display:inline-flex;align-items:center;gap:8px;transition:color .2s}
.svc__card:hover .svc__more{color:var(--ets-orange-dark)}
.svc__card--feature .svc__more{color:#fff}
.svc__more svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.6;transition:transform .2s}
.svc__card:hover .svc__more svg{transform:translateX(4px)}
@media (max-width:1024px){.svc__grid{grid-template-columns:repeat(2,1fr)}
  .svc__card--feature{grid-row:auto}}
@media (max-width:600px){.svc__grid{grid-template-columns:1fr}}

/* ============================================================
   INDUSTRIES  (flat, numbered, typographic - the VEA move)
   ============================================================ */
.ind__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,20px)}
.ind__card{position:relative;border:1px solid var(--ets-border);background:#fff;
  padding:clamp(26px,2.8vw,38px);text-decoration:none;display:flex;flex-direction:column;
  transition:border-color .22s,background .22s,transform .22s}
.ind__card:hover{border-color:var(--ets-purple);background:var(--ets-cream);transform:translateY(-4px)}
.ind__idx{position:absolute;top:clamp(20px,2.2vw,28px);right:clamp(20px,2.2vw,28px);
  font-family:var(--ets-font-head);font-weight:800;font-size:11px;letter-spacing:.14em;
  color:var(--ets-light)}
.ind__h{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(19px,1.9vw,24px);
  line-height:1.2;letter-spacing:-.02em;margin:0 0 12px;color:var(--ets-ink);padding-right:40px}
.ind__p{color:var(--ets-muted);font-size:14.5px;line-height:1.65;margin:0 0 20px}
.ind__roles{list-style:none;margin:0 0 24px;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.ind__roles li{font-size:12px;color:var(--ets-body);background:var(--ets-tint);
  padding:5px 11px;line-height:1.4}
.ind__stat{margin-top:auto;padding-top:20px;border-top:1px solid var(--ets-border);
  display:flex;align-items:baseline;gap:9px}
.ind__statnum{font-family:var(--ets-font-head);font-weight:900;font-size:22px;
  letter-spacing:-.03em;color:var(--ets-purple)}
.ind__statlbl{font-size:12.5px;color:var(--ets-muted)}
@media (max-width:1024px){.ind__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.ind__grid{grid-template-columns:1fr}}

/* ============================================================
   LOCATIONS
   ============================================================ */
.loc__grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(28px,4vw,72px);align-items:start}
.loc__list{display:grid;gap:0;border-top:1px solid rgba(255,255,255,.18)}
.loc__row{display:flex;align-items:center;gap:20px;padding:clamp(20px,2.4vw,30px) 0;
  border-bottom:1px solid rgba(255,255,255,.18);text-decoration:none;transition:padding .22s}
.loc__row:hover{padding-left:12px}
.loc__badge{font-family:var(--ets-font-head);font-weight:800;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;padding:6px 11px;flex:none;background:var(--ets-orange);color:#fff}
.loc__badge--hq{background:rgba(255,255,255,.16);color:#fff}
.loc__info{flex:1;min-width:0}
.loc__name{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(17px,1.7vw,21px);
  color:#fff;margin:0 0 4px;letter-spacing:-.015em}
.loc__meta{font-size:13.5px;color:rgba(255,255,255,.6);margin:0}
.loc__row svg{width:16px;height:16px;stroke:var(--ets-orange);fill:none;stroke-width:2.4;
  flex:none;transition:transform .22s}
.loc__row:hover svg{transform:translateX(5px)}
@media (max-width:900px){.loc__grid{grid-template-columns:1fr;gap:36px}}

/* ============================================================
   COMMUNITY
   ============================================================ */
.com__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.2vw,28px)}
.com__card{border:1px solid var(--ets-border);background:#fff;overflow:hidden;
  display:flex;flex-direction:column;transition:border-color .24s,transform .24s}
.com__card:hover{border-color:var(--ets-purple);transform:translateY(-4px)}
.com__top{padding:clamp(28px,3vw,42px);flex:1}
.com__kicker{font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ets-orange);margin:0 0 14px}
.com__h{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(21px,2.2vw,28px);
  line-height:1.18;letter-spacing:-.02em;margin:0 0 12px;color:var(--ets-ink)}
.com__p{color:var(--ets-muted);font-size:15.5px;line-height:1.68;margin:0 0 26px;max-width:44ch}
@media (max-width:800px){.com__grid{grid-template-columns:1fr}}

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.tst__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px)}
.tst__card{border:1px solid var(--ets-border);background:#fff;padding:clamp(28px,3vw,40px);
  display:flex;flex-direction:column;transition:border-color .24s,transform .24s}
.tst__card:hover{border-color:var(--ets-purple);transform:translateY(-4px)}
.tst__mark{font-family:var(--ets-font-head);font-weight:900;font-size:44px;line-height:.7;
  color:var(--ets-lavender);margin:0 0 18px}
.tst__quote{font-size:16.5px;line-height:1.68;color:var(--ets-body);margin:0 0 26px;flex:1}
.tst__who{border-top:1px solid var(--ets-border);padding-top:18px}
.tst__name{font-family:var(--ets-font-head);font-weight:800;font-size:14.5px;
  color:var(--ets-ink);margin:0 0 3px}
.tst__role{font-size:13px;color:var(--ets-muted);margin:0}
@media (max-width:900px){.tst__grid{grid-template-columns:1fr}}

/* ============================================================
   CLOSING CTA
   ============================================================ */
.cta{background:var(--ets-purple-deep);color:#fff;padding:var(--ets-section) 0;
  position:relative;overflow:hidden}
.cta::after{content:"";position:absolute;right:-140px;top:-140px;width:520px;height:520px;
  background:radial-gradient(circle,rgba(226,127,37,.22),transparent 68%);pointer-events:none}
.cta .shell{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;
  gap:clamp(28px,4vw,64px);align-items:center}
.cta__h{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(30px,4.4vw,54px);
  line-height:1.05;letter-spacing:-.03em;margin:0 0 18px;color:#fff}
.cta__h em{color:var(--ets-orange);font-style:italic;font-weight:900}
.cta__p{color:rgba(255,255,255,.82);font-size:clamp(16px,1.3vw,18px);line-height:1.7;
  margin:0;max-width:52ch}
.cta__btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.cta__btns .btn{padding:18px 30px}
.cta__btns .btn--line{color:#fff;border-color:rgba(255,255,255,.4)}
.cta__btns .btn--line:hover{background:#fff;color:var(--ets-purple-deep);border-color:#fff}
/* The phone-row CTA needs a block shell so its own grid can control the split.
   Class, not an inline style: inline styles on a core/group fail block validation. */
.cta .shell--block{display:block}
.cta__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,4vw,64px);
  align-items:center;min-width:0}
.cta__grid>*{min-width:0}
@media (max-width:900px){.cta .shell{grid-template-columns:1fr}
  .cta__grid{grid-template-columns:1fr;gap:32px}
  .cta__btns{justify-content:flex-start}}

/* Sections that follow a hero start tighter, so the two do not stack up. */
.sec--tight-top{padding-top:clamp(60px,7vw,110px)}

/* ============================================================
   FOOTER
   ============================================================ */
.ft{background:#fff;border-top:1px solid var(--ets-border)}
.ft__main{padding-top:clamp(56px,6vw,88px);padding-bottom:clamp(40px,4vw,60px)}
.ft__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:clamp(24px,3vw,44px)}
.ft h4{font-family:var(--ets-font-head);font-weight:800;font-size:14px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ets-orange);margin:0 0 24px}
.ft ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.ft ul a{display:inline-flex;align-items:baseline;gap:8px;font-size:14px;color:var(--ets-purple);
  font-weight:600;text-decoration:none;transition:color .16s;line-height:1.45}
.ft ul a::before{content:"\203A";color:var(--ets-orange);font-weight:700}
.ft ul a:hover{color:var(--ets-orange-dark)}
.ft__mk{display:grid;gap:20px}
.ft__mk b{display:block;font-family:var(--ets-font-head);font-weight:800;font-size:14.5px;
  color:var(--ets-purple);margin:0 0 5px}
.ft__ph{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14px;
  color:var(--ets-ink);text-decoration:none}
.ft__ph svg{width:14px;height:14px;stroke:var(--ets-orange);fill:none;stroke-width:2.2;flex:none}
.ft__ph:hover{color:var(--ets-orange-dark)}
.ft__ad{display:block;font-size:13px;color:var(--ets-muted);margin-top:4px;line-height:1.55}
.ft__bar{background:var(--ets-purple);color:#fff}
.ft__bar .shell{display:flex;justify-content:space-between;align-items:center;gap:18px;
  flex-wrap:wrap;padding-top:19px;padding-bottom:19px;font-size:13px}
.ft__bar a{color:#fff;border-bottom:1px solid rgba(255,255,255,.5);text-decoration:none}
.ft__bar a:hover{color:var(--ets-orange);border-color:var(--ets-orange)}
/* Footer socials.

   These are a core wp:social-links block, so they are a <ul> of <li> wrapping
   an <a>, and they sit inside .ft where two generic footer-list rules were
   catching them: `.ft ul{display:grid}` stacked the three icons vertically down
   the side of the bar, and `.ft ul a::before{content:"\203A"}` put a chevron
   above every one. Both rules outrank a bare .ft__soc, so the overrides below
   match their specificity. The circle lives on the anchor only; the <li> stays
   transparent, or you get one circle drawn inside another. */
.ft ul.ft__soc{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;
  gap:10px;padding:0;margin:0;list-style:none}
.ft ul.ft__soc a::before,.ft ul.ft__soc a::after{content:none;display:none}
.ft__soc .wp-block-social-link{width:36px;height:36px;display:block;
  margin:0;padding:0;background:transparent;border-radius:0}
.ft__soc .wp-block-social-link:hover{background:transparent;transform:none}
.ft__soc .wp-block-social-link>a{display:grid;place-items:center;width:36px;height:36px;
  padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.16);
  transition:background .25s,transform .25s}
.ft__soc .wp-block-social-link>a:hover{background:var(--ets-orange);transform:translateY(-1px)}
.ft__soc .wp-block-social-link>a svg{width:17px;height:17px;fill:#fff}
@media (max-width:1024px){.ft__grid{grid-template-columns:1.3fr 1fr 1fr}}
@media (max-width:720px){.ft__grid{grid-template-columns:1fr 1fr;gap:30px 24px}}
@media (max-width:480px){.ft__grid{grid-template-columns:1fr;gap:32px}
  .ft__bar .shell{flex-direction:column;align-items:flex-start;gap:14px}}

/* mockup-only notice strip */
.mock b{color:var(--ets-orange)}

/* ============================================================
   INTERIOR PAGE COMPONENTS
   Everything below is shared by location, service and audience
   pages. Homepage does not use it.
   ============================================================ */

/* page hero: shorter than the home hero, no search form */
.phero{position:relative;overflow:hidden;color:#fff;background:var(--ets-purple);
  padding:clamp(34px,4vw,48px) 0 clamp(48px,6vw,80px)}
.phero__scrim{position:absolute;inset:0;z-index:2;pointer-events:none;
  background-image:linear-gradient(105deg,
    rgba(45,22,85,.96) 0%, rgba(61,31,110,.92) 30%,
    rgba(103,52,185,.68) 70%, rgba(168,136,212,.3) 100%)}
.phero .shell{position:relative;z-index:5}
.crumbs{font-size:13px;color:rgba(255,255,255,.62);margin:0 0 clamp(24px,3vw,38px);
  display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.crumbs a{color:rgba(255,255,255,.82);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.3)}
.crumbs a:hover{color:#fff;border-color:#fff}
.crumbs span[aria-hidden]{color:rgba(255,255,255,.35)}
.phero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,72px);align-items:end}
.phero__title{font-family:var(--ets-font-head);font-weight:800;
  font-size:clamp(32px,4.8vw,64px);line-height:1.03;letter-spacing:-.035em;
  margin:0 0 20px;color:#fff}
.phero__title em{color:var(--ets-orange);font-style:italic;font-weight:900}
.phero__sub{font-size:clamp(16px,1.3vw,18.5px);line-height:1.65;
  color:rgba(255,255,255,.9);max-width:56ch;margin:0}
.phero__side{display:grid;gap:14px;justify-items:start}
.phero__call{display:inline-flex;align-items:center;gap:11px;
  font-family:var(--ets-font-head);font-weight:800;font-size:clamp(20px,2.2vw,28px);
  letter-spacing:-.02em;color:#fff;text-decoration:none}
.phero__call svg{width:20px;height:20px;stroke:var(--ets-orange);fill:none;stroke-width:2.2;flex:none}
.phero__call:hover{color:var(--ets-orange)}
.phero__note{font-size:13.5px;color:rgba(255,255,255,.68);margin:0}
.phero__btns{display:flex;gap:11px;flex-wrap:wrap;margin-top:6px}
.phero__btns .btn--line{color:#fff;border-color:rgba(255,255,255,.4)}
.phero__btns .btn--line:hover{background:#fff;color:var(--ets-purple-deep);border-color:#fff}
@media (max-width:900px){.phero__grid{grid-template-columns:1fr;gap:32px;align-items:start}}

/* readable body copy, capped measure */
.rich{max-width:var(--ets-measure)}
.rich p{font-size:17.5px;line-height:1.75;color:var(--ets-body);margin:0 0 22px}
.rich p:last-child{margin-bottom:0}
.rich h3{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(20px,2vw,26px);
  line-height:1.25;letter-spacing:-.02em;color:var(--ets-ink);margin:38px 0 14px}
.rich strong{color:var(--ets-ink);font-weight:700}
.rich a{color:var(--ets-purple);font-weight:600;text-decoration:none;
  border-bottom:1px solid var(--ets-lavender)}
.rich a:hover{color:var(--ets-orange-dark);border-color:var(--ets-orange)}

/* two column: copy left, image right */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,72px);align-items:center}
.split--flip .split__media{order:-1}
.split__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--ets-lavender)}
.split__media img{width:100%;height:100%;object-fit:cover}
.split__cap{position:absolute;left:0;bottom:0;background:var(--ets-purple);color:#fff;
  font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;padding:9px 16px}
@media (max-width:860px){.split{grid-template-columns:1fr;gap:32px}
  .split--flip .split__media{order:0}}

/* local stat strip */
.lstats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--ets-border);
  background:#fff;margin-top:clamp(36px,4vw,56px)}
.lstats__i{padding:clamp(24px,2.6vw,34px);border-left:1px solid var(--ets-border)}
.lstats__i:first-child{border-left:0}
.lstats__n{display:block;font-family:var(--ets-font-head);font-weight:900;
  font-size:clamp(26px,3vw,38px);line-height:1;letter-spacing:-.035em;color:var(--ets-purple)}
.lstats__l{display:block;font-size:13px;color:var(--ets-muted);margin-top:10px;line-height:1.5}
@media (max-width:820px){.lstats{grid-template-columns:1fr 1fr}
  .lstats__i:nth-child(3){border-left:0;border-top:1px solid var(--ets-border)}
  .lstats__i:nth-child(4){border-top:1px solid var(--ets-border)}}
@media (max-width:460px){.lstats{grid-template-columns:1fr}
  .lstats__i{border-left:0;border-top:1px solid var(--ets-border)}
  .lstats__i:first-child{border-top:0}}

/* office card */
.office{display:grid;grid-template-columns:1fr 1.1fr;gap:0;border:1px solid var(--ets-border);
  background:#fff;overflow:hidden}
.office__body{padding:clamp(30px,3.4vw,52px)}
.office__name{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(21px,2.2vw,28px);
  letter-spacing:-.02em;color:var(--ets-ink);margin:0 0 22px}
.office__rows{display:grid;gap:18px;margin:0 0 30px}
.office__row{display:flex;gap:13px;align-items:flex-start;font-size:15.5px;line-height:1.6}
.office__row svg{width:17px;height:17px;stroke:var(--ets-orange);fill:none;stroke-width:2.1;
  flex:none;margin-top:4px}
.office__row b{display:block;font-family:var(--ets-font-head);font-weight:800;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ets-light);margin-bottom:4px}
.office__row a{color:var(--ets-ink);text-decoration:none;font-weight:700}
.office__row a:hover{color:var(--ets-orange-dark)}
.office__map{background:var(--ets-tint);min-height:340px;display:grid;place-items:center;
  color:var(--ets-light);font-family:var(--ets-font-head);font-weight:800;font-size:11px;
  letter-spacing:.18em;text-transform:uppercase;text-align:center;padding:24px}
@media (max-width:860px){.office{grid-template-columns:1fr}
  .office__map{min-height:240px;order:-1}}

/* service area chips */
.areas{display:flex;flex-wrap:wrap;gap:9px}
.areas a{font-size:14px;color:var(--ets-body);background:#fff;border:1px solid var(--ets-border);
  padding:10px 16px;text-decoration:none;transition:.18s}
.areas a:hover{border-color:var(--ets-purple);color:var(--ets-purple);background:var(--ets-tint)}

/* job rows */
.jobs{border-top:1px solid var(--ets-border)}
.jobs__row{display:flex;align-items:center;gap:20px;padding:clamp(20px,2.2vw,28px) 0;
  border-bottom:1px solid var(--ets-border);text-decoration:none;transition:padding .2s,background .2s}
.jobs__row:hover{padding-left:14px;background:var(--ets-cream)}
.jobs__main{flex:1;min-width:0}
.jobs__t{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(16px,1.7vw,20px);
  color:var(--ets-ink);margin:0 0 5px;letter-spacing:-.015em}
.jobs__m{font-size:13.5px;color:var(--ets-muted);margin:0;display:flex;flex-wrap:wrap;gap:7px}
.jobs__m span+span::before{content:"·";margin-right:7px;color:var(--ets-light)}
.jobs__pay{font-family:var(--ets-font-head);font-weight:800;font-size:15px;
  color:var(--ets-purple);flex:none;white-space:nowrap}
.jobs__row svg{width:15px;height:15px;stroke:var(--ets-orange);fill:none;stroke-width:2.4;
  flex:none;transition:transform .2s}
.jobs__row:hover svg{transform:translateX(5px)}
@media (max-width:640px){.jobs__row{flex-wrap:wrap;gap:10px}
  .jobs__pay{order:3;width:100%}}

/* FAQ accordion */
.faq{border-top:1px solid var(--ets-border);max-width:var(--ets-measure)}
.faq details{border-bottom:1px solid var(--ets-border)}
.faq summary{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  padding:clamp(20px,2.2vw,26px) 0;cursor:pointer;list-style:none;
  font-family:var(--ets-font-head);font-weight:800;font-size:clamp(16px,1.6vw,19px);
  line-height:1.4;color:var(--ets-ink);letter-spacing:-.015em;transition:color .16s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--ets-purple)}
.faq summary::after{content:"";width:15px;height:15px;flex:none;margin-top:5px;transition:transform .22s;
  background:no-repeat center/contain
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236734b9' stroke-width='2.8'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}
.faq details[open] summary{color:var(--ets-purple)}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq__a{padding:0 0 clamp(22px,2.4vw,28px);margin:0;font-size:16.5px;line-height:1.75;
  color:var(--ets-body);max-width:62ch}
.faq__a p{margin:0 0 16px}
.faq__a p:last-child{margin-bottom:0}

/* ============================================================
   LOCATION PAGE: WHY US (checkmark list + office card)
   ============================================================ */
.why{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,72px);align-items:start}
.why__list{display:grid;gap:clamp(22px,2.4vw,30px);margin:0;padding:0;list-style:none;max-width:60ch}
.why__item{display:flex;gap:15px;align-items:flex-start}
.why__tick{width:22px;height:22px;flex:none;margin-top:3px;display:grid;place-items:center;
  background:var(--ets-tint)}
.why__tick svg{width:12px;height:12px;stroke:var(--ets-purple);fill:none;stroke-width:3}
.why__h{font-family:var(--ets-font-head);font-weight:800;font-size:16.5px;letter-spacing:-.01em;
  color:var(--ets-ink);margin:0 0 6px}
.why__p{font-size:15px;line-height:1.68;color:var(--ets-muted);margin:0}

/* ============================================================
   HOW IT WORKS  (dark numbered steps)
   ============================================================ */
.steps{background:var(--ets-ink);color:rgba(255,255,255,.8);padding:var(--ets-section) 0}
.steps .h2{color:#fff}
.steps .lede{color:rgba(255,255,255,.72)}
.steps__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.6vw,38px);
  border-top:2px solid var(--ets-orange);padding-top:clamp(32px,3.6vw,48px)}
.steps__n{display:block;font-family:var(--ets-font-head);font-weight:900;
  font-size:clamp(30px,3.4vw,44px);line-height:1;letter-spacing:-.04em;
  color:var(--ets-orange);margin:0 0 16px}
.steps__h{font-family:var(--ets-font-head);font-weight:800;font-size:16.5px;
  letter-spacing:-.01em;color:#fff;margin:0 0 9px}
.steps__p{font-size:14.5px;line-height:1.68;color:rgba(255,255,255,.68);margin:0}
@media (max-width:900px){.steps__grid{grid-template-columns:1fr 1fr;gap:32px}}
@media (max-width:520px){.steps__grid{grid-template-columns:1fr}}

/* ============================================================
   PHOTO GALLERY  (large rotating feature + thumbnail grid)
   ============================================================ */
.gal{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(12px,1.4vw,18px);align-items:stretch}
.gal__feat{position:relative;overflow:hidden;background:var(--ets-lavender);
  aspect-ratio:4/3;min-height:0}
.gal__feat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .9s ease}
.gal__feat img.is-on{opacity:1}
.gal__cap{position:absolute;left:0;bottom:0;z-index:3;background:rgba(25,21,33,.82);color:#fff;
  font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;padding:10px 16px}
.gal__dots{position:absolute;right:14px;bottom:14px;z-index:3;display:flex;gap:7px}
.gal__dot{width:7px;height:7px;border:0;padding:0;cursor:pointer;background:rgba(255,255,255,.45);
  transition:background .2s,transform .2s}
.gal__dot.is-on{background:var(--ets-orange);transform:scale(1.3)}
.gal__thumbs{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,1fr);
  gap:clamp(12px,1.4vw,18px)}
.gal__thumb{position:relative;overflow:hidden;background:var(--ets-lavender);border:0;padding:0;
  cursor:pointer;min-height:0}
.gal__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s,opacity .25s}
.gal__thumb:hover img{transform:scale(1.05)}
.gal__thumb::after{content:"";position:absolute;inset:0;border:3px solid transparent;transition:border-color .25s}
.gal__thumb.is-on::after{border-color:var(--ets-orange)}
@media (max-width:900px){
  .gal{grid-template-columns:1fr}
  .gal__thumbs{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);
    aspect-ratio:3/1.4}
}
@media (max-width:520px){.gal__thumbs{grid-template-columns:repeat(3,1fr);aspect-ratio:3/2}}

/* ============================================================
   FAQ, ANSWERS SHOWN  (no accordion)
   ============================================================ */
.qa{border-top:1px solid var(--ets-border)}
.qa__item{display:grid;grid-template-columns:auto 1fr;gap:clamp(16px,2.4vw,34px);
  padding:clamp(26px,3vw,38px) 0;border-bottom:1px solid var(--ets-border)}
.qa__n{font-family:var(--ets-font-head);font-weight:800;font-size:12px;letter-spacing:.14em;
  color:var(--ets-orange);padding-top:6px}
.qa__q{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(15.5px,1.35vw,18px);line-height:1.3;letter-spacing:-.02em;color:var(--ets-ink);margin:0 0 7px}
.qa__a{font-size:15.5px;line-height:1.6;color:var(--ets-body);margin:0;max-width:70ch}
.qa__a p{margin:0 0 14px}
.qa__a p:last-child{margin-bottom:0}
@media (max-width:560px){.qa__item{grid-template-columns:1fr;gap:10px}
  .qa__n{padding-top:0}}

/* ============================================================
   REVISION PASS
   Overrides sit at the end so they win the cascade.
   ============================================================ */

/* --- swappable section tint: cool purple-grey by default --- */
:root{--ets-sec-alt:#f6f5fa; --ets-panel:#f4f3f7}

/* --- accent italics: reserved for heroes and closing CTAs --- */
/* accent italics: add class "is-plain" to an em to opt it out */
.h2 em.is-plain,.phero__title em.is-plain,.cta__h em.is-plain{font-style:normal;color:inherit;font-weight:inherit}

/* --- sticky header, with a shadow once you scroll --- */
.hd__bar{position:sticky;top:0;z-index:50;transition:box-shadow .25s,height .25s}
.hd__bar.is-stuck{box-shadow:0 10px 30px -18px rgba(25,21,33,.55)}
.hd__bar.is-stuck .shell{height:88px}
@media (max-width:640px){.hd__bar.is-stuck .shell{height:72px}}

/* --- dimension: cards lift off the page at rest, not only on hover --- */
.ind__card,.svc__card,.tst__card,.com__card,.paths__card{
  box-shadow:0 1px 2px rgba(25,21,33,.04),0 10px 26px -20px rgba(25,21,33,.32)}
.ind__card:hover,.svc__card:hover,.tst__card:hover,.com__card:hover,.paths__card:hover{
  box-shadow:0 2px 4px rgba(25,21,33,.06),0 26px 48px -26px rgba(25,21,33,.42)}
.ind__card{background:#fff}
.ind__card:hover{background:#fff}

/* soft depth under full-width bands */
.steps{position:relative;overflow:hidden}
.steps::before{content:"";position:absolute;left:-180px;bottom:-220px;width:620px;height:620px;
  background:radial-gradient(circle,rgba(103,52,185,.28),transparent 70%);pointer-events:none}
.steps .shell{position:relative;z-index:2}
.sec--deep{position:relative;overflow:hidden}

/* --- office card: light grey panel, purple phone, rule above the button --- */
.office{box-shadow:0 2px 6px rgba(25,21,33,.05),0 30px 60px -34px rgba(25,21,33,.45);
  border-color:#ded9e8}
.office__body{background:var(--ets-panel)}
.office__row a{color:var(--ets-purple);font-weight:800}
.office__row a:hover{color:var(--ets-purple-deep)}
.office__actions{margin-top:clamp(22px,2.4vw,30px);padding-top:clamp(20px,2.2vw,26px);
  border-top:1px solid #ddd8e6}
.office__map{background:var(--ets-lavender);
  box-shadow:inset 0 0 0 1px rgba(25,21,33,.05)}

/* --- jobs: louder pay, real arrow affordance, anchored button --- */
.jobs{border-top:2px solid var(--ets-orange)}
.jobs__row{border-bottom:1px solid var(--ets-border)}
.jobs__row:hover{background:#fff;
  box-shadow:0 1px 2px rgba(25,21,33,.04),0 14px 30px -22px rgba(25,21,33,.4)}
.jobs__t{font-size:clamp(17px,1.8vw,21px)}
.jobs__pay{font-family:var(--ets-font-head);font-weight:900;
  font-size:clamp(17px,1.9vw,22px);letter-spacing:-.02em;color:var(--ets-purple);
  background:var(--ets-tint);padding:9px 15px;line-height:1.2}
.jobs__row:hover .jobs__pay{background:var(--ets-purple);color:#fff}
.jobs__go{width:38px;height:38px;flex:none;display:grid;place-items:center;
  background:var(--ets-tint);transition:background .2s,transform .2s}
.jobs__go svg{width:15px;height:15px;stroke:var(--ets-purple);fill:none;stroke-width:2.6;
  transition:stroke .2s,transform .2s}
.jobs__row:hover .jobs__go{background:var(--ets-orange)}
.jobs__row:hover .jobs__go svg{stroke:#fff;transform:translateX(3px)}
.jobs__foot{margin-top:clamp(30px,3.2vw,44px);padding-top:clamp(26px,2.8vw,34px);
  border-top:1px solid var(--ets-border);display:flex;align-items:center;
  justify-content:space-between;gap:20px;flex-wrap:wrap}
.jobs__foot .btn{padding:19px 34px;font-size:12.5px;
  box-shadow:0 2px 4px rgba(25,21,33,.08),0 16px 30px -18px rgba(103,52,185,.75)}
.jobs__foot .btn:hover{transform:translateY(-2px)}
.jobs__note{font-size:14.5px;color:var(--ets-muted);margin:0}

/* --- gallery: orange badge, framed feature --- */
.gal__cap{background:var(--ets-orange);color:#fff}
.gal__feat{box-shadow:0 3px 8px rgba(25,21,33,.07),0 34px 64px -36px rgba(25,21,33,.5)}
.gal__thumb{box-shadow:0 1px 2px rgba(25,21,33,.05),0 10px 22px -18px rgba(25,21,33,.35)}

/* --- FAQ supporting paragraph: purple phone --- */
.lede a.tel{color:var(--ets-purple);font-weight:800;text-decoration:none;
  border-bottom:2px solid var(--ets-lavender)}
.lede a.tel:hover{color:var(--ets-purple-deep);border-color:var(--ets-purple)}
.qa__item{transition:background .2s}
.qa__item:hover{background:rgba(255,255,255,.7)}

/* --- richer, more varied scroll motion --- */
html.ets-js .rv{opacity:0;transform:translateY(34px);
  transition:opacity .8s cubic-bezier(.16,.84,.44,1),transform .8s cubic-bezier(.16,.84,.44,1)}
.rv-left{transform:translateX(-38px)}
.rv-right{transform:translateX(38px)}
.rv-zoom{transform:scale(.955)}
.rv-rise{transform:translateY(56px)}
.rv.is-in{opacity:1;transform:none}
.rv-d7{transition-delay:.56s}.rv-d8{transition-delay:.64s}

/* per-child stagger without hand-numbering every card */
html.ets-js .stagger>*{opacity:0;transform:translateY(30px);
  transition:opacity .75s cubic-bezier(.16,.84,.44,1),transform .75s cubic-bezier(.16,.84,.44,1)}
.stagger.is-in>*{opacity:1;transform:none}
.stagger.is-in>*:nth-child(1){transition-delay:.02s}
.stagger.is-in>*:nth-child(2){transition-delay:.10s}
.stagger.is-in>*:nth-child(3){transition-delay:.18s}
.stagger.is-in>*:nth-child(4){transition-delay:.26s}
.stagger.is-in>*:nth-child(5){transition-delay:.34s}
.stagger.is-in>*:nth-child(6){transition-delay:.42s}
.stagger.is-in>*:nth-child(7){transition-delay:.50s}
.stagger.is-in>*:nth-child(8){transition-delay:.58s}

@media (prefers-reduced-motion:reduce){
  .rv,.stagger>*{opacity:1 !important;transform:none !important;transition:none !important}
}

/* ============================================================
   FOOTER RESOURCES BAND (external links)
   ============================================================ */
.ft__res{border-top:1px solid var(--ets-border);background:var(--ets-sec-alt)}
.ft__res .shell{padding-top:clamp(34px,3.6vw,52px);padding-bottom:clamp(30px,3.2vw,44px)}
.ft__reslbl{font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ets-light);margin:0 0 22px}
/* One row per state, label left and links flowing across, rather than three
   tall columns. These are courtesy links to other people's websites, so they
   should take up about as much room as a footnote. */
.ft__resgrid{display:grid;gap:12px}
.ft__resgrp{display:grid;grid-template-columns:92px 1fr;gap:10px 20px;align-items:baseline}
.ft__resst{font-family:var(--ets-font-head);font-weight:800;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ets-light);margin:0}
.ft ul.ft__reslinks{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:7px 20px}
.ft ul.ft__reslinks a{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--ets-muted);
  text-decoration:none;line-height:1.5;transition:color .16s}
.ft__reslinks a:hover{color:var(--ets-purple)}
.ft ul.ft__reslinks svg{width:9px;height:9px;stroke:var(--ets-light);fill:none;stroke-width:2.4;
  flex:none;transition:transform .18s}
.ft__reslinks a:hover svg{stroke:var(--ets-orange);transform:translate(2px,-2px)}
.ft__resnote{font-size:12.5px;line-height:1.6;color:var(--ets-light);margin:22px 0 0;max-width:82ch}
@media (max-width:720px){.ft__resgrp{grid-template-columns:1fr;gap:6px}}

/* ============================================================
   COMPONENT KIT: buttons, spacers, swatches, icons
   ============================================================ */
.btn--sm{padding:11px 18px;font-size:10.5px}
.btn--lg{padding:20px 36px;font-size:13px}
.btn--wide{width:100%}
.btn--dark{background:var(--ets-ink);border-color:var(--ets-ink)}
.btn--dark:hover{background:#000;border-color:#000}
.btn--ghost{background:transparent;color:var(--ets-purple);border-color:transparent;padding-left:0;padding-right:0}
.btn--ghost:hover{background:transparent;color:var(--ets-orange-dark);gap:14px}
.btn--white{background:#fff;color:var(--ets-purple);border-color:#fff}
.btn--white:hover{background:var(--ets-tint);border-color:var(--ets-tint);color:var(--ets-purple-deep)}
.btn--pill{border-radius:999px}
.btn[disabled],.btn--disabled{opacity:.45;pointer-events:none}

.kit{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.kit--dark{background:var(--ets-purple-deep);padding:clamp(20px,2.2vw,28px)}
.kitlbl{font-family:var(--ets-font-head);font-weight:800;font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ets-light);margin:0 0 12px;width:100%}
.kit--dark .kitlbl{color:rgba(255,255,255,.55)}

.spacer{background:repeating-linear-gradient(45deg,var(--ets-tint),var(--ets-tint) 6px,#fff 6px,#fff 12px);
  border:1px dashed var(--ets-lavender);display:grid;place-items:center;
  font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ets-purple)}
.sp-xs{height:16px}.sp-s{height:32px}.sp-m{height:56px}.sp-l{height:88px}.sp-xl{height:128px}

.swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.sw__chip{height:76px;border:1px solid rgba(25,21,33,.08)}
.sw__n{font-family:var(--ets-font-head);font-weight:800;font-size:12px;color:var(--ets-ink);margin:10px 0 2px}
.sw__v{font-size:11.5px;color:var(--ets-muted);margin:0;font-variant-numeric:tabular-nums}
.sw__u{font-size:11.5px;color:var(--ets-light);margin:4px 0 0;line-height:1.45}
@media (max-width:900px){.swatches{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.swatches{grid-template-columns:repeat(2,1fr)}}

.icons{display:grid;grid-template-columns:repeat(8,1fr);gap:14px}
.ico__cell{border:1px solid var(--ets-border);padding:16px 8px;text-align:center;background:#fff}
.ico__cell svg{width:24px;height:24px;stroke:var(--ets-purple);fill:none;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;margin:0 auto 9px;display:block}
.ico__cell span{font-size:10.5px;color:var(--ets-muted);line-height:1.35;display:block}
@media (max-width:900px){.icons{grid-template-columns:repeat(5,1fr)}}
@media (max-width:560px){.icons{grid-template-columns:repeat(3,1fr)}}

/* ============================================================
   FORMS
   ============================================================ */
.form{background:#fff;border:1px solid var(--ets-border);padding:clamp(26px,3vw,44px);
  box-shadow:0 2px 6px rgba(25,21,33,.05),0 30px 60px -34px rgba(25,21,33,.4)}
.form__step{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 6px}
.form__h{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(18px,1.9vw,22px);
  letter-spacing:-.02em;color:var(--ets-ink);margin:0}
.form__n{font-family:var(--ets-font-head);font-weight:800;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ets-light);flex:none}
.form__sub{font-size:14.5px;color:var(--ets-muted);margin:0 0 22px}
.form__intents{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin:0 0 8px}
.form__intent{border:1px solid var(--ets-border);background:#fff;padding:18px 16px;text-align:left;
  cursor:pointer;transition:.18s;font-family:var(--ets-font-body)}
.form__intent:hover{border-color:var(--ets-purple);background:var(--ets-tint)}
.form__intent[aria-pressed="true"]{border-color:var(--ets-purple);background:var(--ets-tint);
  box-shadow:inset 0 0 0 1px var(--ets-purple)}
.form__intent svg{width:19px;height:19px;stroke:var(--ets-purple);fill:none;stroke-width:1.9;
  margin:0 0 12px;display:block}
.form__intent b{display:block;font-family:var(--ets-font-head);font-weight:800;font-size:14.5px;
  color:var(--ets-ink);margin-bottom:4px}
.form__intent span{display:block;font-size:12.5px;color:var(--ets-muted);line-height:1.5}
.form__rule{border:0;border-top:1px solid var(--ets-border);margin:clamp(26px,2.8vw,34px) 0}
.form__grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 24px}
.form__f{display:flex;flex-direction:column}
.form__f--full{grid-column:1 / -1}
.form__f label{font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ets-body);margin:0 0 9px}
.form__f label i{color:var(--ets-orange);font-style:normal}
.form__f input,.form__f select,.form__f textarea{border:0;border-bottom:1px solid var(--ets-border);
  background:transparent;padding:9px 0;font-family:var(--ets-font-body);font-size:16px;
  color:var(--ets-ink);outline:none;transition:border-color .18s;width:100%}
.form__f textarea{min-height:96px;resize:vertical}
.form__f input:focus,.form__f select:focus,.form__f textarea:focus{border-bottom-color:var(--ets-purple)}
.form__f input::placeholder,.form__f textarea::placeholder{color:var(--ets-light)}
.form__hint{font-size:12.5px;color:var(--ets-light);margin:8px 0 0}
.form__check{display:flex;gap:12px;align-items:flex-start;margin:clamp(22px,2.4vw,28px) 0 0;
  font-size:14.5px;line-height:1.6;color:var(--ets-body)}
.form__check input{width:18px;height:18px;flex:none;margin-top:3px;accent-color:var(--ets-purple)}
.form__foot{margin:clamp(24px,2.6vw,32px) 0 0;padding-top:clamp(22px,2.4vw,28px);
  border-top:1px solid var(--ets-border)}
.form__foot .btn{width:100%;padding:19px}
.form__note{font-size:13px;color:var(--ets-muted);margin:14px 0 0;text-align:center}
.form__note a{color:var(--ets-purple);font-weight:700;text-decoration:none}
@media (max-width:700px){.form__grid{grid-template-columns:1fr}
  .form__intents{grid-template-columns:1fr}}

/* ============================================================
   THANK YOU
   ============================================================ */
.ty{text-align:center;max-width:64ch;margin:0 auto}
.ty__mark{width:70px;height:70px;margin:0 auto clamp(24px,2.6vw,32px);display:grid;place-items:center;
  background:var(--ets-purple);border-radius:50%}
.ty__mark svg{width:32px;height:32px;stroke:#fff;fill:none;stroke-width:2.6;
  stroke-linecap:round;stroke-linejoin:round}
.ty__h{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(30px,4.2vw,50px);
  line-height:1.05;letter-spacing:-.03em;color:var(--ets-ink);margin:0 0 18px}
.ty__h em{color:var(--ets-orange);font-style:italic;font-weight:900}
.ty__p{font-size:clamp(16px,1.4vw,18.5px);line-height:1.7;color:var(--ets-muted);margin:0 auto 34px;max-width:56ch}
.ty__next{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,20px);
  text-align:left;margin:clamp(36px,4vw,56px) 0 0}
.ty__step{border-top:3px solid var(--ets-orange);padding-top:20px}
.ty__step b{display:block;font-family:var(--ets-font-head);font-weight:800;font-size:15.5px;
  color:var(--ets-ink);margin:0 0 8px}
.ty__step p{margin:0;font-size:14.5px;line-height:1.65;color:var(--ets-muted)}
.ty__ref{display:inline-flex;align-items:center;gap:10px;background:var(--ets-tint);
  padding:12px 20px;margin:0 0 28px;font-size:14px;color:var(--ets-body)}
.ty__ref b{font-family:var(--ets-font-head);font-weight:800;color:var(--ets-purple);
  font-variant-numeric:tabular-nums}
@media (max-width:760px){.ty__next{grid-template-columns:1fr;gap:22px}}

/* ============================================================
   STARTER TEMPLATE BLOCKS
   ============================================================ */
/* numbered steps, light (the "4 clear steps" shape) */
.lsteps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.6vw,34px)}
.lsteps__n{width:56px;height:56px;display:grid;place-items:center;margin:0 0 22px;
  font-family:var(--ets-font-head);font-weight:900;font-size:21px;letter-spacing:-.02em}
.lsteps__i:nth-child(odd) .lsteps__n{background:var(--ets-purple);color:#fff}
.lsteps__i:nth-child(even) .lsteps__n{background:var(--ets-tint);color:var(--ets-purple)}
.lsteps__h{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(17px,1.8vw,21px);
  letter-spacing:-.02em;color:var(--ets-ink);margin:0 0 10px}
.lsteps__p{font-size:14.5px;line-height:1.68;color:var(--ets-muted);margin:0}
@media (max-width:900px){.lsteps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.lsteps{grid-template-columns:1fr}}

/* image beside a 2x2 card grid (the "Why SEC" shape) */
.imggrid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(16px,2vw,24px);align-items:stretch}
.imggrid__media{background:var(--ets-lavender);overflow:hidden;min-height:340px}
.imggrid__media img{width:100%;height:100%;object-fit:cover;display:block}
.imggrid__cards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,24px)}
@media (max-width:900px){.imggrid{grid-template-columns:1fr}
  .imggrid__media{min-height:240px}}
@media (max-width:560px){.imggrid__cards{grid-template-columns:1fr}}

/* checkmark list beside an offset image pair (the plumbing shape) */
.offset{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,64px);align-items:center}
.offset__media{position:relative;padding-bottom:60px}
.offset__a{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--ets-lavender);display:block}
.offset__b{position:absolute;left:0;bottom:0;width:44%;aspect-ratio:4/3;object-fit:cover;
  background:var(--ets-tint);border:8px solid #fff;display:block;
  box-shadow:0 20px 44px -24px rgba(25,21,33,.5)}
@media (max-width:860px){.offset{grid-template-columns:1fr}}

/* two-tone split panel (the VEA businesses/workers shape) */
.duo{display:grid;grid-template-columns:1fr 1fr}
.duo__side{padding:clamp(30px,3.4vw,52px)}
.duo__side--dark{background:var(--ets-purple-deep);color:rgba(255,255,255,.82)}
.duo__side--light{background:var(--ets-sec-alt)}
.duo__lbl{font-family:var(--ets-font-head);font-weight:800;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;margin:0 0 16px;color:var(--ets-light)}
.duo__side--dark .duo__lbl{color:rgba(255,255,255,.55)}
.duo__h{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(21px,2.4vw,30px);
  line-height:1.14;letter-spacing:-.025em;color:var(--ets-ink);margin:0 0 14px}
.duo__side--dark .duo__h{color:#fff}
.duo__p{font-size:15.5px;line-height:1.68;margin:0 0 20px;color:var(--ets-muted)}
.duo__side--dark .duo__p{color:rgba(255,255,255,.72)}
.duo__list{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:10px}
.duo__list li{position:relative;padding-left:18px;font-size:15px;line-height:1.6;color:var(--ets-body)}
.duo__list li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;
  background:var(--ets-orange)}
.duo__side--dark .duo__list li{color:rgba(255,255,255,.82)}
.duo__btns{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:800px){.duo{grid-template-columns:1fr}}

/* vertical milestone timeline (the VEA story shape) */
.tl{position:relative;padding-left:34px}
.tl::before{content:"";position:absolute;left:5px;top:8px;bottom:8px;width:1px;background:var(--ets-border)}
.tl__i{position:relative;padding-bottom:clamp(28px,3vw,44px)}
.tl__i:last-child{padding-bottom:0}
.tl__i::before{content:"";position:absolute;left:-34px;top:7px;width:11px;height:11px;
  background:var(--ets-purple);border-radius:50%;box-shadow:0 0 0 4px #fff}
.tl__y{font-family:var(--ets-font-head);font-weight:800;font-size:11.5px;letter-spacing:.16em;
  color:var(--ets-orange);margin:0 0 7px}
.tl__h{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(18px,1.9vw,23px);
  letter-spacing:-.02em;color:var(--ets-ink);margin:0 0 9px}
.tl__p{font-size:15px;line-height:1.68;color:var(--ets-muted);margin:0;max-width:60ch}

/* blank canvas markers for starter templates */
.blank{border:1px dashed var(--ets-lavender);background:
  repeating-linear-gradient(45deg,rgba(103,52,185,.03),rgba(103,52,185,.03) 8px,transparent 8px,transparent 16px);
  display:grid;place-items:center;text-align:center;padding:clamp(28px,3.4vw,52px);
  color:var(--ets-light);font-family:var(--ets-font-head);font-weight:800;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase}
.blank small{display:block;font-family:var(--ets-font-body);font-weight:400;font-size:13px;
  letter-spacing:0;text-transform:none;color:var(--ets-muted);margin-top:9px;max-width:48ch}

/* ============================================================
   RESPONSIVE FIXES  (found by breakpoint audit)
   ============================================================ */
/* split modifiers, so stacking is never beaten by an inline style */
.split--top{align-items:start}
.split--rail{grid-template-columns:1.55fr 1fr;align-items:start}
@media (max-width:900px){
  .split,.split--rail{grid-template-columns:1fr;gap:clamp(26px,4vw,40px)}
}

/* why-us grid had no stacking rule at all */
@media (max-width:980px){
  .why{grid-template-columns:1fr;gap:clamp(28px,4vw,44px)}
  .why__list{max-width:none}
}

/* header actions on narrow phones: the two buttons plus the burger did not fit */
@media (max-width:480px){
  .hd__cta{gap:8px}
  .hd__cta .btn{padding:11px 12px;font-size:9.5px;letter-spacing:.08em}
}
@media (max-width:420px){
  .hd__cta .btn--orange{display:none}
  .hd__bar .shell{gap:10px}
}
@media (max-width:360px){
  .hd__cta .btn{display:none}
  .hd__logo small{display:none}
}

/* office card and pattern-sheet frames on small screens */
@media (max-width:560px){
  .pat__bar{gap:8px}
  .pat__tag{margin-left:0}
  .office__body,.office__map{min-width:0}
}

/* tables always scroll inside their own box rather than the page */
.bd__t,.plan{display:block;overflow-x:auto;white-space:nowrap}
@media (min-width:820px){.bd__t,.plan{display:table;white-space:normal}}

/* Grid and flex children default to min-width:auto, which lets wide content
   push a column past its track and overflow the page. Reset it everywhere
   we lay out in columns. */
.split>*,.why>*,.crow>*,.imggrid>*,.imggrid__cards>*,.duo>*,.bd>*,
.phero__grid>*,.head>*,.loc__grid>*,.story>*,.offset>*,.gal>*,
.stats__grid>*,.steps__grid>*,.lsteps>*,.team>*,.cmp>*,.tst__grid>*,
.ind__grid>*,.svc__grid>*,.paths__grid>*,.com__grid>*,.ft__grid>*,
.ft__resgrid>*,.form__grid>*,.form__intents>*,.qa__item>*,.rail>*{min-width:0}
.why__list,.rail,.form{max-width:100%}
.why__item>span,.office__row>span,.traits__list>span{min-width:0}

/* The slide-in-from-the-side reveals sat 38px outside the layout until they
   animated, which produced a horizontal scrollbar on first paint. Keep the
   sideways motion only where there is room for it, and fall back to a rise
   everywhere else. */
html.ets-js .rv-left,html.ets-js .rv-right{transform:translateY(34px)}
@media (min-width:1180px){
  html.ets-js .rv-left{transform:translateX(-34px)}
  html.ets-js .rv-right{transform:translateX(34px)}
}
.rv.is-in,.rv-left.is-in,.rv-right.is-in{transform:none}

/* A card that contains its own links cannot itself be a link. This variant
   keeps the hover treatment on the card while the anchor inside does the
   navigating. */
.pcard--static{cursor:default}
.pcard--static:hover{transform:translateY(-4px)}
.pcard--static .pcard__link{text-decoration:none;color:var(--ets-orange);
  display:inline-flex;align-items:center;gap:8px}
.pcard--static:hover .pcard__link{gap:12px;color:var(--ets-orange-dark)}

/* ============================================================
   CORE BLOCK BRIDGE
   Maps WordPress core block markup onto the component styles
   above, so patterns stay editable in the block editor instead
   of being frozen HTML.
   ============================================================ */

/* buttons: core renders .wp-block-button__link, our styles target .btn */
.wp-block-button__link{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:16px 28px;background:var(--ets-purple);color:#fff;
  border:2px solid var(--ets-purple);border-radius:0;
  font-family:var(--ets-font-head);font-weight:800;font-size:11.5px;
  letter-spacing:.13em;text-transform:uppercase;text-decoration:none;
  transition:.2s;white-space:nowrap}
.wp-block-button__link:hover{background:var(--ets-purple-deep);border-color:var(--ets-purple-deep);color:#fff}
.wp-block-button__link::after{content:"";width:13px;height:13px;flex:none;transition:transform .2s;
  background:no-repeat center/contain
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4'%3E%3Cpath d='M5 12h13M13 6l6 6-6 6'/%3E%3C/svg%3E")}
.wp-block-button__link:hover::after{transform:translateX(4px)}

.is-style-ets-orange .wp-block-button__link{background:var(--ets-orange);border-color:var(--ets-orange)}
.is-style-ets-orange .wp-block-button__link:hover{background:var(--ets-orange-dark);border-color:var(--ets-orange-dark)}
.is-style-ets-line .wp-block-button__link{background:transparent;color:var(--ets-purple);border-color:var(--ets-lavender)}
.is-style-ets-line .wp-block-button__link:hover{background:var(--ets-purple);color:#fff;border-color:var(--ets-purple)}
.is-style-ets-line .wp-block-button__link::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236734b9' stroke-width='2.4'%3E%3Cpath d='M5 12h13M13 6l6 6-6 6'/%3E%3C/svg%3E")}
.is-style-ets-line .wp-block-button__link:hover::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4'%3E%3Cpath d='M5 12h13M13 6l6 6-6 6'/%3E%3C/svg%3E")}
.is-style-ets-dark .wp-block-button__link{background:var(--ets-ink);border-color:var(--ets-ink)}
.is-style-ets-dark .wp-block-button__link:hover{background:#000;border-color:#000}
.is-style-ets-white .wp-block-button__link{background:#fff;color:var(--ets-purple);border-color:#fff}
.is-style-ets-white .wp-block-button__link:hover{background:var(--ets-tint);border-color:var(--ets-tint);color:var(--ets-purple-deep)}
.is-style-ets-ghost .wp-block-button__link{background:transparent;color:var(--ets-purple);
  border-color:transparent;padding-left:0;padding-right:0}
.is-style-ets-ghost .wp-block-button__link:hover{background:transparent;color:var(--ets-orange-dark);gap:14px}
.is-style-ets-pill .wp-block-button__link{border-radius:999px}
.cta__btns .is-style-ets-line .wp-block-button__link{color:#fff;border-color:rgba(255,255,255,.4)}
.cta__btns .is-style-ets-line .wp-block-button__link:hover{background:#fff;color:var(--ets-purple-deep);border-color:#fff}

/* navigation: core markup, our look */
.hd__nav .wp-block-navigation__container{gap:0}
.hd__nav .wp-block-navigation-item__content{
  padding:12px 15px;font-family:var(--ets-font-head);font-weight:700;font-size:16px;
  color:var(--ets-body);text-decoration:none;white-space:nowrap;transition:color .16s}
.hd__nav .wp-block-navigation-item__content:hover,
.hd__nav .wp-block-navigation-item.has-child:hover>.wp-block-navigation-item__content{color:var(--ets-purple)}
.hd__nav .wp-block-navigation__submenu-container{
  background:#fff;border:1px solid var(--ets-border);border-top:3px solid var(--ets-orange);
  box-shadow:0 20px 44px -26px rgba(25,21,33,.5);min-width:290px;padding:8px 0;border-radius:0;left:0}
.hd__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
  display:block;padding:10px 22px;font-size:14.5px;font-weight:400;
  border-left:3px solid transparent;transition:.14s}
.hd__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover{
  background:var(--ets-tint);border-left-color:var(--ets-purple);color:var(--ets-purple)}
.hd__nav .wp-block-navigation__responsive-container.is-menu-open{background:#fff;padding:24px}
.hd__nav .wp-block-navigation__responsive-container-open,
.hd__nav .wp-block-navigation__responsive-container-close{color:var(--ets-purple)}

/* social links in the two bars */
.hd__social .wp-block-social-links{gap:8px}
.hd__social .wp-block-social-link{background:rgba(255,255,255,.14);border-radius:50%}
.hd__social .wp-block-social-link:hover{background:var(--ets-orange)}


/* site logo */
.hd__logo img{height:64px;width:auto;max-width:none}
@media (max-width:640px){.hd__logo img{height:48px}}

/* group style variations registered in functions.php */
.is-style-ets-section{padding-top:var(--ets-section);padding-bottom:var(--ets-section)}
.is-style-ets-section-alt{padding-top:var(--ets-section);padding-bottom:var(--ets-section);
  background:var(--ets-sec-alt)}
.is-style-ets-section-dark{padding-top:var(--ets-section);padding-bottom:var(--ets-section);
  background:var(--ets-ink);color:rgba(255,255,255,.8)}
.is-style-ets-section-dark :is(h1,h2,h3){color:#fff}

/* core columns inside our grids should not fight the grid */
.phero__grid.wp-block-columns{gap:clamp(28px,4vw,72px)}
.wp-block-columns{margin-bottom:0}

/* editor: give the canvas the same shell so patterns look right while editing */
.editor-styles-wrapper .shell{width:100%;max-width:var(--ets-shell);margin:0 auto;
  padding-left:var(--ets-gutter);padding-right:var(--ets-gutter)}

/* A hero with no photo yet renders transparent, so it gets a near solid brand
   gradient to stand in. That fallback used to key off .has-background-image,
   which the markup never actually sets, so EVERY hero got the stand-in and the
   purple buried the photo underneath. The test is now the presence of the media
   element itself, which is what really tells us whether there is a photo. */
.hero,.phero{background-color:var(--ets-purple)}
.hero:not(:has(.hero__media)) .hero__scrim,
.phero:not(.hero--flat):not(:has(.phero__media)) .phero__scrim{
  background-image:linear-gradient(105deg,rgba(45,22,85,.9) 0%,rgba(77,36,160,.85) 45%,rgba(103,52,185,.8) 100%)}

/* With a photo behind it the scrim only has to protect the text, which lives in
   the left 58%. It clears off to almost nothing on the right so the photo is
   visible, and the headline picks up a soft shadow to hold its edge. */
.hero:has(.hero__media) .hero__scrim,
.phero:not(.hero--flat):has(.phero__media) .phero__scrim{
  background-image:linear-gradient(105deg,
    rgba(45,22,85,.93) 0%, rgba(58,28,104,.78) 30%,
    rgba(90,45,165,.34) 64%, rgba(120,70,200,.08) 100%)}
.hero:has(.hero__media) .hero__title,
.phero:has(.phero__media) .phero__title,
.phero:has(.phero__media) .h1{text-shadow:0 1px 2px rgba(18,7,38,.55),0 3px 12px rgba(18,7,38,.5),0 8px 34px rgba(18,7,38,.38)}
.hero:has(.hero__media) .hero__in p,
.phero:has(.phero__media) .phero__inner p,
.phero:has(.phero__media) .crumbs{text-shadow:0 1px 12px rgba(25,10,50,.45)}
.hero .wp-block-cover__background,.phero .wp-block-cover__background{display:none}
.hero .wp-block-cover__inner-container,.phero .wp-block-cover__inner-container{width:100%;z-index:5}

/* Sections size themselves through their own .shell, so main and the post
   content wrapper must not impose a width of their own. Prose pages get their
   reading measure from .rich, not from the layout. */
main > .entry-content,
main > .wp-block-post-content{max-width:none;width:100%}
main .wp-block-post-content > *{max-width:none}
main .wp-block-post-content > .rich,
main .wp-block-post-content > p,
main .wp-block-post-content > ul,
main .wp-block-post-content > ol,
main .wp-block-post-content > h2,
main .wp-block-post-content > h3{max-width:var(--ets-measure);margin-left:auto;margin-right:auto;
  padding-left:var(--ets-gutter);padding-right:var(--ets-gutter)}

/* Reveals are opt-in via the ets-js class that theme.js adds to <html> before
   paint. If the script never runs, if this is an editor preview, or if a crawler
   does not execute JavaScript, every section renders visible. Content must never
   depend on JavaScript to be seen. */
.rv,.stagger>*{opacity:1;transform:none}
html.ets-js .rv.is-in,html.ets-js .stagger.is-in>*{opacity:1;transform:none}

/* mobile accordion menu, restored with the three-tier header */
.hd__mob{display:none}
.hd__mob[hidden]{display:none}
@media (max-width:1375px){
  .hd__mob{display:block;background:#fff;border-bottom:1px solid var(--ets-border)}
  .hd__mob[hidden]{display:none}
  .hd__mob .hd__drop{border-top:1px solid #f0eef6;position:static}
  .hd__mob .hd__drop>summary{display:flex;align-items:center;justify-content:space-between;
    padding:16px var(--ets-gutter);font-family:var(--ets-font-head);font-weight:800;
    font-size:16px;color:var(--ets-ink)}
  .hd__mob .hd__panel{position:static;border:0;box-shadow:none;min-width:0;
    background:var(--ets-tint);padding:4px 0;column-count:1}
  .hd__mob .hd__panel a{padding:12px var(--ets-gutter) 12px calc(var(--ets-gutter) + 14px)}
  .hd__mob>.hd__link{display:flex;padding:16px var(--ets-gutter);
    font-family:var(--ets-font-head);font-weight:800;font-size:16px;
    color:var(--ets-ink);border-top:1px solid #f0eef6}
  .hd__mobcta{display:grid;gap:10px;padding:16px var(--ets-gutter) 20px;
    border-top:1px solid #f0eef6}
  .hd__mobcta .btn{width:100%;padding:15px}
}
.hd__logo img{height:64px;width:auto;max-width:none;display:block}
@media (max-width:640px){.hd__logo img{height:48px}}

/* Heroes are Groups, not Cover blocks. Cover's stylesheet forces its inner
   container to z-index 1 with a selector too specific to override cleanly, which
   put the scrim on top of the headline. A Group carries a background image just
   as well and brings none of that. */
.hero__inner,.phero__inner{position:relative;z-index:5;width:100%}
.hero__scrim,.phero__scrim{z-index:2}
.hero,.phero{background-size:cover;background-position:center}

/* ============================================================
   RECOVERED COMPONENT RULES
   These selectors are used by the patterns but were missing from
   this stylesheet, so those blocks rendered unstyled: link icons
   at full viewport size, card and comparison grids with no
   columns, and a header that did not stick. Ported back from the
   approved mockup CSS. Only selectors absent here were added, so
   nothing that was deliberately restyled for the theme changed.
   ============================================================ */
.ets-header{position:sticky;top:0;z-index:60}
.ets-header.is-stuck .hd__util{max-height:0;opacity:0}
.ets-header.is-stuck .hd__util .shell{padding-top:0;padding-bottom:0}
.ets-header.is-stuck .hd__bar{box-shadow:0 12px 32px -20px rgba(25,21,33,.6)}
.ets-header.is-stuck .hd__bar .shell{height:88px}
@media (max-width:640px){
  .ets-header.is-stuck .hd__bar .shell{height:70px}}
.crow{display:grid;gap:clamp(14px,1.6vw,20px)}
.crow--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:1024px){
  .crow--3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){
  .crow--3{grid-template-columns:1fr}}
.pcard{position:relative;background:#fff;border:1px solid var(--ets-border);
  padding:clamp(24px,2.6vw,34px);display:flex;flex-direction:column;text-decoration:none;
  box-shadow:0 1px 2px rgba(25,21,33,.04),0 10px 26px -20px rgba(25,21,33,.32);
  transition:border-color .22s,transform .22s,box-shadow .22s}
.pcard:hover{border-color:var(--ets-purple);transform:translateY(-4px);
  box-shadow:0 2px 4px rgba(25,21,33,.06),0 26px 48px -26px rgba(25,21,33,.42)}
.pcard::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--ets-purple)}
.pcard--o::before{background:var(--ets-orange)}
.pcard--plain::before{display:none}
.pcard__ico{width:42px;height:42px;display:grid;place-items:center;background:var(--ets-tint);
  margin:0 0 18px;flex:none;transition:background .22s}
.pcard:hover .pcard__ico{background:var(--ets-orange)}
.pcard__ico svg{width:20px;height:20px;stroke:var(--ets-purple);fill:none;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;transition:stroke .22s}
.pcard:hover .pcard__ico svg{stroke:#fff}
.pcard__lbl{font-family:var(--ets-font-head);font-weight:800;font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ets-light);margin:0 0 10px}
.pcard__h{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(17px,1.7vw,21px);
  line-height:1.24;letter-spacing:-.02em;color:var(--ets-ink);margin:0 0 10px}
.pcard__p{color:var(--ets-muted);font-size:14.5px;line-height:1.65;margin:0 0 20px}
.pcard__link{margin-top:auto;font-family:var(--ets-font-head);font-weight:800;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ets-orange);
  display:inline-flex;align-items:center;gap:8px;transition:.2s}
.pcard:hover .pcard__link{gap:12px}
.pcard__link svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.6}
.pcard__meta{margin:0;font-size:14px;line-height:1.6;color:var(--ets-muted)}
.pcard__meta a{color:var(--ets-purple);font-weight:800;text-decoration:none}
.pcard__rule{border:0;border-top:1px solid var(--ets-border);margin:18px 0}
.pcard__badge{position:absolute;top:-1px;right:18px;background:var(--ets-orange);color:#fff;
  font-family:var(--ets-font-head);font-weight:800;font-size:9px;letter-spacing:.16em;
  text-transform:uppercase;padding:6px 11px}
.pcard--pick{border-color:var(--ets-orange)}
.pcard--fill{background:var(--ets-purple);border-color:var(--ets-purple);color:#fff}
.pcard--fill::before{background:var(--ets-orange)}
.pcard--fill .pcard__h{color:#fff}
.pcard--fill .pcard__p{color:rgba(255,255,255,.82)}
.pcard--fill .pcard__link{color:#fff}
.pcard--fill .pcard__ico{background:rgba(255,255,255,.16)}
.pcard--fill .pcard__ico svg{stroke:#fff}
.pcard__price{font-family:var(--ets-font-head);font-weight:900;font-size:clamp(18px,2vw,24px);
  letter-spacing:-.02em;color:var(--ets-orange);margin:0 0 18px}
.pcard__it{font-style:italic;color:var(--ets-muted);font-size:14.5px;margin:0 0 16px}
.pcard__bul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pcard__bul li{position:relative;padding-left:17px;font-size:14px;line-height:1.6;color:var(--ets-body)}
.pcard__bul li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;
  background:var(--ets-orange)}
.pcard__roles{list-style:none;margin:0;padding:0}
.pcard__roles li{padding:11px 0;border-top:1px solid var(--ets-border);font-size:14.5px;
  color:var(--ets-body)}
.pcard__roles li:first-child{border-top:0;padding-top:0}
.head--center{grid-template-columns:1fr;text-align:center;justify-items:center}
.head--center .eyebrow{justify-content:center}
.head--center .lede{max-width:64ch;text-align:center}
.hero--flat{background:var(--ets-purple-deep);color:#fff;padding:clamp(44px,5.5vw,76px) 0}
.hero--flat .phero__title{margin-bottom:18px}
.numgrid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,40px)}
.numgrid__n{display:block;font-family:var(--ets-font-head);font-weight:900;font-size:32px;
  line-height:1;letter-spacing:-.04em;color:var(--ets-orange);margin:0 0 12px}
.numgrid__h{font-family:var(--ets-font-head);font-weight:800;font-size:16.5px;color:var(--ets-ink);margin:0 0 7px}
.numgrid__p{font-size:14.5px;line-height:1.65;color:var(--ets-muted);margin:0}
@media (max-width:560px){
  .numgrid{grid-template-columns:1fr}}
.traits{background:#fff;border:1px solid var(--ets-border);padding:clamp(26px,2.8vw,36px);
  box-shadow:0 1px 2px rgba(25,21,33,.04),0 14px 32px -24px rgba(25,21,33,.4)}
.traits__lbl{font-family:var(--ets-font-head);font-weight:800;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ets-orange);margin:0 0 10px}
.traits__rule{border:0;border-top:2px solid var(--ets-orange);width:34px;margin:0 0 22px}
.traits__list{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.traits__list li{display:flex;gap:12px;font-size:15px;line-height:1.6;color:var(--ets-muted)}
.traits__list b{color:var(--ets-ink);font-weight:800}
.traits__list svg{width:15px;height:15px;stroke:var(--ets-orange);fill:none;stroke-width:3;
  flex:none;margin-top:5px}
.rail__box{border:1px solid var(--ets-border);background:#fff;padding:clamp(20px,2.2vw,26px)}
.rail__lbl{font-family:var(--ets-font-head);font-weight:800;font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ets-light);margin:0 0 14px}
.rail__row{display:flex;justify-content:space-between;gap:14px;padding:9px 0;
  border-top:1px solid var(--ets-border);font-size:14px}
.rail__row:first-of-type{border-top:0;padding-top:0}
.rail__city{color:var(--ets-muted)}
.rail__num{font-family:var(--ets-font-head);font-weight:800;color:var(--ets-purple);text-decoration:none}
.rail__box--solid{background:var(--ets-purple);border-color:var(--ets-purple);color:#fff}
.rail__box--solid .rail__lbl{color:rgba(255,255,255,.62)}
.rail__box--solid p{margin:0;font-family:var(--ets-font-head);font-weight:800;font-size:16px;
  line-height:1.45;color:#fff}
.rail__hours{margin:0;font-size:15px;line-height:1.6;color:var(--ets-body)}
.ratecard{background:var(--ets-purple);color:#fff;padding:clamp(26px,2.8vw,36px)}
.ratecard__h{font-family:var(--ets-font-head);font-weight:800;font-size:19px;color:#fff;margin:0 0 4px}
.ratecard__s{font-size:13.5px;color:rgba(255,255,255,.62);margin:0 0 24px}
.ratecard__row{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;
  padding:15px 0;border-top:1px solid rgba(255,255,255,.16)}
.ratecard__row b{display:block;font-family:var(--ets-font-head);font-weight:800;font-size:14.5px;color:#fff}
.ratecard__row small{display:block;font-size:12.5px;color:rgba(255,255,255,.55);margin-top:3px}
.ratecard__v{font-family:var(--ets-font-head);font-weight:900;font-size:15px;
  color:var(--ets-orange);text-align:right;flex:none}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0 0}
.chips span{font-size:12.5px;color:var(--ets-body);background:var(--ets-tint);padding:6px 12px}
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,26px)}
/* Headshots are square originals, so a 4:3 crop was cutting the top of the
   head and the chin off every one of them. Square keeps the whole face. */
.team__m img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;
  background:var(--ets-lavender);display:block;margin:0 0 14px}
/* The photo links to that person's LinkedIn or Facebook, so it needs to look
   like a target without picking up the underline the rest of the site's links
   carry. The whole tile lifts, rather than just the image, or the caption
   detaches from the photo on hover. */
.team__m a{display:block;text-decoration:none;border:0;color:inherit;
  transition:transform .25s ease}
.team__m a img{transition:filter .25s ease,box-shadow .25s ease}
.team__m a:hover{transform:translateY(-3px)}
.team__m a:hover img{filter:saturate(1.06) contrast(1.02);
  box-shadow:0 14px 28px -16px rgba(25,21,33,.55)}
.team__m a:focus-visible{outline:2px solid var(--ets-orange);outline-offset:3px}
@media (prefers-reduced-motion:reduce){
	.team__m a,.team__m a img{transition:none}
	.team__m a:hover{transform:none}
}
.team__n{font-family:var(--ets-font-head);font-weight:800;font-size:15.5px;color:var(--ets-ink);
  margin:0 0 3px;text-align:center}
.team__r{font-size:13px;color:var(--ets-muted);margin:0;text-align:center}
.team__head{margin:0 0 clamp(22px,2.4vw,32px)}
.team__grp{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(19px,2vw,25px);
  letter-spacing:-.02em;color:var(--ets-ink);margin:0 0 8px}
.team__rule{border:0;border-top:3px solid var(--ets-purple);width:44px;margin:0 0 10px}
.team__sub{font-size:14px;color:var(--ets-muted);margin:0}
@media (max-width:900px){
  .team{grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px){
  .team{grid-template-columns:repeat(2,1fr)}}
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,26px)}
.cmp__col{background:#fff;border:1px solid var(--ets-border);padding:clamp(26px,2.8vw,36px);
  position:relative;box-shadow:0 1px 2px rgba(25,21,33,.04),0 14px 32px -24px rgba(25,21,33,.4)}
.cmp__col::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--ets-purple)}
.cmp__col--no::before{background:var(--ets-orange)}
.cmp__h{font-family:var(--ets-font-head);font-weight:800;font-size:18px;color:var(--ets-ink);margin:0 0 20px}
.cmp__list{list-style:none;margin:0;padding:0}
.cmp__list li{display:flex;align-items:center;gap:12px;padding:13px 0;
  border-top:1px solid var(--ets-border);font-size:15.5px;color:var(--ets-body)}
.cmp__list li:first-child{border-top:0}
.cmp__list svg{width:15px;height:15px;fill:none;stroke-width:3;flex:none}
.cmp__col .cmp__list svg{stroke:var(--ets-purple)}
.cmp__col--no .cmp__list svg{stroke:var(--ets-orange)}
@media (max-width:700px){
  .cmp{grid-template-columns:1fr}}
/* The matrix sits on white, so it takes the same border and lift as the
   other cards rather than the heavy shadow it needed on the dark band. */
.mtx__wrap{overflow-x:auto;background:#fff;border:1px solid var(--ets-border);
  box-shadow:0 1px 2px rgba(25,21,33,.04),0 14px 32px -24px rgba(25,21,33,.4)}
.mtx{width:100%;border-collapse:collapse;min-width:720px;font-size:14.5px}
.mtx th,.mtx td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--ets-border)}
.mtx thead th{background:var(--ets-purple);color:#fff;font-family:var(--ets-font-head);
  font-weight:800;font-size:11px;letter-spacing:.13em;text-transform:uppercase;border-bottom:0}
.mtx tbody tr:nth-child(even){background:var(--ets-tint)}
.mtx tbody th{font-family:var(--ets-font-head);font-weight:800;color:var(--ets-ink);font-size:14px}
.mtx td{color:var(--ets-body)}
.mtx .yes{color:var(--ets-orange);font-weight:900}
.mtx .no{color:var(--ets-light)}
.mtx .em{font-family:var(--ets-font-head);font-weight:800;color:var(--ets-purple)}
.bd{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,3vw,44px);align-items:start}
.bd__t th,.bd__t td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--ets-border)}
.bd__t thead th{background:var(--ets-purple);color:#fff;font-family:var(--ets-font-head);
  font-weight:800;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase}
.bd__t td:last-child,.bd__t th:last-child{text-align:right}
.bd__t .sub td{background:var(--ets-tint);font-weight:700;color:var(--ets-ink)}
.bd__t .tot td{background:var(--ets-purple);color:#fff;font-family:var(--ets-font-head);
  font-weight:900;font-size:15.5px;border-bottom:0}
.bars{display:grid;gap:14px}
.bar__top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:7px}
.bar__l b{display:block;font-family:var(--ets-font-head);font-weight:800;font-size:14.5px;color:var(--ets-ink)}
.bar__l small{display:block;font-size:12.5px;color:var(--ets-muted);margin-top:2px}
.bar__p{font-family:var(--ets-font-head);font-weight:900;font-size:19px;letter-spacing:-.02em;
  color:var(--ets-ink);flex:none}
.bar__track{height:12px;background:var(--ets-border)}
.bar__fill{height:100%}
.bar--pay .bar__fill{background:var(--ets-ink)}
.bar--stat .bar__fill{background:var(--ets-purple)}
.bar--fee .bar__fill{background:var(--ets-orange)}
.bd__note{font-style:italic;font-size:13.5px;color:var(--ets-muted);margin:18px 0 0}
@media (max-width:900px){
  .bd{grid-template-columns:1fr}}
.plan th,.plan td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--ets-border)}
.plan thead th{background:var(--ets-purple);color:#fff;font-family:var(--ets-font-head);
  font-weight:800;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase}
.plan tbody tr:nth-child(even){background:var(--ets-tint)}
.plan .form{font-family:var(--ets-font-head);font-weight:800;color:var(--ets-purple)}
.exm{background:var(--ets-tint);border-left:4px solid var(--ets-orange);
  padding:clamp(22px,2.4vw,30px)}
.exm__l{font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ets-orange);margin:0 0 16px}
.exm__r{display:flex;justify-content:space-between;gap:18px;padding:9px 0;font-size:15px;
  color:var(--ets-body);border-top:1px solid rgba(103,52,185,.14)}
.exm__r:first-of-type{border-top:0}
.exm__r b{font-family:var(--ets-font-head);font-weight:900;color:var(--ets-ink)}
.exm__s{font-style:italic;font-size:14.5px;color:var(--ets-muted);margin:16px 0 0}
.strip{background:var(--ets-tint);padding:clamp(24px,2.6vw,34px)}
.strip b{display:block;font-family:var(--ets-font-head);font-weight:800;
  font-size:clamp(16px,1.7vw,19px);color:var(--ets-ink);margin:0 0 9px}
.strip p{margin:0;font-size:15.5px;line-height:1.7;color:var(--ets-body);max-width:74ch}
.prow{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
  border-top:1px solid rgba(255,255,255,.22);margin-top:clamp(30px,3vw,42px);
  padding-top:clamp(22px,2.4vw,30px)}
.prow__c{font-family:var(--ets-font-head);font-weight:800;font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(255,255,255,.55);margin:0 0 6px}
.prow__n{font-family:var(--ets-font-head);font-weight:900;font-size:clamp(16px,1.8vw,21px);
  color:var(--ets-orange);text-decoration:none;letter-spacing:-.02em}
.prow__n:hover{color:#fff}
@media (max-width:640px){
  .prow{grid-template-columns:1fr;gap:20px}}
.ibar{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--ets-border);padding:clamp(20px,2.2vw,28px)}
.ibar p{margin:0;font-size:15.5px;color:var(--ets-body);max-width:60ch}
.ibar__r{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.ibar__lnk{font-size:14px;color:var(--ets-purple);font-weight:700;
  border-bottom:1px solid var(--ets-lavender);text-decoration:none}
.ibar__lnk:hover,.ibar__lnk:hover{color:var(--ets-orange-dark)}
.story{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,4vw,64px);align-items:start}
.story__media{background:#fff;padding:12px;
  box-shadow:0 3px 8px rgba(25,21,33,.07),0 34px 64px -36px rgba(25,21,33,.5);margin-top:44px}
.story__media img{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--ets-lavender);display:block}
@media (max-width:860px){
  .story{grid-template-columns:1fr}
  .story__media{margin-top:0}}

/* ============================================================
   STICKY HEADER CONTAINER
   The header template part renders its own wrapper element around
   the header, and a sticky child can only stick inside its
   parent's box. That box is exactly header height, so pinning the
   inner element does nothing. Pin the wrapper instead.
   ============================================================ */
header.wp-block-template-part{position:sticky;top:0;z-index:60}
.admin-bar header.wp-block-template-part{top:32px}
@media screen and (max-width:782px){.admin-bar header.wp-block-template-part{top:46px}}

/* ============================================================
   BANDED CONTAINERS: NO BLOCK GAP
   theme.json sets a 24px blockGap, which the editor's flow layout
   applies between the children of every group. In the header and
   footer those children are full-bleed bands meant to butt
   together, so the gap opened a dead 24px strip under the utility
   bar and between the footer bands. Belt and braces: the template
   parts also set blockGap 0, this covers the case where the
   generated layout styles load after this file.
   ============================================================ */
.wp-block-group.ets-header>*,
.wp-block-group.ft>*{margin-block-start:0}

/* ============================================================
   1.4.5 FIXES
   ============================================================ */

/* Heroes. The scrim and the photo layer are decoration, not flow
   items, but theme.json blockGap was handing whichever one came
   second a 24px top margin. On an absolutely positioned box with
   inset:0 that margin shifts it down, which left an uncovered strip
   across the top of the hero photo. */
.hero__scrim,.hero__media,.phero__scrim,.phero__media{margin:0 !important}

/* Anything the CSS turns into a grid must not also carry the flow
   blockGap margin. The first item has no margin so it fills the row,
   every later item loses 24px of height and sits low, which reads as
   "card one is bigger than the rest". */
.ind__grid>*,.steps__grid>*,.qa>*,.stats__grid>*,.tst__grid>*,
.paths__grid>*,.gal>*,.gal__thumbs>*,.why__list>*,.duo>*,
.crow>*,.team>*,.areas>*{margin-block-start:0}

/* The gallery feature had both an aspect-ratio and a stretched row
   height, so the browser solved for width and ran it out under the
   thumbnails. Pin the width to its own column instead. */
.gal__feat{width:100%;min-width:0}

/* Industry cards: optional photo, bled to the card edges. */
.ind__media{position:relative;overflow:hidden;aspect-ratio:16/10;background:var(--ets-lavender);
  margin:calc(-1 * clamp(26px,2.8vw,38px)) calc(-1 * clamp(26px,2.8vw,38px)) clamp(20px,2vw,26px);
  /* the card is a real block group, so WordPress's first-child layout reset
     zeroes margin-block-start unless we outrank it */
  margin-block-start:calc(-1 * clamp(26px,2.8vw,38px)) !important}
.ind__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s}
.ind__card:hover .ind__media img{transform:scale(1.045)}
.ind__card:has(.ind__media) .ind__idx{color:#fff;z-index:2;text-shadow:0 1px 5px rgba(25,21,33,.8)}

/* Two-tone split panel: optional photo, bled to the panel edges. */
.duo__media{position:relative;overflow:hidden;aspect-ratio:16/9;background:var(--ets-lavender);
  margin:calc(-1 * clamp(30px,3.4vw,52px)) calc(-1 * clamp(30px,3.4vw,52px)) clamp(22px,2.2vw,30px)}
.duo__media img{width:100%;height:100%;object-fit:cover;display:block}

/* Client logos, sized once here rather than per image. */
.trust__track{align-items:center}
.trust__brand img{height:clamp(68px,5.4vw,100px);width:auto;max-width:224px;object-fit:contain;
  display:block;transition:transform .25s}
.trust__brand:hover img{transform:scale(1.05)}


/* ============================================================
   1.4.6  HOMEPAGE SECTIONS
   ============================================================ */

/* Tighter rhythm where two light bands sit next to each other.
   Stats into Trusted by into Two ways in read as one block, so they
   do not each need a full section's worth of air. */
.sec--snug{padding-top:clamp(26px,3vw,46px);padding-bottom:clamp(26px,3vw,46px)}
.sec--snug-top{padding-top:clamp(26px,3vw,46px)}
.stats+.sec--snug{padding-top:clamp(20px,2.4vw,36px)}

/* Photo cards: a checklist under the copy, and room for a button. */
.paths__list{list-style:none;margin:0 0 clamp(26px,3vw,34px);padding:0;display:grid;
  gap:clamp(13px,1.4vw,17px)}
.paths__list li{display:flex;gap:13px;align-items:flex-start;font-size:15.5px;
  line-height:1.5;color:var(--ets-body)}
.paths__list li span.tick{width:24px;height:24px;flex:none;border-radius:50%;display:grid;
  place-items:center;background:var(--ets-tint)}
.paths__card--emp .paths__list li span.tick{background:rgba(226,127,37,.16)}
.paths__list li span.tick svg{width:12px;height:12px;stroke:var(--ets-purple);fill:none;
  stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.paths__card--emp .paths__list li span.tick svg{stroke:var(--ets-orange-dark)}
.paths__h em{font-style:italic;font-weight:900;color:var(--ets-purple)}
.paths__card--emp .paths__h em{color:var(--ets-orange-dark)}

/* The grid sits on the tinted band so the white cards lift off it. */
.paths--lift{background:transparent}
.paths--lift .paths__card{background:#fff;border-color:transparent;
  box-shadow:0 2px 4px rgba(25,21,33,.05),0 22px 44px -26px rgba(25,21,33,.4)}
.paths--lift .paths__card:hover{border-color:transparent;
  box-shadow:0 4px 8px rgba(25,21,33,.07),0 34px 62px -30px rgba(25,21,33,.48)}

/* Industry cards with the name set over the photo. */
.ind__card--photo .ind__media{aspect-ratio:16/11;display:flex;align-items:flex-end}
/* The photo has to come out of flow, or it sits beside the name instead
   of behind it and the name is clipped off the right edge. */
.ind__card--photo .ind__media img{position:absolute;inset:0;width:100%;height:100%}
.ind__card--photo .ind__media::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(25,21,33,0) 38%,rgba(25,21,33,.72) 100%)}
.ind__title{position:relative;z-index:2;width:100%;margin:0;padding:0 clamp(20px,2.2vw,26px) clamp(16px,1.8vw,22px);
  font-family:var(--ets-font-head);font-weight:800;font-size:clamp(19px,1.9vw,24px);
  letter-spacing:-.02em;color:#fff}
.ind__card--photo .ind__idx{color:#fff;z-index:3;text-shadow:0 1px 5px rgba(25,21,33,.8)}

/* Locations on a light band. The dark variant above is unchanged. */
/* The name and the address are spans in the markup, so they need to be
   told to stack or they run together on one line. */
.loc__name,.loc__meta{display:block}
.loc--light .loc__list{border-top-color:var(--ets-border)}
.loc--light .loc__row{border-bottom-color:var(--ets-border)}
.loc--light .loc__name{color:var(--ets-ink)}
.loc--light .loc__meta{color:var(--ets-muted)}
.loc--light .loc__badge{background:var(--ets-purple);color:#fff}
.loc--light .loc__badge--wide{background:var(--ets-orange)}
.loc--light .loc__row svg{stroke:var(--ets-light)}
.loc--light .loc__row:hover svg{stroke:var(--ets-orange)}

/* Community cards: photo on top, programme colour as a top rule. */
.com__media{position:relative;overflow:hidden;aspect-ratio:16/10;background:var(--ets-lavender)}
.com__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s}
.com__card:hover .com__media img{transform:scale(1.04)}
.com__card{border-top:4px solid var(--ets-purple)}
.com__card--vets{border-top-color:var(--ets-orange)}
.com__card--vets .com__kicker{color:var(--ets-orange)}
.com__card--r4r .com__kicker{color:var(--ets-purple)}
.com__link{margin-top:auto;font-family:var(--ets-font-head);font-weight:800;font-size:11.5px;
  letter-spacing:.15em;text-transform:uppercase;color:var(--ets-purple);text-decoration:none;
  display:inline-flex;align-items:center;gap:9px;transition:gap .2s}
.com__card--vets .com__link{color:var(--ets-orange-dark)}
.com__link svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.6}
.com__link:hover{gap:15px}
.com__top{display:flex;flex-direction:column}

/* Closing CTA: full-width stacked buttons on the right. */
.cta__btns--stack{display:grid;gap:14px;align-content:center}
.cta__btns--stack .btn{display:flex;align-items:center;justify-content:space-between;
  width:100%;padding:clamp(18px,1.9vw,24px) clamp(22px,2.4vw,30px);
  font-family:var(--ets-font-head);font-weight:800;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;text-decoration:none;transition:transform .2s,background .2s}
.cta__btns--stack .btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.4}
.cta__btns--stack .btn--orange{background:var(--ets-orange);color:#fff;border:1px solid var(--ets-orange)}
.cta__btns--stack .btn--orange:hover{background:var(--ets-orange-dark);border-color:var(--ets-orange-dark)}
.cta__btns--stack .btn--outline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.85)}
.cta__btns--stack .btn--outline:hover{background:rgba(255,255,255,.1)}

/* Hero buttons on location pages, matching the closing CTA. */
.phero__acts{display:flex;gap:13px;flex-wrap:wrap;margin-top:clamp(22px,2.4vw,30px)}
.phero__acts .btn{display:inline-flex;align-items:center;gap:11px;
  padding:clamp(15px,1.6vw,19px) clamp(20px,2.2vw,28px);
  font-family:var(--ets-font-head);font-weight:800;font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;text-decoration:none;transition:background .2s,transform .2s}
.phero__acts .btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.5}
.phero__acts .btn--orange{background:var(--ets-orange);color:#fff;border:1px solid var(--ets-orange)}
.phero__acts .btn--orange:hover{background:var(--ets-orange-dark);border-color:var(--ets-orange-dark)}
.phero__acts .btn--outline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.9)}
.phero__acts .btn--outline:hover{background:rgba(255,255,255,.12)}

/* Centred section head. Eyebrows are plain text, no rule before them. */
.head--center{display:block;text-align:center;max-width:760px;margin-inline:auto}

/* A quiet link that sits opposite a section heading. */
.head__link{font-family:var(--ets-font-head);font-weight:800;font-size:12.5px;color:var(--ets-purple);
  text-decoration:none;border-bottom:2px solid var(--ets-lavender);padding-bottom:3px;
  display:inline-flex;align-items:center;gap:9px;align-self:end;justify-self:end}
.head__link svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.6}
.head__link:hover{color:var(--ets-orange-dark);border-color:var(--ets-orange)}

@media (max-width:820px){
  .cta__btns--stack{grid-auto-flow:row}
  .head__link{justify-self:start;align-self:start}
}

/* ---------------------------------------------------------------------------
   1.4.8 LOCATION HERO COLUMNS

   .phero__grid asked for align-items:end, but WordPress layout CSS outranked
   it, so both columns stretched to the full row height. Each column is itself
   a layout grid, and a grid with auto rows and the default align-content
   shares leftover height out between its rows. On the right that put roughly
   140px of dead air between the phone number and the address, leaving it
   floating in the middle of the hero photo.

   The real fix is on the blocks: the hero columns now carry the core
   verticalAlignment attribute, which is what a human would set in the editor
   and which works without this stylesheet. The rules below are the backstop,
   so a hero built by hand or pasted from an older page still lands right.
   --------------------------------------------------------------------------- */
.phero__grid.wp-block-columns{align-items:end}
.phero__grid>.wp-block-column{align-content:end}
.phero__grid>.wp-block-column>*{margin-block-start:0}
.phero__grid>.wp-block-column>*+*{margin-block-start:14px}
.phero__grid>.wp-block-column .phero__acts{margin-block-start:clamp(22px,2.4vw,30px)}

/* The location hero's contact column sits at the far right of the hero photo,
   flush with the content edge, mirroring the buttons on the left. The blocks
   carry this as a flex layout attribute so it works without this file; these
   rules are the backstop for a hero built by hand. */
.phero__side{justify-items:end;text-align:right}
.phero__side>*{margin-block-start:0}
.phero__side>*+*{margin-block-start:14px}
@media (max-width:900px){
	.phero__side{justify-items:start;text-align:left}
	.phero__side.is-layout-flex{align-items:flex-start}
	.phero__note.has-text-align-right{text-align:left}
}

/* ---------------------------------------------------------------------------
   1.4.9 LOCATION HERO COLUMN RATIO

   .phero__grid wanted a grid with a wider headline column, but WordPress's own
   block stylesheet sets .wp-block-columns{display:flex} at equal specificity
   and loads after the theme, so the hero had silently been an even 50/50 split
   since it was built. That is why the headline wrapped a line early. Matching
   core's specificity puts the intended ratio back.
   --------------------------------------------------------------------------- */
.phero__grid.wp-block-columns{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,72px)}
.phero__grid.wp-block-columns>.wp-block-column{flex-basis:auto;min-width:0}
@media (max-width:900px){
	.phero__grid.wp-block-columns{grid-template-columns:1fr;gap:32px}
}

/* Four-up card row, for the pricing page where all four hiring models sit
   side by side. Collapses 4 to 2 to 1 on the same breakpoints as crow--3. */
.crow--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1100px){.crow--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.crow--4{grid-template-columns:1fr}}

/* ---------------------------------------------------------------------------
   1.5.4 PHONE LAYOUT

   Three things were wrong below about 800px.

   1. .head is a two-column grid, heading left and lede right, and it had no
      mobile rule at all. On a phone each column got roughly 200px, so headings
      broke to one word a line and ran into the lede beside them. It stacks now,
      which fixes every section head on every page.
   2. The sticky header was a fixed 104px on every device, permanently taking
      an eighth of a phone screen.
   3. The wide tables were set to white-space:nowrap and left to scroll sideways,
      so they read as cut off rather than scrollable. The two-column one now
      wraps and fits. The four and five column ones restack as one card per row,
      labelling each value with its column name from the cell's data-l.
   --------------------------------------------------------------------------- */

@media (max-width:820px){
	.head{grid-template-columns:1fr;gap:12px;align-items:start;
	  margin:0 0 clamp(24px,5vw,38px)}
	.head .lede{max-width:none}
	.head__link{justify-self:start}

	/* two columns fit once they are allowed to wrap */
	.bd__t{display:table;width:100%;white-space:normal;overflow:visible;font-size:13.5px}
	.bd__t th,.bd__t td{padding:9px 11px}
	.bd__t td:last-child,.bd__t th:last-child{white-space:nowrap}
}

@media (max-width:700px){
	.hd__bar .shell{height:66px;gap:12px}
	.hd__logo{font-size:21px}
	.hd__logo img,.hd__logo svg{max-height:34px;width:auto}
	.hd__util{font-size:12.5px}

	/* four and five column tables become one card per row */
	.mtx__wrap{overflow:visible;border:0;background:transparent}
	.plan,.mtx{display:block;width:100%;min-width:0;overflow:visible;white-space:normal;
	  border-collapse:separate}
	.plan thead,.mtx thead{position:absolute;width:1px;height:1px;overflow:hidden;
	  clip:rect(0 0 0 0);white-space:nowrap}
	.plan tbody,.mtx tbody{display:block}
	.plan tbody tr,.mtx tbody tr{display:block;background:#fff;
	  border:1px solid var(--ets-border);margin:0 0 10px;padding:2px 15px}
	.plan tbody tr:nth-child(even),.mtx tbody tr:nth-child(even){background:#fff}
	.plan tbody td,.mtx tbody td{display:flex;justify-content:space-between;
	  align-items:baseline;gap:18px;padding:9px 0;text-align:left;font-size:14px;
	  border-bottom:1px solid var(--ets-border)}
	.plan tbody tr td:last-child,.mtx tbody tr td:last-child{border-bottom:0}
	.plan tbody td::before,.mtx tbody td::before{content:attr(data-l);flex:none;
	  font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;
	  letter-spacing:.14em;text-transform:uppercase;color:var(--ets-muted)}
	/* the row's own name heads its card rather than sitting in a labelled row */
	.plan tbody td:first-child,.mtx tbody th{display:block;padding:12px 0 9px;
	  font-family:var(--ets-font-head);font-weight:800;font-size:15px;
	  color:var(--ets-ink);border-bottom:1px solid var(--ets-border)}
	.plan tbody td:first-child::before,.mtx tbody th::before{content:none}

	/* tighter cards so they do not eat the whole screen */
	.pcard{padding:20px 18px}
	.pcard__it{font-size:13.5px;margin:0 0 12px}
	.pcard__price{font-size:20px;margin:0 0 14px}
	.pcard__bul{gap:7px}
	.pcard__bul li{font-size:13.5px;line-height:1.5;padding-left:15px}
	.pcard__bul li::before{top:8px}
	.crow{gap:12px}
}

/* ============================================================
   1.5.5 PLAN TABLE FORMULA CELL
   The FlexDirect table marks its monthly-payment cell class="form", which also
   matches the site-wide form panel component further up this file: white
   panel, 1px border on all four sides and a 60px drop shadow, landing inside
   a table cell. On desktop it drew a stray box around five cells; once the
   table restacked on phones that box collided with the bottom of each card.
   Keep only the typographic treatment the plan table wanted.
   ============================================================ */
.plan td.form{background:transparent;border-top:0;border-left:0;border-right:0;
  box-shadow:none;padding:14px 18px}
@media (max-width:700px){
	.plan tbody td.form{padding:9px 0}
	.plan tbody tr{padding:4px 15px 9px}
}

/* ============================================================
   1.5.5 PHONE HEADER BAND
   The sticky bar itself is 66px on phones, but the purple utility strip above
   it was adding roughly another 100px before any page content: the tagline
   wrapping to two lines, then a second centred row repeating the three social
   icons that already sit in the footer. Below 640px keep the tagline, drop the
   duplicate social row, and lose the small orange marker, which sat orphaned
   at the left edge once the tagline wrapped.
   ============================================================ */
@media (max-width:640px){
	.hd__util{font-size:11.5px}
	.hd__util .shell{gap:0;padding-top:7px;padding-bottom:7px}
	.hd__util .hd__social{display:none}
	.hd__tag{display:block;line-height:1.45;letter-spacing:0}
	.hd__tag i{display:none}
}

/* ============================================================
   1.5.5 HERO OUTLINE BUTTON ON DARK
   .cta__btns had a rule lifting the outline button to white on its dark
   panel, but .phero__btns only had the plain .btn--line version, not the
   block-style class the editor writes. A hero built from the "Hero, page with
   photo" pattern therefore rendered "Find talent" in dark purple on a purple
   hero, effectively unreadable. The live location pages use .phero__acts and
   were not affected; this keeps the pattern safe for the next page built from
   the inserter.
   ============================================================ */
.phero__btns .is-style-ets-line .wp-block-button__link,
.hero__btns .is-style-ets-line .wp-block-button__link{
  color:#fff;border-color:rgba(255,255,255,.4)}
.phero__btns .is-style-ets-line .wp-block-button__link:hover,
.hero__btns .is-style-ets-line .wp-block-button__link:hover{
  background:#fff;color:var(--ets-purple-deep);border-color:#fff}

/* ============================================================
   1.5.5 LOCATION HERO CONTACT BLOCK ON PHONES
   The 1.4.8 backstop set align-content:end on the hero columns, written for a
   CSS grid, where align-content works vertically. WordPress renders that
   column as a wrapping flex column instead, and there align-content packs the
   flex line along the horizontal axis, so the phone number and address stayed
   pinned to the right edge after the hero stacked, with the headline and
   buttons left. Verified on the live Vermont page: .phero__side computes to
   display:flex, flex-direction:column, flex-wrap:wrap, align-content:end.
   ============================================================ */
@media (max-width:900px){
	.phero__grid>.wp-block-column{align-content:flex-start}
	.phero__side{align-content:flex-start;align-items:flex-start}
	.phero__side>*{align-self:flex-start}
}


/* ============================================================
   1.7.0 JOB BOARD, INDEED PATTERN

   Two panes, results left and the full posting right, with filters as pills
   across the top. Chosen because that layout is the one nearly every job
   seeker already knows, so the board needs no learning.

   One deliberate departure from the design system: the board is rounded. Zero
   border radius holds everywhere else on the site. The radius lives in one
   variable below, so reverting is a single line.
   ============================================================ */
.ib{
  --ibr:10px;      /* cards, panels, menus */
  --ibp:999px;     /* pills, buttons, the search bar */
  --ibline:#dfdce6;
  --ibsoft:#f6f4fa;
  margin:0 0 clamp(30px,5vw,56px);
}
.ib svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;flex:none}

/* search band */
.ib__band{margin:0 0 18px}
.ib__title{font-family:var(--ets-font-head);font-weight:800;font-size:clamp(26px,3.2vw,40px);line-height:1.1;letter-spacing:-.03em;color:var(--ets-ink);text-align:center;margin:0 0 20px}
.ib__search{display:flex;align-items:center;background:#fff;border:1px solid var(--ets-ink);
  border-radius:var(--ibp);max-width:1080px;margin:0 auto;
  box-shadow:0 2px 0 rgba(25,21,33,.07),0 10px 26px -18px rgba(25,21,33,.5)}
.ib__search:focus-within{box-shadow:0 0 0 3px var(--ets-lavender),0 10px 26px -18px rgba(25,21,33,.5)}
.ib__field{display:flex;align-items:center;gap:11px;flex:1;padding:0 20px;min-width:0;position:relative}
.ib__field+.ib__field{border-left:1px solid var(--ibline)}
.ib__field svg{width:19px;height:19px;stroke:var(--ets-ink)}
.ib__field input{border:0;outline:0;background:none;padding:17px 0;width:100%;min-width:0;
  font-size:16px;font-family:inherit;color:inherit;border-radius:0}
.ib__search .ib__btn{margin:6px;padding:14px 32px}

/* buttons */
.ib__btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 22px;
  font-family:var(--ets-font-head);font-weight:800;font-size:11.5px;letter-spacing:.11em;
  text-transform:uppercase;line-height:1;border:2px solid transparent;cursor:pointer;
  text-decoration:none;border-radius:var(--ibp);transition:background .17s,border-color .17s,color .17s}
.ib__btn--p{background:var(--ets-purple);border-color:var(--ets-purple);color:#fff}
.ib__btn--p:hover{background:var(--ets-purple-deep);border-color:var(--ets-purple-deep);color:#fff}
.ib__btn--o{background:var(--ets-orange);border-color:var(--ets-orange);color:#fff}
.ib__btn--o:hover{background:var(--ets-orange-dark);border-color:var(--ets-orange-dark);color:#fff}
.ib__btn--line{background:#fff;border-color:var(--ibline);color:var(--ets-purple)}
.ib__btn--line:hover{border-color:var(--ets-purple);background:var(--ets-tint)}

/* filter pills */
.ib__pills{display:flex;gap:9px;flex-wrap:wrap;max-width:1080px;margin:16px auto 0}
.ib__pill,.ib__pill>summary{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--ibline);
  background:#fff;padding:9px 16px;font-size:13.5px;cursor:pointer;border-radius:var(--ibp);
  white-space:nowrap;list-style:none;text-decoration:none;color:inherit;
  transition:border-color .15s,background .15s}
.ib__pill{padding:0;border:0;position:relative}
.ib__pill>summary::-webkit-details-marker{display:none}
.ib__pill>summary:hover,.ib__pill--toggle:hover{border-color:var(--ets-ink);background:var(--ibsoft)}
.ib__pill.is-on>summary,.ib__pill--toggle.is-on{border-color:var(--ets-purple);border-width:2px;
  padding:8px 15px;background:var(--ets-tint);color:var(--ets-purple);font-weight:600}
.ib__pill[open]>summary{border-color:var(--ets-ink);background:var(--ibsoft)}
.ib__dot{width:7px;height:7px;background:var(--ets-orange);border-radius:999px;flex:none}
.ib__pill--toggle.is-on .ib__dot{background:var(--ets-purple)}
.ib__pn{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;
  background:var(--ets-purple);color:#fff;font-size:11px;font-weight:700;border-radius:999px}
.ib__pn--quiet{background:var(--ibsoft);color:var(--ets-muted)}
.ib__menu{position:absolute;top:calc(100% + 7px);left:0;z-index:70;background:#fff;
  border:1px solid var(--ibline);border-radius:var(--ibr);min-width:250px;max-height:330px;
  overflow-y:auto;padding:7px;box-shadow:0 18px 40px -20px rgba(25,21,33,.5)}
.ib__mrow{display:flex;align-items:center;gap:10px;padding:9px 11px;font-size:14px;
  text-decoration:none;color:inherit;border-radius:calc(var(--ibr) - 4px)}
.ib__mrow:hover{background:var(--ets-tint)}
.ib__mrow.is-empty{opacity:.4}
.ib__box{width:16px;height:16px;border:1.5px solid var(--ibline);border-radius:3px;flex:none}
.ib__mrow.is-on .ib__box{background:var(--ets-purple);border-color:var(--ets-purple);
  box-shadow:inset 0 0 0 2px #fff}
.ib__mn{margin-left:auto;font-size:12px;color:var(--ets-light);flex:none}

/* active filters */
.ib__active{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin:0 0 16px}
.ib__achip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--ets-lavender);
  background:#fff;padding:6px 12px;font-size:12.8px;font-weight:600;color:var(--ets-purple);
  text-decoration:none;border-radius:var(--ibp)}
.ib__achip:hover{background:var(--ets-purple);color:#fff;border-color:var(--ets-purple)}
.ib__achip svg{width:10px;height:10px;stroke-width:3}
.ib__clear{font-family:var(--ets-font-head);font-weight:800;font-size:11px;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ets-muted);text-decoration:none;padding:0 4px}
.ib__clear:hover{color:var(--ets-purple);text-decoration:underline}

/* two panes */
.ib__grid{display:grid;grid-template-columns:minmax(320px,590px) minmax(0,1fr);gap:22px;align-items:start}
.ib__lede{margin:0 0 12px;font-size:14px;color:var(--ets-muted)}
.ib__lede a{color:var(--ets-purple);text-decoration:underline;font-weight:600}
.ib__sortline{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:0 0 10px;margin:0 0 12px;border-bottom:1px solid var(--ibline);font-size:14px;
  color:var(--ets-muted);flex-wrap:wrap}
.ib__sortline b{color:var(--ets-ink)}
.ib__sort a{color:var(--ets-purple);text-decoration:underline;margin-left:5px}
.ib__list{display:flex;flex-direction:column;gap:11px}

/* cards */
.ib__card{border:1px solid var(--ibline);background:#fff;padding:17px 18px;border-radius:var(--ibr);
  transition:box-shadow .15s,border-color .15s}
.ib__card:hover{box-shadow:0 5px 16px -10px rgba(25,21,33,.45)}
.ib__card.is-open{border-color:var(--ets-purple);border-width:2px;padding:16px 17px}
.ib__flags{margin:0 0 9px;display:flex;gap:7px;flex-wrap:wrap}
.ib__flag{display:inline-block;background:var(--ets-orange);color:#fff;font-size:11.5px;
  font-weight:700;padding:4px 10px;border-radius:var(--ibp)}
.ib__ct{font-size:18px;margin:0 0 4px;font-family:var(--ets-font-head);font-weight:800;
  letter-spacing:-.015em;line-height:1.3}
.ib__ct a{color:var(--ets-purple-deep);text-decoration:none;border:0}
.ib__card:hover .ib__ct a{text-decoration:underline}
.ib__co{font-size:14px;color:var(--ets-ink);margin:0}
.ib__loc{font-size:14px;color:var(--ets-muted);margin:0 0 11px}
.ib__attrs{display:flex;gap:7px;flex-wrap:wrap;margin:0}
.ib__attr{background:var(--ibsoft);font-size:12.8px;font-weight:600;padding:5px 11px;
  border-radius:var(--ibp);color:var(--ets-ink);display:inline-block}
.ib__ago{font-size:12.5px;color:var(--ets-light);margin:11px 0 0}
.ib__none{border:1px solid var(--ibline);background:var(--ets-tint);padding:30px 24px;
  text-align:center;border-radius:var(--ibr)}
.ib__none h3{font-size:18px;margin:0 0 8px;font-family:var(--ets-font-head);font-weight:800}
.ib__none p{margin:0 0 16px;color:var(--ets-muted);font-size:14px}
.ib__nudge{border:1px solid var(--ibline);background:var(--ets-tint);padding:20px 18px;
  margin:14px 0 0;border-radius:var(--ibr)}
.ib__nudge h3{font-size:16px;margin:0 0 6px;font-family:var(--ets-font-head);font-weight:800}
.ib__nudge p{margin:0 0 14px;color:var(--ets-muted);font-size:13.5px}
.ib__pages{display:flex;gap:6px;flex-wrap:wrap;margin:18px 0 0;align-items:center}
.ib__pages .page-numbers{border:1px solid var(--ibline);padding:9px 14px;text-decoration:none;
  color:inherit;font-size:13.5px;border-radius:var(--ibp)}
.ib__pages .page-numbers:hover{border-color:var(--ets-purple);color:var(--ets-purple)}
.ib__pages .page-numbers.current{background:var(--ets-purple);border-color:var(--ets-purple);
  color:#fff;font-weight:700}

/* detail */
.ib__detail{position:sticky;top:96px;max-height:calc(100vh - 118px);overflow-y:auto;background:#fff;
  border:1px solid var(--ibline);border-radius:var(--ibr)}
.ib__detail.is-loading{opacity:.55}
.ib__dtpad{padding:26px 30px 34px}
.ib__dth{font-size:clamp(22px,2.3vw,27px);margin:0 0 10px;font-family:var(--ets-font-head);
  font-weight:800;letter-spacing:-.02em;line-height:1.2}
.ib__dtco{display:inline-flex;align-items:center;gap:6px;font-size:15px;color:var(--ets-purple);
  text-decoration:underline;font-weight:600}
.ib__dtco svg{width:13px;height:13px}
.ib__dtloc{font-size:15px;color:var(--ets-ink);margin:7px 0 0}
.ib__dtline{font-size:15px;color:var(--ets-ink);margin:5px 0 0}
.ib__acts{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:20px 0 0}
.ib__acts .ib__btn{padding:15px 30px;font-size:12px}
.ib__sec{border-top:1px solid var(--ibline);padding:22px 0 0;margin:22px 0 0}
.ib__sec h3{font-size:19px;margin:0 0 4px;font-family:var(--ets-font-head);font-weight:800}
.ib__hint{font-size:13.5px;color:var(--ets-muted);margin:0 0 15px}
.ib__drow{display:flex;gap:13px;align-items:flex-start;margin:15px 0 0}
.ib__drow>svg{width:21px;height:21px;stroke:var(--ets-muted);margin-top:2px}
.ib__drow b{display:block;font-family:var(--ets-font-head);font-weight:800;font-size:14.5px;margin:0 0 7px}
.ib__drow .ib__attr{margin:0 5px 5px 0}
.ib__sec ul{margin:0 0 14px;padding-left:19px}
.ib__sec li{margin:0 0 7px;font-size:14.5px}
.ib__sec li::marker{color:var(--ets-orange)}
.ib__note{border-left:3px solid var(--ets-lavender);background:var(--ets-tint);padding:13px 16px;
  font-size:13.8px;margin:20px 0 0;border-radius:var(--ibr)}
.ib__note b{font-family:var(--ets-font-head);font-weight:800}
.ib__body{font-size:14.5px}
.ib__body h2,.ib__body h3,.ib__body h4{font-size:15.5px;margin:20px 0 9px;
  font-family:var(--ets-font-head);font-weight:800}
.ib__body p{margin:0 0 12px}
.ib__body ul,.ib__body ol{margin:0 0 14px;padding-left:19px}
.ib__body li{margin:0 0 6px}
.ib__body li::marker{color:var(--ets-orange)}
.ib__eoe{font-size:12px;color:var(--ets-light);font-style:italic;margin:24px 0 0;line-height:1.6}
.ib__close{display:none;align-items:center;justify-content:space-between;width:100%;padding:14px 18px;
  background:#fff;border:0;border-bottom:1px solid var(--ibline);cursor:pointer;position:sticky;
  top:0;z-index:5;font:inherit;color:inherit}
.ib__close b{font-family:var(--ets-font-head);font-weight:900;font-size:12px;letter-spacing:.15em;
  text-transform:uppercase}
.ib__close span{width:30px;height:30px;border:1px solid var(--ibline);display:grid;place-items:center;
  font-size:18px;flex:none;border-radius:var(--ibr)}
body.jb-locked{overflow:hidden}

/* the city autocomplete, shared with the hero.
   Fixed rather than absolute so it cannot be clipped by an ancestor with
   overflow hidden, which is exactly what the hero does to contain its photo. */
.ets-ac{position:fixed;z-index:9999;background:#fff;border:1px solid var(--ibline);
  border-radius:10px;box-shadow:0 18px 44px -18px rgba(25,21,33,.6);max-height:320px;
  overflow-y:auto;display:none;font-family:var(--ets-font-body,inherit)}
.ets-ac.is-open{display:block}
.ets-ac__head{padding:9px 15px;font-family:var(--ets-font-head);font-weight:900;font-size:9.5px;
  letter-spacing:.17em;text-transform:uppercase;color:var(--ets-light);background:var(--ets-tint);
  border-bottom:1px solid var(--ibline)}
.ets-ac__row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;
  padding:11px 15px;background:none;border:0;border-bottom:1px solid var(--ets-tint);cursor:pointer;
  text-align:left;font:inherit;font-size:14.5px;color:var(--ets-ink)}
.ets-ac__row:last-child{border-bottom:0}
.ets-ac__row:hover,.ets-ac__row[aria-selected=true]{background:var(--ets-tint)}
.ets-ac__n{font-family:var(--ets-font-head);font-weight:900;font-size:12.5px;color:var(--ets-purple);
  flex:none;white-space:nowrap}
.ets-ac__none{display:block;padding:15px;font-size:14px;color:var(--ets-muted)}
.ets-ac__none b{color:var(--ets-ink)}
.ets-ac__none a{display:inline-flex;margin:12px 0 0}

@media (max-width:1180px){
  .ib__grid{grid-template-columns:minmax(300px,440px) minmax(0,1fr);gap:18px}
  .ib__dtpad{padding:22px}
}
@media (max-width:920px){
  .ib__grid{grid-template-columns:minmax(0,1fr)}
  .ib__detail{position:fixed;inset:0;z-index:300;max-height:none;height:100%;border:0;
    border-radius:0;display:none}
  .ib__detail.is-shown{display:block}
  .ib__close{display:flex}
}
@media (max-width:720px){
  .ib__search{flex-direction:column;align-items:stretch;border-radius:var(--ibr)}
  .ib__field+.ib__field{border-left:0;border-top:1px solid var(--ibline)}
  .ib__search .ib__btn{margin:0;border-radius:0 0 var(--ibr) var(--ibr)}
  .ib__pills{gap:7px}
  .ib__pill>summary,.ib__pill--toggle{padding:8px 13px;font-size:13px}
  .ib__menu{min-width:0;width:calc(100vw - 44px);left:auto;right:auto}
  .ib__dtpad{padding:18px 18px 40px}
}

/* ============================================================
   1.7.0 HERO SEARCH
   Branded to match the board: one rounded bar, a divider between the two
   fields, solid button on the end. The autocomplete panel is no longer a child
   of this form, so .hero{overflow:hidden} can no longer clip it.
   ============================================================ */
.hero__search{display:flex;align-items:center;grid-template-columns:none;background:#fff;
  max-width:720px;border-radius:0;overflow:visible;
  box-shadow:0 2px 0 rgba(25,21,33,.08),0 18px 40px -22px rgba(0,0,0,.75)}
.hero__search:focus-within{box-shadow:0 0 0 4px rgba(226,127,37,.45),0 18px 40px -22px rgba(0,0,0,.75)}
.hero__field{display:flex;align-items:center;gap:11px;flex:1;padding:0 22px;min-width:0;
  position:relative;border-bottom:0}
.hero__field+.hero__field{border-left:1px solid var(--ets-border)}
.hero__search input{flex:1;border:0;outline:none;padding:18px 0;min-width:0;font-size:16px;
  background:none;border-radius:0}
.hero__search button{border:0;padding:0 34px;cursor:pointer;min-height:58px;border-radius:999px;
  margin:5px;border-radius:0;font-family:var(--ets-font-head);font-weight:800;font-size:12px;letter-spacing:.12em;
  text-transform:uppercase;background:var(--ets-orange);color:#fff;transition:background .18s}
.hero__search button:hover{background:var(--ets-orange-dark)}
@media (max-width:760px){
  .hero__search{flex-direction:column;align-items:stretch;border-radius:0}
  .hero__field+.hero__field{border-left:0;border-top:1px solid var(--ets-border)}
  .hero__search button{margin:0;border-radius:0;min-height:54px}
}
/* The autocomplete follows whichever bar it belongs to: square under the hero,
   rounded under the board. */
.ets-ac{border-radius:0}
.ib .ets-ac,.ets-ac[data-round="1"]{border-radius:10px}

/* ============================================================
   1.7.1 FIXES
   ============================================================ */

/* The board is dropped into a page whose content wrapper has no max width and
   no gutter, so it was running edge to edge. Give it its own shell rather than
   relying on the template, because the shortcode can go on any page. */
.ib{width:100%;max-width:var(--ets-shell);margin-left:auto;margin-right:auto;
  padding-left:var(--ets-gutter);padding-right:var(--ets-gutter)}
/* The fixed autocomplete is positioned from the input, so it is unaffected. */
@media (max-width:820px){
  .ib{padding-left:clamp(16px,4.5vw,22px);padding-right:clamp(16px,4.5vw,22px)}
}

/* The burger icon sat high in its square. The summary was given height:100%,
   but as a grid item in an auto sized row that resolved to the icon's line box,
   32px inside a 42px space, so the icon sat 7px from the top and 18px from the
   bottom. Size it explicitly and kill the line box. */
/* Deliberately no display here. The breakpoint above turns the burger on at
   1375px, and repeating display:none in this later block would switch it back
   off at every width. */
.hd__burger{width:46px;height:46px;border:2px solid var(--ets-purple);
  background:var(--ets-purple);cursor:pointer;place-items:center;flex:none;padding:0;
  box-sizing:border-box}
.hd__burger>summary{display:grid;place-items:center;width:42px;height:42px;
  line-height:0;margin:0;padding:0;list-style:none;cursor:pointer}
.hd__burger>summary::-webkit-details-marker{display:none}
.hd__burger>summary::marker{content:""}
.hd__burger svg{width:21px;height:21px;stroke:#fff;fill:none;stroke-width:2;display:block}

/* The home hero plays a video, but it carries no has-background-image class, so
   it was picking up the flat fallback scrim: .9 to .85 to .8 across the whole
   width, which is nearly opaque on the right and buries the footage. Let the
   gradient fall away so the video reads on the right while the headline side
   stays dark enough to read against. */
.hero:not(.has-background-image) .hero__scrim{
  background-image:linear-gradient(105deg,
    rgba(45,22,85,.94) 0%,
    rgba(58,28,108,.84) 28%,
    rgba(84,42,158,.52) 60%,
    rgba(103,52,185,.20) 100%)}
/* Where the hero really has no media, the purple behind it shows through the
   transparent end, which is the same colour, so nothing looks unfinished. */
.hero:not(:has(video)):not(:has(img)):not(.has-background-image) .hero__scrim{
  background-image:linear-gradient(105deg,
    rgba(45,22,85,.92) 0%,
    rgba(77,36,160,.85) 45%,
    rgba(103,52,185,.78) 100%)}

/* ============================================================
   1.7.2 FILTER MENUS ON PHONES
   The menu is absolutely positioned inside .ib__pill, so it opened at the
   pill's own left edge. The 720px rule then widened it to the viewport, which
   guaranteed it ran off the right side: a menu opened from the last pill on a
   row sat up to 446px past the edge and gave the whole page a sideways scroll.
   Below 820px the pill stops being the positioning ancestor, the rail takes
   over, and the menu drops under the whole rail at the rail's own width. There
   is nothing left for it to overflow.
   ============================================================ */
@media (max-width:820px){
  .ib__pills{position:relative}
  .ib__pill{position:static}
  .ib__menu{
    left:0;
    right:0;
    width:auto;
    min-width:0;
    max-width:none;
    top:calc(100% + 7px);
    max-height:min(330px,60vh)}
}

/* The search bar labels carry .screen-reader-text, which is a WordPress core
   class, not one of ours. Core happens to print it today, so the live bar
   looks right, but nothing in this theme guarantees that and an offline render
   shows what happens if it stops: six labels turn into visible text stacked on
   top of the placeholders. The theme now owns the rule it depends on. */
.screen-reader-text:not(:focus):not(:active){
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* ---------------------------------------------------------------------------
   Form section, two column.
   Used on Request talent, Post a job and Find work, where the form is the point
   of the page and the copy beside it is doing the selling. The other pages keep
   a centred heading with the card underneath, which needs no classes.
   --------------------------------------------------------------------------- */
.fsec__grid{display:grid;grid-template-columns:1.02fr .98fr;
  gap:clamp(32px,5vw,88px);align-items:start}
.fsec__intro{margin:0 0 clamp(28px,3.4vw,44px);max-width:46ch;font-size:17.5px}

.fsteps{display:grid;gap:clamp(18px,2.2vw,28px);margin:0}
.fstep{display:grid;grid-template-columns:40px 1fr;gap:18px;align-items:start}
.fstep__n{width:40px;height:40px;display:grid;place-items:center;
  background:var(--ets-purple);color:#fff;font-family:var(--ets-font-head);
  font-weight:900;font-size:15px}
.fstep__h{font-family:var(--ets-font-head);font-weight:800;font-size:16.5px;
  color:var(--ets-ink);margin:0 0 4px;line-height:1.3}
.fstep__p{margin:0;font-size:14.5px;line-height:1.62;color:var(--ets-muted)}

/* The form's own heading lives inside the card on these pages, so the section
   head above it is dropped rather than repeated. */
.fsec .head{margin:0}
.fsec__left .h2{margin:0 0 20px;font-size:clamp(30px,3.6vw,46px)}

@media (max-width:1040px){
  .fsec__grid{grid-template-columns:1fr;gap:44px}
}

/* ---------------------------------------------------------------------------
   Download cards. Used for the two reporting forms on Employee resources,
   which stay as PDFs because one of them needs a signature.
   --------------------------------------------------------------------------- */
.dlcards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.2vw,30px)}
.dlcard{background:#fff;border:1px solid var(--ets-border);
  padding:clamp(26px,3vw,38px);display:flex;flex-direction:column;transition:.2s}
.dlcard:hover{border-color:var(--ets-purple);
  box-shadow:0 18px 44px -30px rgba(25,21,33,.5)}
.dlcard__ico{width:52px;height:52px;display:grid;place-items:center;
  background:var(--ets-orange);color:#fff;margin:0 0 22px;flex:none}
.dlcard__ico svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2}
.dlcard__h{font-family:var(--ets-font-head);font-weight:800;
  font-size:clamp(19px,1.9vw,23px);letter-spacing:-.02em;color:var(--ets-ink);
  margin:0 0 12px;line-height:1.22}
.dlcard__p{color:var(--ets-muted);font-size:16px;line-height:1.66;margin:0 0 26px}
.dlcard .btn{align-self:flex-start;margin-top:auto}
.dlcard__meta{font-family:var(--ets-font-head);font-weight:800;font-size:10.5px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ets-light);margin:16px 0 0}

/* Where a completed form actually goes. The PDFs say it on the last page, but
   somebody who has just downloaded one should not have to open it to find out. */
.dlnote{border-left:3px solid var(--ets-purple);background:var(--ets-tint);
  padding:20px 24px;margin:clamp(24px,3vw,34px) 0 0}
.dlnote__h{font-family:var(--ets-font-head);font-weight:800;font-size:16px;
  color:var(--ets-ink);margin:0 0 6px}
.dlnote__p{margin:0;font-size:15px;line-height:1.65;color:var(--ets-body)}
.dlnote__p a{color:var(--ets-purple);text-decoration:underline}

@media (max-width:820px){.dlcards{grid-template-columns:1fr}}

/* ---------------------------------------------------------------------------
   Google reviews. Renders only when the Places API returns real data, so
   there is no empty-state styling here on purpose.
   --------------------------------------------------------------------------- */
.gmrv{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);
  gap:clamp(28px,4vw,64px);align-items:start}
.gmrv__score{background:#fff;border:1px solid var(--ets-border);
  padding:clamp(24px,2.6vw,34px);box-shadow:0 18px 44px -34px rgba(25,21,33,.5)}
.gmrv__g{width:26px;height:26px;display:block;margin:0 0 16px}
.gmrv__num{display:flex;align-items:center;gap:12px;margin:0 0 8px;
  font-family:var(--ets-font-head);font-weight:900;font-size:clamp(38px,4.4vw,52px);
  line-height:1;letter-spacing:-.03em;color:var(--ets-ink)}
.gmrv__count{margin:0 0 18px;font-size:14px;color:var(--ets-muted)}
.gmrv__link{font-family:var(--ets-font-head);font-weight:800;font-size:14.5px;
  color:var(--ets-purple);text-decoration:none}
.gmrv__link:hover{color:var(--ets-orange-dark)}
.gmrv__host{margin:14px 0 0;font-size:12.5px;line-height:1.5;color:var(--ets-light)}

.gmrv__stars{display:inline-flex;gap:2px;vertical-align:middle}
.gmrv__star{width:16px;height:16px;fill:var(--ets-border)}
.gmrv__star--on{fill:#f5a623}

.gmrv__eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 20px;
  font-family:var(--ets-font-head);font-weight:800;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ets-muted)}
.gmrv__eyebrow::before{content:"";width:34px;height:2px;background:var(--ets-purple);flex:none}
.gmrv__q{margin:0 0 clamp(22px,2.6vw,34px)}
.gmrv__q:last-child{margin-bottom:0}
.gmrv__q blockquote{margin:0 0 16px;font-family:var(--ets-font-head);font-weight:700;
  font-size:clamp(19px,2.1vw,26px);line-height:1.38;letter-spacing:-.015em;color:var(--ets-ink)}
.gmrv__q figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;
  padding-top:16px;border-top:1px solid var(--ets-border);font-size:14px;color:var(--ets-muted)}
.gmrv__who{font-family:var(--ets-font-head);font-weight:800;color:var(--ets-ink)}
.gmrv__when{font-size:13.5px}
.gmrv__q figcaption .gmrv__star{width:13px;height:13px}

/* compact badge, for sitting under a hero button */
.gmrv__badge{display:inline-flex;align-items:center;gap:10px;background:#fff;
  border:1px solid var(--ets-border);padding:10px 18px;text-decoration:none;
  font-size:14px;color:var(--ets-body);transition:.18s}
.gmrv__badge:hover{border-color:var(--ets-purple)}
.gmrv__badgenum{font-family:var(--ets-font-head);font-weight:900;color:var(--ets-ink)}
.gmrv__badgetxt{color:var(--ets-muted)}

@media (max-width:900px){.gmrv{grid-template-columns:1fr;gap:30px}}


/* ---------------------------------------------------------------------------
   Fixes, 5 Oct. Footer resource links, hero legibility, FAQ density.
   The .ft__reslinks rules above were losing to .ft ul (0,1,1) and .ft ul a
   (0,1,2), which is why that block rendered tall with large purple links
   instead of the compact muted row it was drawn as. Raised to .ft ul.<class>,
   the convention this stylesheet already uses for .ft__soc.
   --------------------------------------------------------------------------- */
.ft ul.ft__reslinks a{font-weight:500}
.ft ul.ft__reslinks a::before{content:none}
.ft ul.ft__reslinks a:hover{color:var(--ets-purple)}
.ft ul.ft__reslinks a:hover svg{stroke:var(--ets-purple);transform:translate(1px,-1px)}

/* Supporting hero text sits on the photo too. Lighter than the headline,
   because a heavy shadow on small text reads as a smudge. */
.hero:has(.hero__media) .hero__sub,
.hero:has(.hero__media) .hero__eyebrow,
.hero:has(.hero__media) .hero__note,
.phero:has(.phero__media) .phero__sub,
.phero:has(.phero__media) .phero__eyebrow,
.phero:has(.phero__media) .crumbs,
.phero:has(.phero__media) .crumbs a{text-shadow:0 1px 2px rgba(18,7,38,.5),0 2px 10px rgba(18,7,38,.4)}

/* FAQ density. WordPress gives each block group a 24px block gap; redefining
   the variable on the wrapper is specificity proof, unlike fighting
   .wp-block-group.is-layout-flow > :not(:first-child). */
.qa{--wp--style--block-gap:17px}


/* ---------------------------------------------------------------------------
   HERO CROP ANCHORS, 5 Oct.
   Heroes are a 2.70 box and these photos are 2.13, so object-fit:cover throws
   away about a fifth of the height. Centred, that takes a tenth off the top,
   which is exactly where the faces are in these two. Anchoring the crop higher
   brings every head back into frame. Checked each one against the real hero
   aspect before picking the value; the other heroes crop fine centred and are
   deliberately left alone.
   --------------------------------------------------------------------------- */
.page-id-950 .phero__media img,
.page-id-950 .hero__media img,
.page-id-953 .phero__media img,
.page-id-953 .hero__media img{object-position:50% 32%}


/* ---------------------------------------------------------------------------
   OFFICE MAP EMBED, 5 Oct.
   .office was already a two column grid with an empty right hand column, and
   .office__map already existed as a centred placeholder. These rules switch it
   out of placeholder mode once it actually holds an embed. Keyless embed, so
   there is no API bill and no key to rotate.
   --------------------------------------------------------------------------- */
.office__map:has(iframe){display:block;position:relative;padding:0;font-size:0;letter-spacing:0}
.office__map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}


/* ---------------------------------------------------------------------------
   MEET US SPACING, 5 Oct.
   The hero here is flat purple with no photo, so it is much shorter than a
   photo hero and the standard section padding underneath read as a gap.
   sec--tight-top alone only took it from 144px to 110px.
   --------------------------------------------------------------------------- */
.page-id-949 .phero + .sec{padding-top:clamp(34px,4vw,56px)}


/* ---------------------------------------------------------------------------
   FAQ DENSITY PART TWO, 5 Oct.
   Type alone only bought 14%. The real weight was structural: 38px of padding
   top and bottom on every .qa__item, plus a 24px block gap pushing the answer
   group away from its number. That is 100px of chrome wrapped around roughly
   130px of text, twelve times over.
   --------------------------------------------------------------------------- */
.qa .qa__item{padding-top:21px;padding-bottom:21px}
.qa .qa__item > .wp-block-group.is-layout-flow{margin-top:0}
@media (max-width:700px){
  .qa .qa__item{padding-top:17px;padding-bottom:17px}
}


/* ---------------------------------------------------------------------------
   JOB BOARD REDESIGN, 6 Oct.
   The highlighted card gets a breath of purple and a dark purple outline; the
   outline does the work and the fill just keeps it off flat white. The pane
   gets the same treatment and the Bullhorn text inside it sits on a white
   panel so it still reads as a document.
   --------------------------------------------------------------------------- */
.ib__card.is-open{background:#fbf9fe;border-color:var(--ets-purple-deep);box-shadow:0 10px 26px -18px rgba(77,36,160,.35)}
.ib__card.is-open .ib__attr{background:#fff;border:1px solid var(--ibline)}
.ib__detail{background:#faf9fd}
.ib__detail .ib__attr{background:#fff;border:1px solid var(--ibline)}

/* Facts: a pin before the place, a dollar before the pay. */
.ib__facts{display:flex;flex-direction:column;gap:5px;margin:0 0 11px;font-size:14px;color:var(--ets-body)}
.ib__fact{display:inline-flex;align-items:center;gap:6px}
.ib__fact svg{width:14px;height:14px;flex:0 0 14px;stroke:var(--ets-purple);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ib__fact--pay{color:var(--ets-ink);font-weight:600}
.ib__dtfacts{flex-direction:row;flex-wrap:wrap;gap:6px 18px;font-size:15px;margin:0 0 18px}

/* The five benefits. */
.ib__gives{list-style:none;margin:0;padding:0}
.ib__gives li{display:grid;grid-template-columns:18px 1fr;gap:10px;align-items:start;padding:6px 0;color:var(--ets-ink);font-size:15px}
.ib__gives svg{width:16px;height:16px;stroke:var(--ets-purple);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;margin-top:4px}
.ib__btn.ib__btn--sm{padding:7px 14px;font-size:10.5px;letter-spacing:.12em;margin:0 0 0 10px;vertical-align:middle;position:relative;top:-1px}

.ib__body{background:#fff;border:1px solid var(--ibline);border-radius:calc(var(--ibr) - 4px);padding:20px 22px}
.ib__acts--bottom{margin:22px 0 0;padding-top:22px;border-top:1px solid var(--ibline)}

/* ---------------------------------------------------------------------------
   SINGLE JOB PAGE, 6 Oct. No hero. Reads like a posting.
   --------------------------------------------------------------------------- */
.ets-jobpage{padding-top:clamp(28px,3.5vw,44px)}
.ets-jobpage__shell{max-width:900px}
.ets-jobpage__strip{display:flex;gap:16px;align-items:center;flex-wrap:wrap;font-size:13.5px;color:var(--ets-muted);padding-bottom:18px;border-bottom:1px solid var(--ets-border);margin:0 0 24px}
.ets-jobpage__badge{background:var(--ets-orange);color:#fff;font-family:var(--ets-font-head);font-weight:800;font-size:11.5px;letter-spacing:.06em;padding:5px 10px}
.ets-jobpage__meta{display:inline-flex;align-items:center;gap:6px}
.ets-jobpage__meta svg{width:14px;height:14px;flex:0 0 14px;stroke:var(--ets-purple);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ets-jobpage__title{font-size:clamp(30px,4.4vw,44px);font-weight:900;letter-spacing:-.025em;line-height:1.08;margin:0 0 12px;color:var(--ets-ink)}
.ets-jobpage__id{font-size:14px;color:var(--ets-muted);margin:0 0 16px}
.ets-jobpage__id b{color:var(--ets-ink)}
.ets-jobpage__quick{display:flex;gap:18px;flex-wrap:wrap;font-size:15px;color:var(--ets-ink);padding:14px 16px;background:var(--ets-sec-alt);border-left:3px solid var(--ets-purple);margin:0 0 26px}
.ets-jobpage__pay{font-weight:700}
.ets-jobpage__body{font-size:16px;line-height:1.72}
.ets-jobpage__body .matador-job-meta{display:none}
.ets-jobpage__gives{margin:26px 0 0}
.ets-jobpage__gives h3{font-size:17px;margin:0 0 8px}
.ets-jobpage__gives .ib__gives li{font-size:16px}
.ets-jobpage__apply{margin:26px 0 30px;padding-top:24px;border-top:1px solid var(--ets-border)}
/* Matador's own form controls follow the board's button style. */
.ets-jobpage .matador-application input[type=submit],
.ets-jobpage .matador-application button[type=submit]{background:var(--ets-orange);color:#fff;border:2px solid var(--ets-orange);border-radius:999px;padding:15px 30px;font-family:var(--ets-font-head);font-weight:800;font-size:12px;letter-spacing:.11em;text-transform:uppercase;cursor:pointer}
@media (max-width:640px){
  .ets-jobpage__strip{gap:10px 14px}
  .ets-jobpage__quick{flex-direction:column;gap:8px}
}

/* The generic single template gives every post-content child a gutter and a
   reading measure. On the job page the title already sets the left edge, so
   the body lines up with it and keeps a 72ch measure for the long text. */
main.ets-jobpage .ets-jobpage__body.rich{max-width:none}
main.ets-jobpage .wp-block-post-content > *{padding-left:0;padding-right:0;margin-left:0;margin-right:0;max-width:72ch}
main.ets-jobpage .wp-block-post-content > .matador-application{max-width:none}

/* Outside the board, the page's own link and zero radius rules win over the
   board button classes, so on the job page the buttons are restated in full. */
main.ets-jobpage .ib__btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:15px 30px;border:2px solid transparent;font-family:var(--ets-font-head);font-weight:800;font-size:12px;letter-spacing:.11em;text-transform:uppercase;text-decoration:none;line-height:1;margin:0;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
main.ets-jobpage .ib__btn--o{background:var(--ets-orange);border-color:var(--ets-orange);color:#fff}
main.ets-jobpage .ib__btn--o:hover{background:var(--ets-purple);border-color:var(--ets-purple);color:#fff}
main.ets-jobpage .ib__btn--line{background:#fff;border-color:#dfdce6;color:var(--ets-purple)}
main.ets-jobpage .ib__btn--line:hover{border-color:var(--ets-purple)}
main.ets-jobpage .ib__btn.ib__btn--sm{padding:7px 14px;font-size:10.5px;letter-spacing:.12em;margin:0 0 0 10px;vertical-align:middle;position:relative;top:-1px}

/* Why work with ETS hero: keep the recruiter's face in frame on tablet and phone */
@media (max-width:1024px){.page-id-936 .phero__media img,.page-id-936 .hero__media img{object-position:62% 50%}}
@media (max-width:640px){.page-id-936 .phero__media img,.page-id-936 .hero__media img{object-position:70% 50%}}

/* Section spacing, tightened 12 Oct at the CEO's request. Sections used to carry
   72 to 144px top and bottom plus WordPress's 24px block gap between them. */
:root{--ets-section:clamp(52px,6vw,96px);--ets-section-tight:clamp(40px,4.5vw,64px)}
.sec--tight-top{padding-top:clamp(44px,5vw,76px)}
main .wp-block-post-content > .wp-block-group + .wp-block-group,
main .wp-block-post-content > * + .sec,
main .wp-block-post-content > * + .stats,
main .wp-block-post-content > * + .cta,
main .wp-block-post-content > * + section,
main .wp-block-post-content > .hero + *,
main .wp-block-post-content > .phero + *{margin-top:0}

/* Google rating card, layered over the hero and the stats strip (home page) */
.stats{position:relative}
.stats__gbadge{position:absolute;left:0;right:0;top:0;z-index:6;pointer-events:none}
.stats__gbadge .shell{display:flex;justify-content:flex-end}
.gcard{pointer-events:auto;display:inline-flex;align-items:center;gap:14px;background:#fff;padding:14px 22px 14px 16px;border:1px solid var(--ets-border);box-shadow:0 18px 40px -18px rgba(25,21,33,.45),0 2px 6px rgba(25,21,33,.08);transform:translateY(-50%);text-decoration:none;color:var(--ets-ink);transition:transform .2s,box-shadow .2s}
.gcard:hover{transform:translateY(calc(-50% - 2px));box-shadow:0 22px 44px -18px rgba(25,21,33,.5),0 2px 6px rgba(25,21,33,.08);color:var(--ets-ink)}
.gcard__g{width:40px;height:40px;flex:0 0 40px}
.gcard__label{display:block;font-family:var(--ets-font-head);font-weight:700;font-size:15px;line-height:1.2;color:var(--ets-ink)}
.gcard__row{display:flex;align-items:center;gap:8px;margin-top:3px}
.gcard__num{font-family:var(--ets-font-head);font-weight:800;font-size:17px;line-height:1;color:var(--ets-ink)}
.gcard .gmrv__stars{display:inline-flex;gap:2px}
.gcard .gmrv__star{width:18px;height:18px;fill:#e7e4ee}
.gcard .gmrv__star--on{fill:#fbbc05}
@media (max-width:700px){
  .stats__gbadge .shell{justify-content:center}
  .hero:has(+ .stats .gcard){padding-bottom:76px}
  .stats:has(.gcard){padding-top:calc(var(--ets-section-tight) + 32px)}
}

/* Google reviews wall (Client reviews page): score card plus review cards */
.gmrv--wall{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:clamp(24px,3vw,44px);align-items:start}
.gmrv--wall .gmrv__score{background:#fff;border:1px solid var(--ets-border);padding:clamp(24px,2.6vw,34px);box-shadow:0 18px 40px -24px rgba(25,21,33,.35);position:sticky;top:120px}
.gmrv--wall .gmrv__g{width:34px;height:34px;display:block;margin:0 0 16px}
.gmrv--wall .gmrv__num{display:flex;align-items:center;gap:12px;margin:0 0 8px;font-family:var(--ets-font-head);font-weight:900;font-size:44px;line-height:1;color:var(--ets-ink)}
.gmrv--wall .gmrv__stars{display:inline-flex;gap:2px}
.gmrv--wall .gmrv__num .gmrv__star{width:22px;height:22px}
.gmrv--wall .gmrv__star{width:16px;height:16px;fill:#e7e4ee}
.gmrv--wall .gmrv__star--on{fill:#fbbc05}
.gmrv--wall .gmrv__count{margin:0 0 18px;font-size:14px;color:var(--ets-muted)}
.gmrv__btn{display:inline-block;background:var(--ets-purple);color:#fff;font-family:var(--ets-font-head);font-weight:800;font-size:11.5px;letter-spacing:.11em;text-transform:uppercase;text-decoration:none;padding:13px 18px;margin:0 0 14px}
.gmrv__btn:hover{background:var(--ets-purple-deep);color:#fff}
.gmrv--wall .gmrv__host{margin:0;font-size:12.5px;color:var(--ets-light)}
.gmrv--wall .gmrv__quotes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:0}
.gmrv--wall .gmrv__quotes > .gmrv__q:first-child{grid-column:1 / -1}
.gmrv--wall .gmrv__q{margin:0;background:#fff;border:1px solid var(--ets-border);border-top:3px solid var(--ets-orange);padding:22px 24px;display:flex;flex-direction:column;gap:12px}
.gmrv--wall .gmrv__q blockquote{margin:0;font-family:var(--ets-font-body);font-weight:400;font-style:normal;font-size:15.5px;line-height:1.6;color:var(--ets-body);flex:1}
.gmrv--wall .gmrv__quotes > .gmrv__q:first-child blockquote{font-size:17px;max-width:62ch}
.gmrv--wall .gmrv__q figcaption{display:flex;align-items:center;gap:10px;font-size:13.5px;padding-top:12px;border-top:1px solid var(--ets-border)}
.gmrv--wall .gmrv__who{font-family:var(--ets-font-head);font-weight:800;color:var(--ets-ink)}
.gmrv--wall .gmrv__when{color:var(--ets-muted)}
.gmrv__qg{width:16px;height:16px;margin-left:auto;flex:0 0 16px}
@media (max-width:900px){
  .gmrv--wall{grid-template-columns:1fr}
  .gmrv--wall .gmrv__score{position:static}
  .gmrv--wall .gmrv__quotes{grid-template-columns:1fr}
}

/* Stars: grey base with a yellow fill clipped to the fraction Google reports */
.gmrv__star .gmrv__star-bg{fill:#e7e4ee}
.gmrv__star .gmrv__star-fg{fill:#fbbc05}

/* Widgets for Google Reviews badge (Trustindex "HTML badge II") inside the hero/stats wrapper */
.stats__gbadge pre.ti-widget{margin:0;padding:0;background:none;border:0;white-space:normal;font:inherit}
.stats__gbadge .ti-widget-container{display:flex!important;justify-content:flex-end;padding:0!important;margin:0!important;transform:translateY(calc(-100% - 28px))}
.stats__gbadge .ti-widget .ti-widget-container a.ti-header.ti-header-grid{pointer-events:auto;background:#fff!important;border:1px solid var(--ets-border)!important;border-radius:0!important;box-shadow:0 18px 40px -18px rgba(25,21,33,.45),0 2px 6px rgba(25,21,33,.08)!important;margin:0!important}
@media (max-width:700px){
  .stats__gbadge .ti-widget-container{justify-content:center}
  .hero:has(+ .stats .ti-widget){padding-bottom:132px}
  .stats__gbadge .ti-widget-container{transform:translateY(calc(-100% - 24px))}
}

/* Blog: listing, cards, pagination, single post */
.bhero .crumbs{margin-bottom:14px}
.bchips{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 0}
.bchip{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid rgba(255,255,255,.35);color:#fff;font-family:var(--ets-font-head);font-weight:800;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;transition:background .2s,border-color .2s}
.bchip b{font-weight:700;color:rgba(255,255,255,.7);letter-spacing:0}
.bchip:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.7);color:#fff}
.bchip.is-on{background:var(--ets-orange);border-color:var(--ets-orange);color:#fff}
.bchip.is-on b{color:rgba(255,255,255,.85)}
.bgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.2vw,28px)}
.bcard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--ets-border);min-width:0}
.bcard__img{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--ets-tint)}
.bcard__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.16,.84,.44,1)}
.bcard:hover .bcard__img img{transform:scale(1.04)}
.bcard__ph{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:linear-gradient(135deg,var(--ets-purple-deep),var(--ets-purple))}
.bcard__ph span{font-family:var(--ets-font-head);font-weight:900;font-size:56px;color:rgba(255,255,255,.28);letter-spacing:-.04em}
.bcard__body{display:flex;flex-direction:column;gap:10px;padding:22px 24px 24px;flex:1}
.bcard__eyebrow{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0;font-family:var(--ets-font-head);font-weight:800;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ets-orange)}
.bcard__eyebrow time{color:var(--ets-light);font-weight:700}
.bcard__t{margin:0;font-family:var(--ets-font-head);font-weight:800;font-size:clamp(18px,1.4vw,20px);line-height:1.22;letter-spacing:-.015em;color:var(--ets-ink)}
.bcard__t a{color:inherit;text-decoration:none}
.bcard__t a:hover{color:var(--ets-purple)}
.bcard__x{margin:0;font-size:15px;line-height:1.55;color:var(--ets-body);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bcard__more{margin-top:auto;padding-top:6px;font-family:var(--ets-font-head);font-weight:800;font-size:13px;color:var(--ets-purple);text-decoration:none}
.bcard__more:hover{color:var(--ets-orange-dark)}
.bcard--feat{grid-column:1 / -1;flex-direction:row;align-items:stretch}
.bcard--feat .bcard__img{flex:0 0 52%;aspect-ratio:auto;min-height:340px}
.bcard--feat .bcard__body{padding:clamp(26px,3vw,44px);justify-content:center;gap:14px}
.bcard--feat .bcard__t{font-size:clamp(24px,2.4vw,34px);line-height:1.12;letter-spacing:-.025em}
.bcard--feat .bcard__x{-webkit-line-clamp:4;font-size:16px}
.bcard--feat .bcard__more{margin-top:4px}
.bpage{margin:clamp(34px,4vw,52px) 0 0}
.bpage ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.bpage .page-numbers{display:inline-flex;align-items:center;min-height:42px;padding:0 15px;border:1px solid var(--ets-border);background:#fff;font-family:var(--ets-font-head);font-weight:800;font-size:13px;color:var(--ets-ink);text-decoration:none}
.bpage a.page-numbers:hover{border-color:var(--ets-purple);color:var(--ets-purple)}
.bpage .page-numbers.current{background:var(--ets-purple);border-color:var(--ets-purple);color:#fff}
.bpage .page-numbers.dots{border:0;background:none;color:var(--ets-light)}
.bempty{text-align:center;color:var(--ets-muted)}
.post__hero .crumbs{margin-bottom:14px}
.post__hero .phero__title{max-width:22ch}
.post__meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:18px 0 0;font-size:14px;color:rgba(255,255,255,.82)}
.post__dot{width:4px;height:4px;background:var(--ets-orange);display:inline-block}
.post__shell{max-width:900px}
.post__img{margin:0 0 clamp(26px,3vw,40px);aspect-ratio:16/9;overflow:hidden;background:var(--ets-tint)}
.post__img img{width:100%;height:100%;object-fit:cover;display:block}
main.post .post__body.rich{max-width:none}
main.post .wp-block-post-content > *{padding-left:0;padding-right:0;margin-left:0;margin-right:0;max-width:72ch}
main.post .post__body p,main.post .post__body li{font-size:17px;line-height:1.7}
main.post .post__body h2,main.post .post__body h3,main.post .post__body h4{margin-top:1.6em}
main.post .post__body img{height:auto;max-width:100%}
main.post .post__body img.alignleft{float:left;margin:4px 28px 16px 0;max-width:min(45%,360px)}
main.post .post__body img.alignright{float:right;margin:4px 0 16px 28px;max-width:min(45%,360px)}
main.post .post__body img.aligncenter{display:block;margin:0 auto 20px}
main.post .post__body .video{position:relative;aspect-ratio:16/9;margin:0 0 24px;background:#000}
main.post .post__body .video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
main.post .post__body blockquote{border-left:3px solid var(--ets-orange);padding:4px 0 4px 22px;margin:0 0 24px;font-style:italic;color:var(--ets-ink)}
main.post .post__body table{width:100%;border-collapse:collapse;font-size:15px}
main.post .post__body td,main.post .post__body th{border:1px solid var(--ets-border);padding:8px 10px;text-align:left}
.brel .head{align-items:end}
.brel__all{font-family:var(--ets-font-head);font-weight:800;color:var(--ets-purple);text-decoration:none}
.brel__all:hover{color:var(--ets-orange-dark)}
@media (max-width:1024px){.bgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){
  .bgrid{grid-template-columns:1fr}
  .bcard--feat{flex-direction:column}
  .bcard--feat .bcard__img{flex:none;aspect-ratio:16/10;min-height:0}
  .bcard--feat .bcard__body{padding:22px 24px 24px}
  main.post .post__body img.alignleft,main.post .post__body img.alignright{float:none;margin:0 0 18px;max-width:100%}
}