/* =========================================================================
   Watson's Way ABA

   The opposite instinct to the PBA site. That practice sells method, so it is
   set like a journal: sharp corners, hairline rules, navy, a serif at a tight
   scale. This practice sells the room and the people, so everything here is
   soft, warm and photographic — big radii, cream and clay, a rounded display
   face, and shapes that behave like stickers rather than rules.

   Scoped to .wway-site so the plugin can never bleed into the theme.
   ========================================================================= */

.wway-site{
  --ink:#22201C;          /* warm near-black — 15.4:1 on cream */
  --body:#4E463C;         /* 7.6:1 */
  --mute:#645B4F;         /* 5.4:1 on cream, 4.8:1 on sand */
  --cream:#FFFBF3;
  --sand:#F6EEDC;
  --shell:#FFFFFF;
  --line:#EADFC7;

  /* Sampled from Watson's own artwork — the navy of the accreditation badge
     and the gold and bronze of the crescent logo. Nothing invented here.
     Gold is a FILL colour only: at 2.5:1 on cream it cannot carry text. */
  --clay:#8B0000;         /* deep navy — 15.3:1 on cream */
  --clay-deep:#6E0000;    /* 11.6:1, for hover and depth */
  --clay-wash:#F7EAEA;
  --moss:#7A4E12;         /* bronze — 6.9:1, the secondary */
  --sun:#F0D878;          /* crescent gold — 11.8:1 on the ink footer, but only
                             2.5:1 on cream, so: fills anywhere, text on dark only */
  --sky:#3E6B8C;

  /* Warmer, child-friendly accents for the refreshed home page.
     Anchored on the crescent gold already in the logo, so the page reads
     brighter without losing the brand. Sunshine is a FILL: white on it is
     1.5:1, ink is 10.6:1, so it always carries dark text. */
  --sun-cta:#FFC93C;
  --sun-cta-deep:#F0B417;
  --sky-blue:#1F5FC4;      /* 5.8:1 on cream */
  --leaf:#2E7D5B;          /* 4.8:1 on cream */
  --blush:#FDEEEE;
  --sky-wash:#EAF1FC;
  --leaf-wash:#E8F4EE;
  --sun-wash:#FFF4D6;

  --display:'Fahkwang','Trebuchet MS',system-ui,sans-serif;
  --sans:'Work Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  --t-xs:12.5px; --t-sm:14.5px; --t-base:17px; --t-md:19px;
  --t-lg:clamp(21px,1.9vw,25px);
  --t-xl:clamp(28px,3.2vw,40px);
  --t-2xl:clamp(32px,4.4vw,52px);
  --t-3xl:clamp(38px,6vw,72px);

  --r-xl:38px; --r-lg:28px; --r-md:20px; --r-sm:14px; --r-pill:999px;

  --s1:8px; --s2:16px; --s3:26px; --s4:42px; --s5:68px; --s6:104px;
  --ease:cubic-bezier(.22,1,.36,1);
  --lift:0 24px 54px -32px rgba(42,33,28,.45);
  --lift-lg:0 34px 70px -36px rgba(42,33,28,.5);
}

.wway-site *,.wway-site *::before,.wway-site *::after{box-sizing:border-box}

html:has(body.wway-site){overflow-x:clip}
body.wway-site{
  margin:0;background:var(--cream);color:var(--body);
  font:400 var(--t-base)/1.72 var(--sans);
  -webkit-font-smoothing:antialiased;overflow-x:clip;
}

.wway-site img{max-width:100%;display:block;height:auto}
.wway-site a{color:var(--clay-deep)}
.wway-site h1,.wway-site h2,.wway-site h3{
  margin:0;color:var(--ink);font-family:var(--display);font-weight:600;
  line-height:1.14;letter-spacing:-.005em}
.wway-site p{margin:0 0 1.1em}
.wway-site p:last-child{margin-bottom:0}
.wway-site .ico{width:17px;height:17px;flex:0 0 auto}

.wway-site .wrap{width:min(1200px,100% - 44px);margin-inline:auto}
.wway-site .mb{margin-bottom:var(--s3)}
.wway-site .h-md{font-size:var(--t-xl);margin-bottom:14px}
.wway-site .lede{font-size:var(--t-md);line-height:1.68;color:var(--mute);max-width:58ch}

.wway-site .skip,.wway-site .skip:hover,.wway-site .skip:focus{
  position:absolute;left:-9999px;top:0;background:var(--clay-deep);color:#fff;
  padding:12px 22px;z-index:200;border-radius:0 0 var(--r-sm) 0;text-decoration:none}
.wway-site .skip:focus{left:0}

/* ---------- atoms ---------- */

.wway-site .pill{display:inline-flex;align-items:center;gap:8px;
  background:var(--clay-wash);color:var(--clay-deep);
  border-radius:var(--r-pill);padding:9px 18px;margin-bottom:18px;
  font:700 var(--t-xs)/1 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.wway-site .pill .ico{width:15px;height:15px}
/* A translucent WHITE fill lightens the ground beneath it: white text landed
   at 3.7:1 on the clay card and 3.9:1 on the moss band. Darkening instead of
   lightening keeps the same soft look and takes it to 6.7:1 / 7.6:1. */
.wway-site .pill-light{background:rgba(0,0,0,.14);color:#fff}

.wway-site .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:16px 30px;border:2px solid transparent;border-radius:var(--r-pill);
  font:700 15.5px/1 var(--sans);text-decoration:none;cursor:pointer;min-height:54px;
  transition:transform .3s var(--ease),background .3s,color .3s,border-color .3s,box-shadow .3s}
.wway-site .btn .ico{transition:transform .3s var(--ease)}
.wway-site .btn:hover{transform:translateY(-3px)}
.wway-site .btn:hover .ico{transform:translateX(4px)}
.wway-site .btn-solid{background:var(--clay);color:#fff;box-shadow:0 12px 26px -16px rgba(179,74,44,.9)}
.wway-site .btn-solid:hover{background:var(--clay-deep);color:#fff}
.wway-site .btn-out{border-color:var(--line);color:var(--ink);background:var(--shell)}
.wway-site .btn-out:hover{border-color:var(--clay);color:var(--clay-deep)}
.wway-site .btn-quiet{color:var(--clay-deep);background:transparent}
.wway-site .btn-quiet:hover{background:var(--clay-wash)}
.wway-site .btn-cream{background:#fff;color:var(--clay-deep)}
.wway-site .btn-cream:hover{background:var(--sun);color:var(--ink)}
.wway-site .btn-clear{border-color:rgba(255,255,255,.6);color:#fff}
.wway-site .btn-clear:hover{background:rgba(255,255,255,.16);color:#fff}

/* =========================================================================
   Announcement bar + floating header capsule
   ========================================================================= */

.wway-site .ann{background:var(--ink);color:rgba(255,255,255,.88);font-size:13.5px}
.wway-site .ann-in{display:flex;align-items:center;gap:22px;min-height:44px;flex-wrap:wrap}
.wway-site .ann a,.wway-site .ann span{display:inline-flex;align-items:center;gap:8px}
.wway-site .ann a{color:inherit;text-decoration:none}
.wway-site .ann a:hover{color:#fff}
.wway-site .ann .ico{width:14px;height:14px;opacity:.75}
.wway-site .ann-pill{background:var(--sun);color:var(--ink);font-weight:700;
  border-radius:var(--r-pill);padding:4px 13px;font-size:12px}
.wway-site .ann-end{margin-left:auto;color:var(--sun);font-weight:600}

.wway-site .head{position:sticky;top:0;z-index:90;padding:14px 0;background:var(--cream)}
.wway-site .capsule{display:flex;align-items:center;justify-content:space-between;gap:20px;
  background:var(--shell);border-radius:var(--r-pill);padding:11px 12px 11px 18px;
  box-shadow:0 16px 40px -28px rgba(42,33,28,.5);
  transition:box-shadow .3s var(--ease),padding .3s var(--ease)}
.wway-site .head.is-stuck .capsule{box-shadow:0 22px 48px -26px rgba(42,33,28,.55);
  padding-block:8px}

.wway-site .brand{display:flex;align-items:center;gap:13px;text-decoration:none}
.wway-site .brand-badge{width:52px;height:52px;border-radius:50%;background:var(--clay-wash);
  display:grid;place-items:center;flex:0 0 auto;overflow:hidden;
  transition:width .3s var(--ease),height .3s var(--ease)}
.wway-site .brand-badge img{width:36px;height:auto}
.wway-site .head.is-stuck .brand-badge{width:44px;height:44px}
.wway-site .brand-t b{display:block;font:600 17.5px/1.15 var(--display);color:var(--ink)}
.wway-site .brand-t i{display:block;font-style:italic;font-size:12.5px;color:var(--clay-deep)}

.wway-site .nav{display:flex;align-items:center;gap:6px}
.wway-site .nav-l{display:flex;align-items:center;gap:2px;list-style:none;margin:0;padding:0}
.wway-site .nav-a{display:inline-flex;align-items:center;gap:7px;
  padding:11px 17px;border-radius:var(--r-pill);
  color:var(--ink);text-decoration:none;font:600 15.5px/1 var(--sans);
  background:none;border:0;cursor:pointer;font-family:var(--sans);
  transition:background .25s var(--ease),color .25s}
.wway-site .nav-a:hover,.wway-site .nav-a.is-on{background:var(--clay-wash);color:var(--clay-deep)}
/* `.nav a{color:ink}` would otherwise outrank the button's white text and
   leave the primary CTA unreadable on its own fill. */
.wway-site .nav .nav-cta,.wway-site .nav .nav-cta:hover{color:#fff;background:var(--clay)}
.wway-site .nav .nav-cta:hover{background:var(--clay-deep)}
.wway-site .nav-cta{margin-left:8px;padding:14px 24px;min-height:0}

.wway-site .caret{width:7px;height:7px;border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);
  transition:transform .3s var(--ease)}
.wway-site .mega-btn[aria-expanded="true"] .caret{transform:rotate(-135deg) translateY(-2px)}

/* =========================================================================
   Mega menu — a three-column card grid with a CTA bar beneath.
   Structurally different from the PBA menu's two columns plus side panel.
   ========================================================================= */

.wway-site .has-mega{position:static}

.wway-site .mega{position:absolute;left:0;right:0;top:calc(100% + 8px);
  opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity .28s var(--ease),transform .28s var(--ease),visibility .28s;
  z-index:95;pointer-events:none}
.wway-site .mega[hidden]{display:block}
.wway-site .has-mega.is-open .mega{opacity:1;visibility:visible;transform:none;pointer-events:auto}

.wway-site .mega-shell{background:var(--shell);border-radius:var(--r-lg);
  padding:26px;box-shadow:var(--lift-lg)}

.wway-site .mega-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.wway-site .mcard{display:block;padding:18px;border-radius:var(--r-md);
  text-decoration:none;background:var(--cream);
  transition:background .25s var(--ease),transform .25s var(--ease)}
.wway-site .mcard:hover{background:var(--clay-wash);transform:translateY(-3px)}
.wway-site .mcard-ico{width:42px;height:42px;border-radius:14px;background:var(--shell);
  color:var(--clay);display:grid;place-items:center;margin-bottom:13px;
  transition:background .25s,color .25s}
.wway-site .mcard-ico .ico{width:21px;height:21px}
.wway-site .mcard:hover .mcard-ico{background:var(--clay);color:#fff}
.wway-site .mcard-t{display:block;font:600 16.5px/1.3 var(--display);color:var(--ink);margin-bottom:5px}
.wway-site .mcard-d{display:block;font-size:13.5px;line-height:1.5;color:var(--mute)}

.wway-site .mega-bar{display:flex;align-items:center;justify-content:space-between;
  gap:20px;flex-wrap:wrap;margin-top:18px;padding:18px 20px;
  background:var(--sand);border-radius:var(--r-md)}
.wway-site .mega-bar p{margin:0;font-size:15px;color:var(--body)}
.wway-site .mega-bar strong{color:var(--ink)}
.wway-site .mega-bar-a{display:flex;gap:10px;flex-wrap:wrap}
.wway-site .mega-bar .btn{min-height:48px;padding:13px 24px}

.wway-site .burger{display:none;width:52px;height:52px;border:0;border-radius:50%;
  background:var(--clay-wash);cursor:pointer;position:relative}
.wway-site .burger i{position:absolute;left:16px;width:20px;height:2.5px;border-radius:2px;
  background:var(--clay-deep);transition:transform .3s var(--ease),opacity .2s}
.wway-site .burger i:nth-child(1){top:18px}
.wway-site .burger i:nth-child(2){top:25px}
.wway-site .burger i:nth-child(3){top:32px}
.wway-site .burger[aria-expanded="true"] i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.wway-site .burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.wway-site .burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.wway-site .scrim{position:fixed;inset:0;background:rgba(42,33,28,.42);z-index:85;
  opacity:0;transition:opacity .3s}
.wway-site .scrim.is-on{opacity:1}

/* =========================================================================
   Hero
   ========================================================================= */

.wway-site .hero{padding:var(--s5) 0 var(--s5);position:relative}
.wway-site .hero-in{display:grid;grid-template-columns:1.02fr .98fr;gap:var(--s5);
  align-items:center}
.wway-site .hero h1{font-size:var(--t-3xl);line-height:1.04}
.wway-site .hero h1 span{color:var(--clay);font-style:italic}
.wway-site .hero .lede{margin:22px 0 30px}
.wway-site .hero-cta{display:flex;gap:13px;flex-wrap:wrap}

.wway-site .hero-shot{position:relative}
/* An organic corner — the PBA hero is a plain rectangle. */
.wway-site .hero-shot>img{width:100%;aspect-ratio:16/11;object-fit:cover;
  border-radius:var(--r-xl) var(--r-xl) var(--r-xl) 120px}
.wway-site .hero-tag{position:absolute;right:-16px;bottom:38px;background:var(--shell);
  border-radius:var(--r-lg);padding:16px 20px;display:flex;align-items:center;gap:13px;
  box-shadow:var(--lift)}
.wway-site .hero-tag-ico{width:44px;height:44px;border-radius:50%;background:var(--moss);
  color:#fff;display:grid;place-items:center;flex:0 0 auto}
.wway-site .hero-tag b{display:block;font:600 15px/1.3 var(--display);color:var(--ink)}
.wway-site .hero-tag i{font-style:normal;font-size:13px;color:var(--mute)}

/* ---------- stat bubbles ---------- */
.wway-site .bubbles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
  margin-top:var(--s5)}
.wway-site .bubble{background:var(--shell);border-radius:var(--r-lg);padding:22px;
  box-shadow:0 14px 32px -26px rgba(42,33,28,.5);text-align:center}
.wway-site .bubble-ico{width:44px;height:44px;border-radius:50%;background:var(--sand);
  color:var(--clay-deep);display:grid;place-items:center;margin:0 auto 12px}
.wway-site .bubble b{display:block;font:700 25px/1 var(--display);color:var(--ink);margin-bottom:5px}
.wway-site .bubble span{font-size:13.5px;color:var(--mute);line-height:1.45}

/* ---------- page heads ---------- */
.wway-site .phead{background:var(--sand);padding:var(--s5) 0 var(--s5);
  border-radius:0 0 var(--r-xl) var(--r-xl)}
.wway-site .phead h1{font-size:var(--t-2xl);margin-bottom:16px}

/* =========================================================================
   Sections
   ========================================================================= */

.wway-site .sect{padding:var(--s6) 0}
.wway-site .sect-sand{background:var(--sand)}
.wway-site .head-block{max-width:640px;margin:0 auto var(--s5)}
.wway-site .head-block.center{text-align:center}
.wway-site .head-block h2{font-size:var(--t-2xl)}
.wway-site .head-block .lede{margin:16px auto 0}

/* ---------- bento services grid ---------- */
.wway-site .bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.wway-site .bt{background:var(--shell);border-radius:var(--r-lg);overflow:hidden;
  text-decoration:none;display:flex;flex-direction:column;
  box-shadow:0 18px 44px -34px rgba(42,33,28,.5);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.wway-site .bt:hover{transform:translateY(-6px);box-shadow:var(--lift)}
.wway-site .bt-lead{grid-column:span 2;flex-direction:row;align-items:stretch}
.wway-site .bt-media{width:46%;flex:0 0 auto;overflow:hidden}
.wway-site .bt-media img{width:100%;height:100%;object-fit:cover;
  transition:transform 1s var(--ease)}
.wway-site .bt:hover .bt-media img{transform:scale(1.05)}
.wway-site .bt-body{padding:24px;display:flex;flex-direction:column;flex:1 1 auto}
.wway-site .bt-ico{width:46px;height:46px;border-radius:16px;background:var(--clay-wash);
  color:var(--clay);display:grid;place-items:center;margin-bottom:15px;
  transition:background .3s,color .3s}
.wway-site .bt-ico .ico{width:22px;height:22px}
.wway-site .bt:hover .bt-ico{background:var(--clay);color:#fff}
.wway-site .bt-where{display:block;font:700 11.5px/1 var(--sans);letter-spacing:.12em;
  text-transform:uppercase;color:var(--mute);margin-bottom:9px}
.wway-site .bt-t{display:block;font:600 20px/1.25 var(--display);color:var(--ink);margin-bottom:8px}
.wway-site .bt-d{display:block;font-size:15px;line-height:1.6;color:var(--mute);
  margin-bottom:16px;flex:1 1 auto}
.wway-site .bt-go{display:inline-flex;align-items:center;gap:8px;
  font:700 14.5px/1 var(--sans);color:var(--clay-deep)}
.wway-site .bt-go .ico{transition:transform .3s var(--ease)}
.wway-site .bt:hover .bt-go .ico{transform:translateX(5px)}

/* ---------- journey ---------- */
.wway-site .journey{list-style:none;margin:0 auto;padding:0;max-width:780px;
  display:grid;gap:14px}
.wway-site .jstep{display:flex;align-items:flex-start;gap:20px;background:var(--shell);
  border-radius:var(--r-lg);padding:22px 24px;box-shadow:0 14px 34px -30px rgba(42,33,28,.5)}
.wway-site .jstep:nth-child(even){margin-left:auto;width:96%}
.wway-site .jdot{width:44px;height:44px;border-radius:50%;background:var(--clay);color:#fff;
  display:grid;place-items:center;flex:0 0 auto;font:700 17px/1 var(--display)}
.wway-site .jbody b{display:block;font:600 19px/1.3 var(--display);color:var(--ink);margin-bottom:5px}
.wway-site .jbody span{font-size:15.5px;color:var(--mute);line-height:1.6}

/* ---------- team ---------- */
.wway-site .team{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.wway-site .tcard{background:var(--shell);border-radius:var(--r-lg);padding:26px;
  box-shadow:0 16px 40px -32px rgba(42,33,28,.5)}
.wway-site .tcard-ico{width:52px;height:52px;border-radius:18px;background:var(--sand);
  color:var(--moss);display:grid;place-items:center;margin-bottom:16px}
.wway-site .tcard-ico .ico{width:25px;height:25px}
.wway-site .tcard h3{font-size:19px;margin-bottom:9px}
.wway-site .tcard p{margin:0;font-size:15px;color:var(--mute);line-height:1.6}

/* ---------- collage ---------- */
.wway-site .collage{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.wway-site .collage a{display:block;overflow:hidden;background:var(--sand)}
.wway-site .collage img{width:100%;height:100%;object-fit:cover;
  transition:transform 1.1s var(--ease)}
.wway-site .collage a:hover img{transform:scale(1.05)}
.wway-site .c1{grid-column:span 4;aspect-ratio:16/10;
  border-radius:var(--r-xl) var(--r-xl) 90px var(--r-xl)}
.wway-site .c2{grid-column:span 2;aspect-ratio:3/4;border-radius:var(--r-xl)}
.wway-site .c3{grid-column:span 2;aspect-ratio:1/1;
  border-radius:var(--r-xl) 90px var(--r-xl) var(--r-xl)}
.wway-site .c4{grid-column:span 2;aspect-ratio:1/1;border-radius:var(--r-xl)}
.wway-site .c5{grid-column:span 2;aspect-ratio:1/1;border-radius:var(--r-xl)}

/* ---------- duo (image + copy) ---------- */
.wway-site .duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);align-items:center}
.wway-site .duo.flip .duo-shot{order:2}
.wway-site .duo-shot img{width:100%;aspect-ratio:4/3;object-fit:cover;
  border-radius:var(--r-xl) 90px var(--r-xl) var(--r-xl)}
.wway-site .duo .btn{margin-top:var(--s2)}

/* ---------- family band ---------- */
.wway-site .band{background:var(--moss);border-radius:var(--r-xl);
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);align-items:center;
  padding:var(--s5);color:rgba(255,255,255,.9);overflow:hidden}
.wway-site .band h2{color:#fff;font-size:var(--t-xl);margin-bottom:14px}
.wway-site .band p{color:rgba(255,255,255,.88);margin-bottom:26px}
.wway-site .band img{border-radius:var(--r-lg);aspect-ratio:4/3;object-fit:cover}

/* ---------- faq ---------- */
.wway-site .faqs{display:grid;gap:12px;max-width:860px;margin-inline:auto}
.wway-site .faqs details{background:var(--shell);border-radius:var(--r-md);
  box-shadow:0 12px 30px -28px rgba(42,33,28,.5);overflow:hidden}
.wway-site .faqs summary{list-style:none;cursor:pointer;display:flex;align-items:center;
  justify-content:space-between;gap:18px;padding:20px 24px;min-height:56px;
  font:600 17.5px/1.4 var(--display);color:var(--ink)}
.wway-site .faqs summary::-webkit-details-marker{display:none}
.wway-site .faqs summary i{width:32px;height:32px;border-radius:50%;background:var(--clay-wash);
  display:grid;place-items:center;flex:0 0 auto;position:relative}
.wway-site .faqs summary i::before,.wway-site .faqs summary i::after{content:"";
  position:absolute;background:var(--clay-deep);border-radius:2px;
  transition:transform .3s var(--ease)}
.wway-site .faqs summary i::before{width:13px;height:2.5px}
.wway-site .faqs summary i::after{width:2.5px;height:13px}
.wway-site .faqs details[open] summary i::after{transform:scaleY(0)}
.wway-site .faqs .ans{padding:0 24px 22px;color:var(--mute);font-size:15.5px;line-height:1.7}
.wway-site .faqs .ans strong{color:var(--ink)}

/* ---------- jobs ---------- */
.wway-site .jobs{display:grid;gap:12px;max-width:820px;margin-inline:auto}
.wway-site .job{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);
  background:var(--shell);border-radius:var(--r-lg);padding:22px 26px;flex-wrap:wrap;
  box-shadow:0 14px 34px -30px rgba(42,33,28,.5)}
.wway-site .job h3{font-size:19px;margin-bottom:6px}
.wway-site .job p{margin:0;display:flex;align-items:center;gap:8px;font-size:14.5px;color:var(--mute)}

/* ---------- contact ---------- */
.wway-site .reach{display:grid;grid-template-columns:1.08fr .92fr;gap:var(--s4);
  background:var(--shell);border-radius:var(--r-xl);padding:var(--s5);
  box-shadow:var(--lift)}
.wway-site .sect-sand .reach{background:var(--shell)}
.wway-site .field{margin-bottom:16px;display:flex;flex-direction:column}
.wway-site .field label{font:700 14px/1 var(--sans);color:var(--ink);margin-bottom:8px}
.wway-site .field input,.wway-site .field textarea{
  font:400 16px/1.55 var(--sans);color:var(--ink);background:var(--cream);
  border:2px solid transparent;border-radius:var(--r-sm);padding:14px 16px;width:100%;
  transition:border-color .25s,background .25s}
.wway-site .field input:focus,.wway-site .field textarea:focus{
  outline:none;background:var(--shell);border-color:var(--clay)}
.wway-site .field.has-err input,.wway-site .field.has-err textarea{border-color:#B3261E}
.wway-site .pair{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}

.wway-site .err{margin:7px 0 0;font-size:13.5px;color:#B3261E;display:none}
.wway-site .err.is-on{display:block}

.wway-site .consent{display:flex;align-items:center;gap:11px;margin:6px 0 4px;
  font-size:14.5px;color:var(--body);cursor:pointer;min-height:44px}
.wway-site .consent input{width:22px;height:22px;flex:0 0 auto;accent-color:var(--clay)}

.wway-site .hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

.wway-site .form-msg{margin:16px 0 0;font-size:15px;display:none}
.wway-site .form-msg.is-on{display:block}
.wway-site .form-msg.ok{color:#2F6B3D}
.wway-site .form-msg.bad{color:#B3261E}
.wway-site .form-fine{margin:12px 0 0;font-size:13px;color:var(--mute)}
.wway-site .wway-form .btn[disabled]{opacity:.6;cursor:progress}
.wway-site .wway-form .btn{width:100%}

.wway-site .info{background:var(--sand);border-radius:var(--r-lg);padding:var(--s3)}
.wway-site .info h3{font-size:19px;margin-bottom:18px}
.wway-site .info ul{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.wway-site .info li{display:grid;gap:3px}
.wway-site .info b{font:700 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;
  color:var(--clay-deep)}
.wway-site .info a,.wway-site .info span{color:var(--ink);text-decoration:none;font-size:16px}
.wway-site .info a:hover{color:var(--clay-deep);text-decoration:underline}

/* =========================================================================
   CTA strip + footer
   ========================================================================= */

.wway-site .cta-strip{padding:0 0 var(--s5)}
.wway-site .cta-card{background:var(--clay);color:#fff;border-radius:var(--r-xl);
  padding:var(--s5);display:flex;align-items:center;justify-content:space-between;
  gap:var(--s4);flex-wrap:wrap}
.wway-site .cta-card h2{color:#fff;font-size:var(--t-xl);margin-bottom:10px}
.wway-site .cta-card p{color:rgba(255,255,255,.9);margin:0;max-width:52ch}
.wway-site .cta-a{display:flex;gap:12px;flex-wrap:wrap}

.wway-site .foot{background:var(--ink);color:rgba(255,255,255,.76);
  border-radius:var(--r-xl) var(--r-xl) 0 0;padding:var(--s5) 0 0}
.wway-site .foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.3fr;gap:var(--s4);
  padding-bottom:var(--s4)}
.wway-site .foot h3{color:#fff;font:700 11.5px/1 var(--sans);letter-spacing:.15em;
  text-transform:uppercase;margin-bottom:18px;font-family:var(--sans)}
.wway-site .foot ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.wway-site .foot a{color:rgba(255,255,255,.76);text-decoration:none;font-size:15px}
.wway-site .foot a:hover{color:#fff}
.wway-site .foot-c a,.wway-site .foot-c .plain{display:flex;align-items:flex-start;gap:10px;
  color:rgba(255,255,255,.76);font-size:15px}
.wway-site .foot-c .ico{margin-top:3px;opacity:.6}
.wway-site .foot-brand .brand-badge{background:#fff;width:58px;height:58px}
.wway-site .foot-brand p{margin:16px 0 2px;color:#fff;font-family:var(--display);
  font-size:18px;font-weight:600}
.wway-site .foot-brand i{font-style:italic;color:var(--sun);font-size:14px}
.wway-site .foot-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.wway-site .chip{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;
  background:rgba(255,255,255,.1);color:#fff;border-radius:var(--r-pill);padding:7px 14px}
.wway-site .chip .ico{width:14px;height:14px}
.wway-site .foot-base{border-top:1px solid rgba(255,255,255,.15);padding:20px 0;
  display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
  font-size:13px;color:rgba(255,255,255,.58)}
.wway-site .foot-base p{margin:0}
.wway-site .foot-base nav{display:flex;gap:22px}
.wway-site .foot-base a{font-size:13px}
.wway-site .foot-note{padding:0 0 24px;font-size:12.5px;color:rgba(255,255,255,.44);margin:0}

/* =========================================================================
   Motion
   ========================================================================= */

.wway-site .rv{opacity:1;transform:none}
.wway-motion .rv{opacity:0;transform:translateY(20px)}
.wway-motion .rv.is-in{opacity:1;transform:none;
  transition:opacity .8s var(--ease),transform .8s var(--ease)}
.wway-motion .jstep.rv.is-in:nth-child(even){transform:none}

.wway-site :focus-visible{outline:3px solid var(--clay);outline-offset:3px}
.wway-site .ann :focus-visible,.wway-site .foot :focus-visible,
.wway-site .band :focus-visible,.wway-site .cta-card :focus-visible{outline-color:#fff}

/* =========================================================================
   Responsive
   ========================================================================= */

@media(max-width:1180px){
  .wway-site .nav-a{padding:11px 13px}
  .wway-site .mega-cards{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:1024px){
  .wway-site .hero-in{grid-template-columns:1fr;gap:var(--s4)}
  .wway-site .hero-shot>img{aspect-ratio:16/11;
    border-radius:var(--r-xl) var(--r-xl) var(--r-xl) 80px}
  .wway-site .hero-tag{right:14px;bottom:-22px}
  .wway-site .bubbles{grid-template-columns:1fr 1fr;margin-top:var(--s5)}
  .wway-site .bento{grid-template-columns:1fr 1fr}
  .wway-site .bt-lead{grid-column:span 2;flex-direction:column}
  .wway-site .bt-media{width:100%;aspect-ratio:16/9}
  .wway-site .team{grid-template-columns:1fr}
  .wway-site .duo{grid-template-columns:1fr;gap:var(--s3)}
  .wway-site .duo.flip .duo-shot{order:0}
  .wway-site .band{grid-template-columns:1fr;padding:var(--s4)}
  .wway-site .reach{grid-template-columns:1fr;padding:var(--s4)}
  .wway-site .foot-grid{grid-template-columns:1fr 1fr}
}

/* ---------- mobile drawer ---------- */
@media(max-width:900px){
  .wway-site .burger{display:block}

  .wway-site .nav{position:fixed;inset:0 0 0 auto;width:min(400px,88vw);
    background:var(--cream);flex-direction:column;align-items:stretch;gap:0;
    padding:24px 22px calc(24px + env(safe-area-inset-bottom));
    transform:translateX(102%);
    transition:transform .38s var(--ease),visibility .38s;
    visibility:hidden;                 /* not focusable while closed */
    overflow-y:auto;overscroll-behavior:contain;z-index:95;
    border-radius:var(--r-xl) 0 0 var(--r-xl);
    box-shadow:-30px 0 60px -40px rgba(42,33,28,.6)}
  .wway-site .nav.is-open{transform:none;visibility:visible}

  .wway-site .nav-l{flex-direction:column;align-items:stretch;gap:4px;width:100%}
  .wway-site .nav-a{width:100%;justify-content:space-between;padding:15px 16px;
    font-size:17px;min-height:54px;border-radius:var(--r-sm)}
  .wway-site .nav-cta{margin:18px 0 0;width:100%}

  /* the mega menu becomes an accordion inside the drawer */
  .wway-site .mega{position:static;opacity:1;visibility:visible;transform:none;
    pointer-events:auto;display:none;transition:none}
  .wway-site .has-mega.is-open .mega{display:block}
  .wway-site .mega-shell{background:transparent;box-shadow:none;padding:4px 0 10px;
    border-radius:0}
  .wway-site .mega-cards{grid-template-columns:1fr;gap:6px}
  .wway-site .mcard{padding:13px 16px;display:flex;align-items:center;gap:13px;
    background:transparent;min-height:56px}
  .wway-site .mcard:hover{transform:none}
  .wway-site .mcard-ico{width:38px;height:38px;margin:0;border-radius:12px;background:var(--sand)}
  .wway-site .mcard-d{display:none}
  .wway-site .mega-bar{display:none}
}

@media(max-width:600px){
  .wway-site{--s5:44px;--s6:64px;--r-xl:26px;--r-lg:20px}
  .wway-site .wrap{width:min(1200px,100% - 30px)}
  .wway-site .hero h1{font-size:clamp(32px,9.5vw,46px)}
  .wway-site .hero-cta .btn{flex:1 1 100%}
  .wway-site .hero-shot>img{border-radius:var(--r-xl)}
  .wway-site .hero-tag{position:static;margin-top:14px;width:100%}
  .wway-site .bubbles{grid-template-columns:1fr 1fr;gap:10px}
  .wway-site .bento,.wway-site .bt-lead{grid-template-columns:1fr;grid-column:span 1}
  .wway-site .bento{grid-template-columns:1fr}
  .wway-site .collage{grid-template-columns:repeat(2,1fr)}
  .wway-site .c1,.wway-site .c2,.wway-site .c3,.wway-site .c4,.wway-site .c5{
    grid-column:span 2;aspect-ratio:4/3;border-radius:var(--r-xl)}
  .wway-site .duo-shot img{border-radius:var(--r-xl)}
  .wway-site .jstep:nth-child(even){margin-left:0;width:100%}
  .wway-site .pair{grid-template-columns:1fr}
  .wway-site .cta-a .btn,.wway-site .cta-card .btn{flex:1 1 100%}
  .wway-site .foot-grid{grid-template-columns:1fr;gap:var(--s3)}
  .wway-site .foot-base{flex-direction:column}
  /* tap targets */
  .wway-site .ann a{padding:9px 0;min-height:40px}
  .wway-site .ann-in{gap:6px 18px;padding-block:6px}
  .wway-site .foot ul a,.wway-site .foot-c a,.wway-site .foot-base a{
    display:inline-flex;align-items:center;min-height:44px}
  .wway-site .foot ul{gap:2px}
  /* iOS zooms any input under 16px on focus */
  .wway-site .field input,.wway-site .field textarea{font-size:16px}
}

@media(prefers-reduced-motion:reduce){
  .wway-motion .rv{opacity:1;transform:none}
  .wway-site *,.wway-site *::before,.wway-site *::after{
    transition-duration:.01ms!important;animation-duration:.01ms!important}
}

@media print{
  .wway-site .ann,.wway-site .head,.wway-site .burger,.wway-site .cta-strip{display:none}
  .wway-motion .rv{opacity:1;transform:none}
  .wway-site .sect{padding:20px 0}
}

/* =========================================================================
   Elementor compatibility
   -------------------------------------------------------------------------
   Exported pages use the SAME classes as the template-rendered pages, so
   there is only ever one design. But Elementor's DOM differs:

     • a container is a .e-con that Elementor sets to display:flex
     • a widget class lands on the .elementor-widget WRAPPER, not on the
       <a>, <h3> or <div> inside it

   Each rule below re-points one class at the element that now carries it.
   Nothing here is a second design — it is the same design surviving a
   different DOM.
   ========================================================================= */

.wway-site .e-con.wrap{width:min(1240px,100% - 48px);margin-inline:auto}
.wway-site .e-con.narrow{width:min(760px,100% - 48px);margin-inline:auto}
.wway-site .e-con.sect{padding:var(--s6) 0;width:100%}
.wway-site .e-con.phead{padding:var(--s6) 0 var(--s5);width:100%}
.wway-site .e-con.hero{padding:var(--s7) 0 var(--s6);width:100%}

.wway-site .e-con.hero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--s5);align-items:center}
.wway-site .e-con.head-block{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);align-items:end;margin-bottom:var(--s5)}
.wway-site .e-con.head-block.center{grid-template-columns:1fr;text-align:center;justify-items:center}
.wway-site .e-con.journey{display:grid;grid-template-columns:repeat(2,1fr);gap:0 var(--s5)}
.wway-site .e-con.collage{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}
.wway-site .e-con.reach{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5)}
.wway-site .e-con.duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);align-items:center}
.wway-site .e-con.duo.flip .duo-shot{order:2}
.wway-site .e-con.bubbles>.wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.wway-site .e-con.hero-cta{display:flex;flex-direction:row;flex-wrap:wrap;gap:12px}
.wway-site .e-con.bt{display:grid;grid-template-columns:64px 1.1fr 1.4fr;gap:var(--s3);
  align-items:center;padding:30px 0;border-bottom:1px solid var(--line);text-decoration:none}
.wway-site .e-con.job{display:flex;flex-direction:row;align-items:center;justify-content:space-between;
  gap:var(--s3);padding:26px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.wway-site .e-con.info>.e-con{padding:22px 0;border-bottom:1px solid var(--line)}
.wway-site .e-con.journey>.e-con{padding:30px 0;border-top:1px solid var(--line)}
.wway-site .e-con.bubbles>.wrap>.e-con{padding:26px 28px 26px 0;border-right:1px solid var(--line)}

/* buttons: the class is on the wrapper, the control is the <a> inside */
.wway-site .elementor-widget.btn{width:auto;flex:0 0 auto}
.wway-site .btn .elementor-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 26px;border-radius:999px;font:600 15px/1 var(--sans);min-height:50px;text-decoration:none;
  transition:background .25s var(--ease),color .25s,border-color .25s}
.wway-site .btn-solid .elementor-button{background:var(--clay);color:#fff}
.wway-site .btn-solid .elementor-button:hover{background:var(--clay-deep);color:#fff}
.wway-site .btn-out .elementor-button{border:1px solid var(--line);color:var(--ink);background:transparent}
.wway-site .btn-out .elementor-button:hover{border-color:var(--ink);background:var(--ink);color:#fff}

/* short text widgets: strip the heading's own styling, keep the class's */
.wway-site .pill .elementor-heading-title,
.wway-site .bt-where .elementor-heading-title,
.wway-site .n .elementor-heading-title,
.wway-site .info .elementor-heading-title,
.wway-site .bubbles .elementor-heading-title{font:inherit;color:inherit;margin:0}
.wway-site .elementor-widget.pill{width:auto}
.wway-site .elementor-widget-heading{margin:0}
.wway-site .elementor-widget-text-editor p:last-child{margin-bottom:0}

/* statement band + hero card */
.wway-site .e-con.band{background:var(--ink);padding:var(--s6) 0;width:100%}
.wway-site .band .elementor-widget-text-editor,
.wway-site .e-con.band blockquote{color:#fff}
.wway-site .e-con.hero-tag{background:var(--shell);border:1px solid var(--line);
  padding:22px 26px;max-width:280px;box-shadow:var(--lift)}

/* FAQ: the stock accordion, restyled to the ruled register */
.wway-site .faqs .elementor-accordion-item{border:0;border-bottom:1px solid var(--line)}
.wway-site .faqs .elementor-tab-title{padding:24px 0;font:500 19px/1.4 var(--display);color:var(--ink)}
.wway-site .faqs .elementor-tab-content{padding:0 0 24px;border:0;color:var(--mute)}

@media(max-width:1024px){
  .wway-site .e-con.hero-in,.wway-site .e-con.contact,.wway-site .e-con.duo,
  .wway-site .e-con.head-block,.wway-site .e-con.journey{grid-template-columns:1fr}
  .wway-site .e-con.bubbles>.wrap{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .wway-site .e-con.bt{grid-template-columns:38px 1fr}
  .wway-site .e-con.collage{grid-template-columns:repeat(6,1fr)}
  .wway-site .e-con.bubbles>.wrap{grid-template-columns:1fr}
}

/* bubble cells: label and value are separate widgets now */
.wway-site .e-con.bubbles>.wrap>.e-con{display:block;text-align:center}
.wway-site .bubbles .elementor-widget-heading .elementor-heading-title{
  font:700 25px/1 var(--display);color:var(--ink);margin:0 0 5px}
.wway-site .bubbles .elementor-widget-text-editor{font-size:13.5px;color:var(--mute);line-height:1.45}
.wway-site .e-con.head-block>.e-con{display:block}

/* family band */
.wway-site .e-con.band{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);
  align-items:center;background:var(--moss);border-radius:var(--r-xl);padding:var(--s5)}
.wway-site .band .elementor-heading-title,.wway-site .band .elementor-widget-text-editor{color:#fff}
.wway-site .band .pill .elementor-heading-title{color:#fff}
@media(max-width:1024px){.wway-site .e-con.band{grid-template-columns:1fr;padding:var(--s4)}}

/* =========================================================================
   Multi-step form
   Only the stepper chrome is new; fields keep the existing field styling.
   ========================================================================= */

.wway-site .wway-steps .stepper{list-style:none;display:flex;gap:0;margin:0 0 26px;padding:0;
  counter-reset:none}
.wway-site .wway-steps .stepper li{flex:1;display:flex;flex-direction:column;align-items:center;
  gap:8px;position:relative;font:600 12.5px/1.3 var(--sans);color:var(--mute);text-align:center}
/* the connecting rule sits behind the dots */
.wway-site .wway-steps .stepper li::before{content:"";position:absolute;top:17px;left:-50%;
  width:100%;height:2px;background:var(--line);z-index:0}
.wway-site .wway-steps .stepper li:first-child::before{display:none}
.wway-site .wway-steps .stepper li.is-on::before,
.wway-site .wway-steps .stepper li.is-done::before{background:var(--clay)}
.wway-site .stepper-dot{position:relative;z-index:1;width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;background:var(--shell);border:2px solid var(--line);
  font:700 14px/1 var(--display);color:var(--mute);
  transition:background .3s ease,border-color .3s ease,color .3s ease,transform .3s ease}
.wway-site .stepper li.is-on .stepper-dot{background:var(--clay);border-color:var(--clay);color:#fff;
  transform:scale(1.06)}
.wway-site .stepper li.is-done .stepper-dot{background:var(--clay-wash);border-color:var(--clay);
  color:var(--clay)}
.wway-site .stepper li.is-on{color:var(--ink)}
.wway-site .stepper-label{max-width:11ch}

.wway-site .wway-steps .step{border:0;padding:0;margin:0}
.wway-site .wway-steps .step legend{font:600 20px/1.2 var(--display);color:var(--ink);
  padding:0;margin:0 0 16px}
/* without JS every step is visible, so they need separating */
.wway-site .wway-steps:not(.is-stepped) .step+.step{margin-top:30px;padding-top:26px;
  border-top:1px solid var(--line)}
.wway-site .wway-steps:not(.is-stepped) .stepper,
.wway-site .wway-steps:not(.is-stepped) .step-count{display:none}

.wway-site .step-count{font:600 12px/1 var(--sans);color:var(--mute);margin:0 0 14px;
  letter-spacing:.04em;text-transform:uppercase}
.wway-site .step-nav{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:22px}
.wway-site .step-nav .btn[hidden]{display:none}
.wway-site .opt{font-weight:400;color:var(--mute);font-size:.85em}
.wway-site .wway-steps select{width:100%;padding:14px 16px;border:1px solid var(--line);
  border-radius:var(--r-sm);background:var(--shell);font:400 16px/1.4 var(--sans);color:var(--ink);
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23645B4F' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center}
.wway-site .wway-steps select:focus-visible{outline:2px solid var(--clay);outline-offset:2px}
.wway-site .wway-steps .is-bad{border-color:#B3261E}

/* the step swap is a short fade — never a slide, which would fight the
   stepper's own left-to-right reading order */
.wway-mo .wway-steps .step:not([hidden]){animation:wway-step-in .3s ease both}
@keyframes wway-step-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .wway-mo .wway-steps .step:not([hidden]){animation:none}
}

@media(max-width:600px){
  .wway-site .stepper-label{display:none}
  .wway-site .wway-steps .stepper li::before{top:16px}
  .wway-site .step-nav .btn{flex:1;justify-content:center}
}

/* Mobile tap targets — see the note in pba.css; same reasoning here. */
@media(max-width:900px){
  .wway-site .info a,.wway-site .info span,
  .wway-site .foot a,.wway-site .topbar a{
    display:inline-flex;align-items:center;min-height:44px}
  .wway-site .foot li{margin-bottom:2px}
  .wway-site .consent{display:flex;align-items:flex-start;gap:12px;min-height:44px;padding:6px 0}
  .wway-site .consent input[type=checkbox]{width:24px;height:24px;flex:0 0 24px;margin-top:1px}
  .wway-site .step-nav .btn{min-height:48px}
}

/* =========================================================================
   Home refresh — warmer, more visual, per the client mockup.
   Brand maroon stays as the anchor (point 10: keep the Watson's identity);
   sunshine gold from the logo crescent becomes the call-to-action colour.
   ========================================================================= */

/* --- 1. header: larger logo, two-line lockup --- */
.wway-site .brand img{width:52px;height:52px}
.wway-site .brand-lock{display:flex;flex-direction:column;line-height:1.15}
.wway-site .brand-lock b{font:700 19px/1.15 var(--display);color:var(--ink)}
.wway-site .brand-lock i{font-style:normal;font:600 11.5px/1.2 var(--sans);color:var(--mute);
  letter-spacing:.06em;text-transform:uppercase}

/* --- 3. the Book a Visit button: sunshine, rounder, alive --- */
.wway-site .btn-sun{background:var(--sun-cta);color:var(--ink);border:0;border-radius:999px;
  font-weight:700;box-shadow:0 6px 18px rgba(240,180,23,.34)}
.wway-site .btn-sun:hover{background:var(--sun-cta-deep);color:var(--ink);
  box-shadow:0 10px 26px rgba(240,180,23,.44)}
.wway-mo .btn-sun{transition:transform .3s var(--m-ease),background .3s ease,box-shadow .3s ease}
.wway-mo .btn-sun:hover{transform:translateY(-2px)}

/* --- 4. hero: the highlighted word --- */
.wway-site .hl{position:relative;display:inline-block;color:var(--ink);z-index:0}
.wway-site .hl::after{content:"";position:absolute;left:-.08em;right:-.08em;bottom:.06em;
  height:.42em;background:var(--sun-cta);border-radius:.3em;z-index:-1;opacity:.85;
  transform:scaleX(0);transform-origin:left;transition:transform .7s var(--m-ease-out) .25s}
.wway-site .hl.is-lit::after,
.wway-site:not(.wway-mo) .hl::after{transform:scaleX(1)}

/* --- 5/6. stat cards: icon, value, caption --- */
.wway-site .bubbles{display:block;grid-template-columns:none}
.wway-site .bubbles .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.wway-site .bubble{background:var(--shell);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:22px 18px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.wway-site .bubble .bico{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  margin-bottom:4px}
.wway-site .bubble .bico svg{width:22px;height:22px}
.wway-site .bubble:nth-child(1) .bico{background:var(--sky-wash);color:var(--sky-blue)}
.wway-site .bubble:nth-child(2) .bico{background:var(--blush);color:var(--clay)}
.wway-site .bubble:nth-child(3) .bico{background:var(--sun-wash);color:var(--moss)}
.wway-site .bubble:nth-child(4) .bico{background:var(--leaf-wash);color:var(--leaf)}
.wway-site .bubble b{font:700 19px/1.2 var(--display);color:var(--ink)}
.wway-site .bubble i{font-style:normal;font:400 13px/1.5 var(--sans);color:var(--mute)}
.wway-site .bubble .blist{font:600 12.5px/1.6 var(--sans);color:var(--body)}

/* --- 7. service cards: photo, short copy, working button --- */
.wway-site .bento{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.wway-site .bt{background:var(--shell);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;display:flex;flex-direction:column;text-decoration:none}
.wway-site .bt-shot{aspect-ratio:16/10;overflow:hidden;background:var(--sand)}
.wway-site .bt-shot img{width:100%;height:100%;object-fit:cover;display:block}
.wway-site .bt-body{padding:20px 20px 22px;display:flex;flex-direction:column;gap:9px;flex:1}
.wway-site .bt-body h3{font:700 18px/1.25 var(--display);color:var(--ink);margin:0}
.wway-site .bt-body p{font:400 14.5px/1.6 var(--sans);color:var(--body);margin:0;flex:1}
.wway-site .bt .btn{align-self:flex-start;margin-top:4px;padding:11px 20px;font-size:14px;min-height:42px}
.wway-mo .bt{transition:transform .3s var(--m-ease),box-shadow .3s var(--m-ease)}
.wway-mo .bt:hover{transform:translateY(-4px);box-shadow:var(--lift)}
/* each card's button takes one of the brand's accents, in a fixed cycle */
.wway-site .bt:nth-child(6n+1) .btn{background:var(--sky-blue);color:#fff}
.wway-site .bt:nth-child(6n+2) .btn{background:var(--sun-cta);color:var(--ink)}
.wway-site .bt:nth-child(6n+3) .btn{background:var(--leaf);color:#fff}
.wway-site .bt:nth-child(6n+4) .btn{background:var(--clay);color:#fff}
.wway-site .bt:nth-child(6n+5) .btn{background:var(--sky-blue);color:#fff}
.wway-site .bt:nth-child(6n+6) .btn{background:var(--sun-cta);color:var(--ink)}

@media(max-width:1024px){
  .wway-site .bubbles .wrap{grid-template-columns:1fr 1fr}
  .wway-site .bento{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .wway-site .bubbles .wrap{grid-template-columns:1fr 1fr;gap:12px}
  .wway-site .bento{grid-template-columns:1fr}
  .wway-site .brand img{width:44px;height:44px}
  .wway-site .brand-lock b{font-size:17px}
}

/* card titles link without looking like links until hovered */
.wway-site .bt-body h3 a{color:inherit;text-decoration:none}
.wway-site .bt-body h3 a:hover{color:var(--clay)}
.wway-site .bt-shot{display:block}

/* calm / reduced motion: the highlight is emphasis, not decoration, so it is
   drawn immediately rather than skipped */
.wway-calm-on .hl::after{transform:scaleX(1)!important;transition:none!important}
@media(prefers-reduced-motion:reduce){
  .wway-site .hl::after{transform:scaleX(1)!important;transition:none!important}
}

/* The refreshed stat row wraps its cards in .wrap, so the responsive rules
   must move to the wrap too — otherwise the outer element keeps the old
   4-column grid and the whole row collapses into one cell. */
@media(max-width:1024px){
  .wway-site .bubbles{grid-template-columns:none}
  .wway-site .bubbles .wrap{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .wway-site .bubbles .wrap{grid-template-columns:1fr 1fr;gap:12px}
  .wway-site .bubble{padding:18px 12px}
  .wway-site .bubble b{font-size:16px}
  .wway-site .bubble i,.wway-site .bubble .blist{font-size:12px}
}

/* The mockup leads with a dark headline and lets the highlight do the work.
   Maroon at display size shouts; ink reads warmer and leaves the brand colour
   to the buttons and accents. */
.wway-site .hero h1{color:var(--ink)}

/* The old hero span was an italic maroon flourish. The refreshed hero uses a
   highlighter sweep instead, so the word stays upright and in ink and the
   colour comes from the mark behind it. Selector matches the original's
   specificity rather than reaching for !important. */
.wway-site .hero h1 span.hl{color:var(--ink);font-style:normal}

/* The header CTA is styled by .nav .nav-cta, which outranks .btn-sun, so the
   sunshine variant has to be stated at the same depth to win. */
.wway-site .nav .nav-cta.btn-sun,
.wway-site .nav .nav-cta.btn-sun:hover{background:var(--sun-cta);color:var(--ink)}
.wway-site .nav .nav-cta.btn-sun:hover{background:var(--sun-cta-deep)}

/* Topbar and footer links measured 23px tall — one pixel under the WCAG 2.5.8
   AA minimum of 24x24. Inline links inside prose are exempt, so this targets
   the list-style links only. */
/* The bar is .ann, not .topbar — checking the markup rather than guessing the
   class is the difference between this working and silently doing nothing. */
.wway-site .ann a,
.wway-site .ann-in a,
.wway-site .foot a,
.wway-site .info a,
.wway-site .bt-body h3 a{min-height:24px;display:inline-flex;align-items:center}

/* --- the client's own icon artwork in the stat cards --- */
.wway-site .bubble .bico{background:none!important;width:52px;height:52px;padding:0}
.wway-site .bubble .bico img{width:52px;height:52px;object-fit:contain;display:block}

/* --- hero note ---
   The supplied photo has "Every child Progreses" drawn onto it, misspelled.
   This panel sits over that corner with the correct spelling as live text, so
   the page never shows the typo. It is opaque and generously sized so the
   drawn version cannot peek out at any width. */
.wway-site .hero-shot{position:relative}
.wway-site .hero-note{position:absolute;right:4%;bottom:5%;width:min(30%,168px);
  aspect-ratio:1/.92;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;text-align:center;background:#FAECC0;color:var(--clay);
  font:700 clamp(15px,1.5vw,21px)/1.25 var(--display);
  border-radius:56% 44% 52% 48%/48% 52% 46% 54%;
  box-shadow:0 10px 30px rgba(0,0,0,.10);padding:10px}
.wway-site .hero-note-h{display:block;line-height:0;margin-top:4px}
.wway-site .hero-note-h svg{width:20px;height:20px;color:var(--sun-cta-deep)}

@media(max-width:640px){
  .wway-site .hero-note{width:min(38%,150px);font-size:13px;right:4%;bottom:4%}
}

/* The motion layer wraps each h1 in <span class="mo-line"><span>…</span></span>
   for the line reveal. Those wrappers were picking up
   `.hero h1 span{color:var(--clay)}` — a rule written for the old decorative
   flourish — which turned the whole headline maroon. The wrappers carry no
   colour of their own. */
.wway-site .hero h1 .mo-line,
.wway-site .hero h1 .mo-line > span{color:inherit;font-style:inherit}

/* The client's stat icons are supplied as artwork, so the medallion is the
   image itself rather than a tinted circle behind an SVG. */
.wway-site .bubble .bico{background:none!important;width:auto;height:auto}
.wway-site .bubble .bico img{width:46px;height:46px;display:block}



/* Where-sessions grid: text-only cards, so no photo frame */
.wway-site .where-grid .bt-body{padding:22px}
.wway-site .where-grid .bt-body h3{font:700 17px/1.25 var(--display);color:var(--ink);margin:0 0 6px}
.wway-site .note-line{margin-top:22px;padding:16px 20px;border-radius:var(--r-md);
  background:var(--sun-wash);color:var(--ink);font:400 15px/1.6 var(--sans)}
.wway-site .duo h3{font:700 21px/1.25 var(--display);color:var(--ink);margin:0 0 10px}
.wway-site .duo p{font:400 16px/1.7 var(--sans);color:var(--body);margin:0 0 12px}
