/* Self-hosted Fraunces (variable) and Poppins, latin subset */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(../fonts/fraunces-300-700.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/poppins-400.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/poppins-500.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(../fonts/poppins-600.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/poppins-700.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============ Tokens (Marsello look and feel, EUX colours) ============ */
:root{
  --ink:#0f0f0f;
  --text:#2f2f2f;
  --muted:#8a8794;
  --accent:#7038e2;
  --grad-a:#7038e2;
  --grad-b:#a066ee;
  --navy:#150f2b;
  --navy-2:#110c24;
  --border:#e2dfe8;
  --grey:#f4f2f7;
  --soft:#faf8f5;
  --header-h:70px;
  --serif:"Fraunces", Georgia, serif;
  --sans:"Poppins", system-ui, sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;font-family:var(--sans);font-size:16px;line-height:1.7;color:var(--ink);
  background:#fff;overflow-x:hidden;transition:opacity .5s ease-out;
}
.is-ready{--e26-ready:1}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none;cursor:pointer}
h1,h2,h3,h4,p{margin:0}
button{font-family:inherit}
.serif{font-family:var(--serif);font-variation-settings:"SOFT" 100;font-weight:400;letter-spacing:-.01em}
.wrap{margin:0 auto;padding:0 4rem}
@media (max-width:1024px){.wrap{padding:0 2rem}}
@media (max-width:767px){.wrap{padding:0 1rem}}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* ============ Buttons ============ */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  height:50px;padding:0 26px;border-radius:50px;font:500 16px/1.5 var(--sans);
  white-space:nowrap;user-select:none;transition:all .4s ease;cursor:pointer;border:0;
}
.btn span{position:relative;display:inline-flex;align-items:center;transition:transform .2s ease}
.btn svg{position:absolute;right:-25px;top:50%;width:15px;height:15px;transform:translateY(-50%);opacity:0;visibility:hidden;transition:all .2s ease}
.btn:hover span{transform:translateX(-10px)}
.btn:hover svg{opacity:1;visibility:visible}
.btn--primary{background:linear-gradient(to right,var(--grad-a),var(--grad-b));color:#fff}
.btn--secondary{border:2px solid #000;color:#000;background:transparent}
.btn--secondary.light-border{border-color:var(--border)}
.btn--white{background:#fff;color:var(--ink)}
.btn--block{width:100%}

/* ============ Header ============ */
.header{position:fixed;top:0;left:0;right:0;z-index:99;height:var(--header-h);background:#fff;border-bottom:2px solid #f3f1f6}
.header__inner{display:flex;align-items:center;height:100%}
.logo{display:flex;align-items:center;flex-shrink:0}
.logo img{width:136px;height:auto}
.header__menu{display:flex;align-items:center;justify-content:space-between;width:100%;height:100%}
.nav{display:flex;height:100%;align-items:center;list-style:none;margin:0 0 0 2rem;padding:0}
.nav > li{height:100%}
.nav > li > a{
  display:flex;align-items:center;gap:.5rem;height:100%;padding:0 1rem;font-weight:500;font-size:16px;color:#000;
  border-top:2px solid transparent;border-bottom:3px solid transparent;transition:color .1s linear,border-color .1s linear;
}
.nav > li > a .chev{width:12px;height:12px;transition:transform .15s linear}
.nav > li:hover > a{color:var(--accent);border-bottom-color:var(--accent)}
.nav > li:hover > a .chev{transform:rotate(180deg)}
.mega{
  position:absolute;top:var(--header-h);left:50%;width:min(var(--w),calc(100vw - 48px));z-index:2;
  background:#fff;border:1px solid #eeeaf4;border-top:0;border-radius:0 0 22px 22px;
  box-shadow:0 30px 70px rgba(21,15,43,.16),0 4px 14px rgba(21,15,43,.05);
  opacity:0;visibility:hidden;transform:translate(-50%,10px);pointer-events:none;overflow:hidden;
  transition:opacity .22s ease,transform .32s cubic-bezier(.16,1,.3,1),visibility 0s linear .22s;
}
.nav > li:hover > .mega,.nav > li:focus-within > .mega{opacity:1;visibility:visible;transform:translate(-50%,0);pointer-events:auto;transition-delay:0s}
.mega ul{list-style:none;margin:0;padding:0}
.mega__inner{display:grid;grid-template-columns:1fr;gap:22px;padding:26px 26px 18px}
.mega__inner.has-side{grid-template-columns:minmax(0,1fr) 260px}
.mega__cols{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));grid-template-rows:auto repeat(var(--rows,4),auto);gap:4px 14px}
.mega__col{display:grid;grid-row:1 / span var(--span,5);grid-template-rows:subgrid}
.mega__col > ul{display:contents}
.mega__col > ul > li{display:flex}
.mega__col > ul > li > .mi{flex:1}
.mi__ic.is-thumb{background:#fff;border:1px solid #ece8f3;overflow:hidden;padding:0}
.mi__ic.is-thumb img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;transform:scale(1.5)}
.mega__col{opacity:0;transform:translateY(6px);transition:opacity .3s ease,transform .4s cubic-bezier(.16,1,.3,1)}
.nav > li:hover .mega__col,.nav > li:focus-within .mega__col{opacity:1;transform:none}
.nav > li:hover .mega__col:nth-child(2){transition-delay:.05s}
.nav > li:hover .mega__col:nth-child(3){transition-delay:.1s}
.mega__t{font-size:12.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--ink);padding:0 10px 10px;margin-bottom:6px;border-bottom:1px solid #f0edf5}
.mi{display:flex;align-items:flex-start;gap:12px;padding:10px;border-radius:14px;transition:background .18s ease}
.mi:hover{background:#f6f3fd}
.mi__ic{flex-shrink:0;width:40px;height:40px;border-radius:12px;background:#f1ecfc;color:var(--accent);display:flex;align-items:center;justify-content:center;transition:background .2s ease,color .2s ease,transform .25s cubic-bezier(.16,1,.3,1)}
.mi__ic svg{width:20px;height:20px}
.mi__ic.is-logo{background:#fff;border:1px solid #ece8f3}
.mi__ic.is-logo img{max-width:26px;max-height:22px;object-fit:contain}
.mi:hover .mi__ic{transform:scale(1.06)}
.mi:hover .mi__ic:not(.is-logo){background:var(--accent);color:#fff}
.mi__tx b{display:block;font-size:15px;font-weight:500;line-height:1.35;color:var(--ink);transition:color .18s ease}
.mi__tx small{display:block;font-size:13px;line-height:1.45;color:var(--muted);margin-top:2px}
.mi:hover .mi__tx b{color:var(--accent)}
.mf{display:flex;flex-direction:column;gap:6px;background:#efeef3;border-radius:18px;padding:12px 12px 16px;align-self:start}
.mf__img{display:block;aspect-ratio:4/3;border-radius:12px;overflow:hidden}
.mf__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.mf:hover .mf__img img{transform:scale(1.05)}
.mf__lbl{font-size:11.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);margin-top:6px}
.mf b{font-size:15px;font-weight:600;line-height:1.35;color:var(--ink)}
.mf__more{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:500;color:var(--ink)}
.mf__more svg{width:13px;height:13px;transition:transform .2s ease}
.mf:hover .mf__more svg{transform:translateX(3px)}
.mt{display:flex;flex-direction:column;gap:10px;border-radius:18px;padding:22px;color:#fff;background:radial-gradient(circle at 100% 0%,rgba(160,102,238,.55) 0,rgba(21,15,43,0) 55%),var(--navy)}
.mt .mf__lbl{color:#cbb6f7;margin:0}
.mt b{font-size:17px;font-weight:600;line-height:1.3}
.mt__phone{font-size:24px;font-weight:600;letter-spacing:.01em}
.mt .btn{height:44px;font-size:14px;margin-top:auto;padding:0 18px}
/* Our work: View all work first, then the six chosen case studies (cards rendered by e26_latest_work() in the theme) */
.wk-mega{grid-template-columns:270px minmax(0,1fr);gap:26px;padding-bottom:24px}
.wk__tile{display:flex;flex-direction:column;gap:12px;border-radius:18px;padding:24px 22px;color:#fff;background:radial-gradient(circle at 100% 0%,rgba(160,102,238,.55) 0,rgba(21,15,43,0) 55%),var(--navy);transition:transform .25s cubic-bezier(.16,1,.3,1)}.wk__tile:hover{transform:translateY(-2px)}
.wk__tile .mf__lbl{color:#cbb6f7;margin:0}.wk__tile b{font-size:19px;font-weight:600;line-height:1.3}
.wk__btn{margin-top:auto;display:inline-flex;align-items:center;gap:8px;align-self:flex-start;background:#fff;color:var(--ink);border-radius:999px;padding:10px 18px;font-size:14px;font-weight:600}.wk__btn svg{width:13px;height:13px;transition:transform .2s ease}.wk__tile:hover .wk__btn svg{transform:translateX(3px)}
.wk__main .mega__t{margin-bottom:10px}
.wk__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 14px}
.wk{display:flex;flex-direction:column;gap:7px;padding:7px 7px 10px;border-radius:16px;transition:background .18s ease}.wk:hover{background:#f6f3fd}
.wk__img{display:block;position:relative;aspect-ratio:16/10;border-radius:14px;overflow:hidden;background:#1a1626}.wk__img:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.62) 100%)}.wk__img img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;transition:transform .6s cubic-bezier(.16,1,.3,1)}.wk:hover .wk__img img:not(.wk__logo){transform:scale(1.05)}.wk__img .wk__logo{position:absolute;left:14px;bottom:12px;z-index:1;width:auto;height:auto;max-width:60%;max-height:30px;object-fit:contain}
.wk__meta{display:flex;flex-direction:column;gap:1px;padding:0 2px}.wk__meta small{font-size:12.5px;color:var(--muted)}
.wk b{font-size:14.5px;font-weight:600;line-height:1.3;color:var(--ink);transition:color .18s ease}.wk:hover b{color:var(--accent)}.wk .mf__more{padding:0 2px;color:var(--muted);font-size:12.5px}.wk:hover .mf__more svg{transform:translateX(3px)}
.wk{opacity:0;transform:translateY(6px);transition:opacity .3s ease,transform .4s cubic-bezier(.16,1,.3,1),background .18s ease}.nav > li:hover .wk,.nav > li:focus-within .wk{opacity:1;transform:none}.nav > li:hover .wk:nth-child(2){transition-delay:.03s}.nav > li:hover .wk:nth-child(3){transition-delay:.06s}.nav > li:hover .wk:nth-child(4){transition-delay:.09s}.nav > li:hover .wk:nth-child(5){transition-delay:.12s}.nav > li:hover .wk:nth-child(6){transition-delay:.15s}
.mb{display:flex;align-items:center;gap:16px;margin:0 26px 4px;padding:16px 18px;border-radius:16px;color:#fff;background:linear-gradient(110deg,#150f2b 0%,#2a1858 55%,#5b2fc4 100%);position:relative;overflow:hidden}
.mb::after{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(160,102,238,.45),rgba(160,102,238,0) 70%);pointer-events:none}
.mb__ic{flex-shrink:0;width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center}
.mb__ic svg{width:22px;height:22px}
.mb__tx b{display:block;font-size:16px;font-weight:600}
.mb__tx small{display:block;font-size:13.5px;color:rgba(255,255,255,.75);margin-top:2px}
.mb__cta{margin-left:auto;flex-shrink:0;display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--ink);border-radius:999px;padding:9px 16px;font-size:14px;font-weight:500;position:relative;z-index:1;transition:transform .2s ease}
.mb__cta svg{width:14px;height:14px}
.mb:hover .mb__cta{transform:translateX(-3px)}
.mega__strip{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 26px 12px 36px;margin-top:10px;background:#faf9fc;border-top:1px solid #f0edf5;font-size:14px}
.mega__strip a{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:var(--accent)}
.mega__strip a svg{width:11px;height:11px}
.mega__strip .pp{display:inline-flex;align-items:center;gap:8px;font-weight:500;color:var(--text)}
.mega__strip .pp img{width:26px;height:auto}
.mega__strip .pps{display:flex;align-items:center;gap:22px}
.mega__strip .pp img[src*="wordpress"]{width:20px}
.header__ctas{display:flex;gap:.5rem;align-items:center}
.header__ctas .btn{height:44px;font-size:15px}
.phone{font-weight:600;font-size:15px;padding:0 .75rem;white-space:nowrap}
.phone small{display:block;font-weight:400;font-size:11px;color:var(--muted);line-height:1}
.submenu-overlay{position:fixed;top:var(--header-h);left:0;right:0;height:100vh;background:#121212;opacity:0;pointer-events:none;transition:opacity .15s}
.submenu-overlay.show{opacity:.1}
.header__mobile{display:none;align-items:center;gap:1rem;margin-left:auto}
/* Desktop: logo left, menu in the true centre, phone and button right */
@media (min-width:1025px){
  .header__inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;column-gap:1.5rem}
  .header__menu{display:contents}
  .logo{grid-column:1;justify-self:start;align-self:center}
  .nav{grid-column:2;margin:0}
  .header__ctas{grid-column:3;justify-self:end;align-self:center}
}
.hamburger{width:23px;height:23px;position:relative;cursor:pointer;background:none;border:0;padding:0}
.hamburger span{position:absolute;left:0;height:2px;width:100%;background:#2f2f2f;transition:.25s ease-in-out}
.hamburger span:nth-child(1){top:0}
.hamburger span:nth-child(2),.hamburger span:nth-child(3){top:8px}
.hamburger span:nth-child(4){top:16px}
.hamburger.open span:nth-child(1),.hamburger.open span:nth-child(4){top:8px;width:0;left:50%}
.hamburger.open span:nth-child(2){transform:rotate(45deg)}
.hamburger.open span:nth-child(3){transform:rotate(-45deg)}
@media (max-width:1180px){.phone{display:none}}
@media (max-width:1024px){
  .logo img{width:108px}
  .header__mobile{display:flex}
  .header__mobile .btn{height:40px;font-size:14px;padding:0 18px}
  .header__menu{
    position:fixed;top:var(--header-h);left:-100vw;right:auto;width:100vw;height:calc(100dvh - var(--header-h));
    flex-direction:column;align-items:stretch;justify-content:flex-start;background:#fff;opacity:0;
    transition:all .2s linear;overflow-y:auto;border-top:1px solid var(--grey);
  }
  .header__menu.open{left:0;opacity:1}
  .nav{flex-direction:column;margin:0;height:auto;align-items:stretch}
  .nav > li{height:auto}
  .nav > li > a{height:auto;justify-content:space-between;padding:1.5rem 1rem;border-top:0;border-bottom:1px solid var(--grey)}
  .nav > li:hover > a{color:#000;border-bottom-color:var(--grey)}
  .nav > li:hover > a .chev{transform:none}
  .nav > li.open > a .chev{transform:rotate(180deg)}
  .mega{position:static;width:auto;transform:none;opacity:0;visibility:visible;pointer-events:auto;display:block;max-height:0;overflow:hidden;background:#faf9fb;border:0;border-radius:0;box-shadow:none;transition:max-height .55s cubic-bezier(.16,1,.3,1),opacity .35s ease}
  .mega__col{transition:opacity .45s ease,transform .55s cubic-bezier(.16,1,.3,1)!important}
  .nav > li:not(.open) > .mega .mega__col{opacity:0!important;transform:translateY(-8px)!important}
  .nav > li.open > .mega .mega__col:nth-child(2){transition-delay:.06s!important}
  .nav > li.open > .mega .mega__col:nth-child(3){transition-delay:.12s!important}
  .nav > li > a .chev{transition:transform .35s cubic-bezier(.16,1,.3,1)}
  .nav > li:hover > .mega,.nav > li:focus-within > .mega{transform:none}
  .nav > li.open > .mega{opacity:1}
  .mega__inner,.mega__inner.has-side{grid-template-columns:1fr;padding:6px 12px 4px}
  .mega__cols{grid-template-columns:1fr;grid-template-rows:none;gap:10px}
  .mega__col{display:block;grid-row:auto}
  .mega__col > ul{display:block}
  .mega__col{opacity:1;transform:none}
  .mf,.mt,.mega__strip .pp,.mega__strip .pps{display:none}
  .wk-mega{grid-template-columns:1fr;gap:10px;padding-bottom:10px}.wk__tile{flex-direction:row;align-items:center;justify-content:space-between;padding:14px 16px;border-radius:14px}.wk__tile .mf__lbl,.wk__tile b{display:none}.wk__btn{margin:0;background:none;color:#fff;padding:0;font-size:15px}.wk__btn:before{content:"";}
  .wk__grid{grid-template-columns:1fr 1fr;gap:8px}.wk{opacity:1!important;transform:none!important;padding:6px 6px 8px}.wk b{font-size:14px}.wk .mf__more{display:none}
  .mi{align-items:center;padding:9px 10px;gap:12px}
  .mi__ic{width:36px;height:36px;border-radius:10px}
  .mi__ic svg{width:18px;height:18px}
  .mi__tx b{font-size:15.5px}
  .mega__t{font-size:12px;padding:16px 10px 8px;margin-bottom:2px}
  .mega__col:first-child .mega__t{padding-top:8px}
  .nav > li.open > a{color:var(--accent)}
  .nav > li.open > .mega{border-bottom:1px solid var(--grey)}
  .mi__tx small{display:none}
  .mb{margin:0 8px 12px}
  .mb__cta{display:none}
  .mega__strip{background:none;border:0;margin:0;padding:4px 18px 14px}
  .header__ctas{flex-direction:column;align-items:stretch;padding:1rem}
  .phone{display:block;text-align:center;padding:.5rem}
  .submenu-overlay{display:none}
}

/* ============ Hero ============ */
.hero{position:relative;height:calc(100vh - 110px);min-height:600px;overflow:hidden;margin-top:var(--header-h)}
.hero picture img{width:100%;height:100%;object-fit:cover;object-position:right 58%;position:absolute;inset:0} /* right-anchored so the phone mock-up in Ben's concept 2 sits clear of the buttons */
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.92) 38%,rgba(255,255,255,.2) 66%,rgba(255,255,255,0) 100%)}
.hero__content{
  position:relative;z-index:1;margin:0 auto;max-width:1040px;padding-top:3.25rem;
  display:flex;flex-direction:column;align-items:center;gap:.9rem;text-align:center;
}
.hero h1{font-size:54px;font-weight:500;line-height:1.18;max-width:920px;text-wrap:balance}
.hero p{font-size:18px;line-height:1.7;max-width:760px;color:var(--text)}
.hero .btn-row{display:flex;gap:1rem;margin-top:.5rem}
.trust{display:flex;gap:1.25rem;flex-wrap:wrap;justify-content:center;font-size:14px;color:var(--text);margin-top:.25rem}
.trust b{color:var(--accent)}
.greview{display:inline-flex;align-items:center;gap:8px;background:#fff;border-radius:999px;padding:8px 16px 8px 14px;box-shadow:0 6px 20px rgba(21,15,43,.10),0 0 0 1px rgba(21,15,43,.05);color:var(--ink);font-weight:500}
.trust{align-items:center;justify-content:center;width:100%}
.hero .trust{margin:0 0 .2rem} /* the rating sits above the title */
.greview .stars{display:inline-flex;gap:1px}
.greview .stars svg{width:15px;height:15px}
.greview svg.g{width:17px;height:17px}
/* Phones and tablets: the photo sits under the text as its own wide band, so the whole counter scene shows */
@media (max-width:1023px){
  .hero{height:auto;min-height:0;display:flex;flex-direction:column}
  .hero::after{display:none}
  .hero__content{order:1}
  .hero picture{order:2;position:relative;display:block;height:clamp(300px,50vw,460px);margin-top:1rem}
  .hero picture::before{content:"";position:absolute;inset:0 0 auto;height:35%;z-index:1;background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,0) 100%)}
  .hero picture img{object-position:38% 50%}
}
@media (max-width:767px){
  .hero__content{padding-top:2rem}
  .hero h1{font-size:33px;line-height:1.2}
  .hero p{font-size:16px}
  .hero .btn-row{flex-direction:column;align-items:center;width:100%}
}

/* ============ Hero image v11 (Adrian 2026-10-15): his terminal, store and parcel image, full width, top faded into white ============ */
.hero{height:auto;min-height:0;overflow:hidden}
.hero::after{display:none}
.hero__content{padding-top:1.5rem;position:relative;z-index:2}
.hs{position:relative;z-index:1;width:100%;max-width:2000px;margin:calc(-.02 * min(100vw, 2000px)) auto 0;aspect-ratio:1671/473}
.hs__img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;-webkit-mask:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.06) 8%,rgba(0,0,0,.22) 18%,rgba(0,0,0,.5) 29%,rgba(0,0,0,.8) 40%,#000 52%,#000 93%,transparent 100%);mask:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.06) 8%,rgba(0,0,0,.22) 18%,rgba(0,0,0,.5) 29%,rgba(0,0,0,.8) 40%,#000 52%,#000 93%,transparent 100%)}
@media (max-width:1023px){
  .hero{display:flex;flex-direction:column}
  .hs{order:2;aspect-ratio:2.7/1;margin-top:.5rem}
  .hs__img{object-position:51% 100%}
}
@media (max-width:767px){
  .hero__content{padding-top:1.25rem}
  .hs{aspect-ratio:2.6/1;margin-top:.25rem}
  .hs__img{object-position:51% 100%}
}

/* ============ Proof strip ============ */
.proof{padding:34px 0 30px;border-bottom:1px solid var(--grey);overflow:hidden}
.proof__top{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:22px;text-align:center}
.pro-badge{display:inline-flex;align-items:center;gap:.6rem;border:1px solid var(--border);border-radius:999px;padding:.45rem 1rem .45rem .5rem;font-size:14px;font-weight:600}
.pro-badge i{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--grad-a),var(--grad-b));display:inline-flex;align-items:center;justify-content:center;color:#fff;font-style:normal;font-size:14px}
.proof__label{font-size:14px;color:var(--muted)}
.marquee__track{display:flex;width:max-content;animation:marquee 36s linear infinite}
.marquee__track .cl{display:flex;align-items:center;justify-content:center;height:60px;margin:0 42px;opacity:1}
.marquee__track .cl img{max-height:40px;max-width:190px;width:auto;height:auto;filter:brightness(0);opacity:.5;transition:opacity .2s ease}
/* Logos whose mark has detail inside it (the Tint Haus shield): greyscale instead of a flat silhouette */
.marquee__track .cl.is-mark img{filter:grayscale(1) contrast(1.2);opacity:.6}
.marquee__track .cl.sq img{max-height:60px}
.marquee__track .cl:hover img{opacity:.85}
.marquee__track span:not(.cl){font-family:var(--serif);font-variation-settings:"SOFT" 100;font-size:26px;color:#3a3642;margin:0 40px;white-space:nowrap;opacity:.8}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (max-width:1024px){.marquee__track .cl{margin:0 24px}.marquee__track .cl img{max-height:24px;max-width:120px}.marquee__track .cl.sq img{max-height:40px}}
@media (prefers-reduced-motion:reduce){.marquee__track{animation-duration:120s}}

/* ============ Problems (sticky scroll) ============ */
.jobs-head{text-align:center;max-width:860px;margin:0 auto;padding:80px 0 34px;display:flex;flex-direction:column;gap:14px}
.jobs-head h2{font-size:48px;line-height:1.2}
.jobs-head p{font-size:18px;color:var(--text)}
.sticky-feature{display:flex;position:relative}
.sticky-feature__left{width:50%;background:var(--soft)}
.sticky-feature__panel{
  height:100vh;display:flex;flex-direction:column;justify-content:center;gap:.8rem;
  max-width:760px;margin-left:auto;padding:0 4rem;
}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.sticky-feature__panel h2{font-size:42px;font-weight:600;letter-spacing:-.02em;line-height:1.1}
.sticky-feature__panel p{color:var(--text);max-width:560px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:.3rem;max-width:580px}
.chips span{background:#f2f1f5;border:1px solid #e4e1ea;color:var(--ink);border-radius:999px;padding:7px 15px;font-size:14px;line-height:1.3;transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease}
.chips span:hover{background:#fff;border-color:#c9b5f7;color:var(--accent);transform:translateY(-2px);box-shadow:0 6px 16px rgba(112,56,226,.14)}
.link-arrow{display:inline-flex;align-items:center;gap:.4rem;margin-top:.6rem;font-weight:500;color:#000;text-decoration:underline;text-underline-offset:4px}
.link-arrow svg{width:12px;height:12px;transition:transform .25s ease}
.link-arrow:hover svg{transform:translateX(3px)}
.sticky-feature__right{
  width:50%;height:calc(100vh - var(--header-h));position:sticky;top:var(--header-h);align-self:flex-start;overflow:clip;
  background:#fff;
}
.sticky-feature__img{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:0 4rem 0 5rem;
  opacity:0;transition:opacity 1s ease;margin:0;
}
.sticky-feature__img.is-active{opacity:1}
.lines-bg{position:absolute;left:-12%;top:-12%;z-index:0;width:124%;height:124%;pointer-events:none;will-change:transform;animation:ribbon-a 16s ease-in-out infinite alternate;animation-play-state:paused}
.lines-bg.b{animation-name:ribbon-b;animation-duration:21s}
.lines-on .lines-bg{animation-play-state:running}
@keyframes ribbon-a{from{transform:translate3d(-3%,2.5%,0) rotate(-2deg)}to{transform:translate3d(3%,-2.5%,0) rotate(2deg) scale(1.05)}}
@keyframes ribbon-b{from{transform:translate3d(2.5%,-2%,0) rotate(1.5deg) scale(1.04)}to{transform:translate3d(-2.5%,2%,0) rotate(-1.5deg)}}
@media (prefers-reduced-motion:reduce){.lines-bg{animation:none!important}}
.sticky-feature__right .scene__photo{box-shadow:0 30px 60px rgba(21,15,43,.18)}
.sticky-feature__right .float__card{box-shadow:0 16px 40px rgba(21,15,43,.14),0 0 0 1px rgba(21,15,43,.04)}
.sticky-feature__img{z-index:2}
.scene__photo{position:relative;z-index:2;width:100%;height:66vh;border-radius:24px;overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,.35)}
.scene__photo img{width:100%;height:100%;object-fit:cover}
.sticky-feature__mobile{display:none}
@media (max-width:1024px){
  .jobs-head{padding-top:56px}
  .jobs-head h2{font-size:34px}
  .sticky-feature__left,.sticky-feature__right{display:none}
  .sticky-feature__mobile{display:flex;flex-direction:column;gap:3rem;padding:1rem;width:100%}
  .sticky-feature__mobile article{display:flex;flex-direction:column;gap:.8rem;text-align:center;align-items:center}
  .sticky-feature__mobile .img{border-radius:18px;overflow:hidden;width:100%}
  .sticky-feature__mobile .img img{width:100%;aspect-ratio:16/10;object-fit:cover}
  .sticky-feature__mobile h2{font-size:28px;font-weight:600;line-height:1.15;letter-spacing:-.02em}
  .sticky-feature__mobile p{color:var(--text)}
  .sticky-feature__mobile .chips{justify-content:center}
}

/* ============ Section heading ============ */
.sec-head{text-align:center;max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:20px;padding-top:90px}
.sec-head h2{font-size:48px;line-height:1.2}
.sec-head .lead{font-size:18px;font-weight:500;line-height:1.6;color:var(--text)}
@media (max-width:767px){.sec-head{padding-top:60px}.sec-head h2{font-size:30px}}

/* ============ Case studies carousel ============ */
.portal .embla__viewport{overflow:hidden}
.portal .embla__container{display:flex;padding:3rem 0}
.portal .slide{
  position:relative;flex:0 0 calc(22% - 22px);min-width:0;border-radius:28px;overflow:hidden;aspect-ratio:3/4;
  box-shadow:0 2px 8px rgba(99,99,99,.2);
}
.slide__media{position:absolute;inset:0;overflow:hidden}
.slide__media img{position:absolute;top:0;left:-15%;width:130%;max-width:none;height:100%;object-fit:cover;transform:translate3d(var(--px,0px),0,0);will-change:transform}
.result{position:absolute;top:16px;left:16px;z-index:1;background:linear-gradient(135deg,var(--grad-a),var(--grad-b));color:#fff;border-radius:999px;padding:6px 13px;font-size:13px;font-weight:600;line-height:1.2}
.slide__name{position:absolute;left:16px;right:16px;bottom:16px;background:#fff;border-radius:16px;padding:12px 14px;z-index:1;transition:opacity .2s ease-out}
.slide__name b{display:block;font-size:13px;line-height:1.3;color:var(--accent);font-weight:600}
.slide__name span{display:block;font-size:15px;line-height:1.35;font-weight:500;color:var(--ink);margin-top:3px}
.slide:hover .slide__name,.slide:hover .result{opacity:0}
.slide__hover{
  position:absolute;inset:0;background:rgba(21,15,43,.82);display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .2s ease-out;z-index:2;
}
.slide:hover .slide__hover{opacity:1}
.pill-btn{display:flex;align-items:center;gap:.4rem;background:#fff;border:0;border-radius:25px;padding:.7rem 1.2rem;font-size:13px;cursor:pointer}
.pill-btn svg{width:13px;height:10px}
.slide__details{
  position:absolute;inset:0;background:#fff;display:none;flex-direction:column;justify-content:space-between;
  padding:1.4rem;z-index:3;font-size:13px;line-height:1.55;overflow:auto;
}
.slide__details.open{display:flex}
.slide__details .nm{font-family:var(--serif);font-size:20px;margin-bottom:.6rem}
.slide__details .desc{border-top:1px solid var(--border);padding-top:.9rem;margin-bottom:.9rem}
.label{font-weight:600;padding-bottom:.4rem}
.tags{display:flex;gap:.5rem;flex-wrap:wrap}
.tag{background:var(--grey);border-radius:5px;font-size:12px;font-weight:500;padding:.5rem .7rem;line-height:1}
.dots{display:none;justify-content:center;gap:1rem;padding-bottom:2rem}
.dot{width:10px;height:10px;border-radius:50%;border:0;padding:0;background:rgba(21,15,43,.3);cursor:pointer}
.dot.active{background:rgba(21,15,43,.9)}
@media (max-width:1024px){.portal .slide{flex-basis:calc(33.333% - 20px)}.dots{display:flex}}
@media (max-width:768px){.portal .slide{flex-basis:80%}.slide__hover{display:none}}

/* Case study modal */
.modal{position:fixed;inset:0;z-index:1000;background:rgba(21,15,43,.82);display:flex;align-items:center;justify-content:center;padding:1rem;
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .45s ease,visibility 0s linear .45s}
.modal.active{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .45s ease,visibility 0s}
.modal .modal__box{opacity:0;transform:translateY(28px) scale(.965);transition:opacity .45s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.modal.active .modal__box{opacity:1;transform:none;transition-delay:.06s}
.modal .mslide__body > img{transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.modal:not(.active) .mslide__body > img{transform:scale(1.04)}
.modal__arrows .icon-btn{transition:background .2s ease,opacity .3s ease}
html{scrollbar-gutter:stable}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal__box{position:relative;width:100%;max-width:1200px}
.modal .embla__viewport{overflow:hidden;border-radius:1rem}
.modal .embla__container{display:flex}
.modal .mslide{flex:0 0 100%;min-width:0;background:#fff;border-radius:1rem;padding:2rem;cursor:grab}
.mslide__top{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--border);padding-bottom:1.25rem}
.mslide__top h3{font-family:var(--serif);font-size:28px;font-weight:400;line-height:1.25}
.mslide__top span{color:var(--muted);font-size:14px;white-space:nowrap}
.mslide__body{display:flex;padding-top:1.75rem}
.mslide__body > img{width:600px;height:400px;object-fit:cover;flex-shrink:0;max-width:52%;border-radius:14px}
.mslide__info{display:flex;flex-direction:column;justify-content:space-between;gap:1.25rem;padding-left:2rem}
.mslide__info .grp{display:flex;flex-direction:column;gap:1rem}
.quote-box{border-left:3px solid var(--accent);padding:.25rem 0 .25rem 1rem;font-family:var(--serif);font-size:18px;line-height:1.5;color:#2b2733}
.quote-box small{display:block;font-family:var(--sans);font-size:13px;color:var(--muted);margin-top:.35rem}
.icon-btn{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:0;border-radius:5px;background:transparent;cursor:pointer}
.icon-btn:hover{background:rgba(255,255,255,.2)}
.icon-btn svg{width:20px;height:20px}
.modal__close{position:absolute;right:15px;top:15px;z-index:3}
.modal__close:hover{background:rgba(0,0,0,.08)}
.modal__arrows{position:absolute;left:0;top:50%;width:100%;display:flex;justify-content:space-between;pointer-events:none}
.modal__arrows .icon-btn{pointer-events:auto}
.modal__prev{transform:translate(-150%,-50%) rotate(180deg)}
.modal__next{transform:translate(150%,-50%)}
@media (max-width:1400px){.modal__prev{transform:translate(-110%,-50%) rotate(180deg)}.modal__next{transform:translate(110%,-50%)}}
@media (max-width:1024px){
  .mslide__body{flex-direction:column}
  .mslide__body > img{width:100%;height:auto;max-width:100%;aspect-ratio:16/10}
  .mslide__info{padding-left:0;padding-top:1.5rem}
  .mslide__top{flex-direction:column;gap:.25rem}
  .modal__close{top:-40px;right:0}
  .modal__close svg path{stroke:#fff}
  .modal__prev{transform:translate(-20%,-50%) rotate(180deg)}.modal__next{transform:translate(20%,-50%)}
  .modal__arrows .icon-btn{background:rgba(21,15,43,.6)}
}

/* ============ Works with block ============ */
.integrations{padding:70px 0 90px;background:var(--soft);margin:30px auto 0;max-width:1320px;border-radius:28px;overflow:hidden}
@media (max-width:1360px){.integrations{margin-left:20px;margin-right:20px}}
@media (max-width:767px){.integrations{margin-left:0;margin-right:0;border-radius:0}}
.integrations__inner{display:flex;align-items:center;justify-content:space-between;gap:3rem}
.integrations__left{width:48%;max-width:640px;display:flex;flex-direction:column;gap:1.6rem}
.integrations__left h2{font-size:46px;font-weight:500;line-height:1.25}
.integrations__left p{border-bottom:2px solid #ece9f1;padding-bottom:1.75rem;color:var(--text)}
/* Partner proof: official badges, each linking to the partner's own listing */
.pproof{margin-top:64px;padding-top:56px;border-top:2px solid #ece9f1}
.pproof__head{max-width:640px;margin-bottom:2rem}
.pproof__head h3{font-size:34px;font-weight:500;line-height:1.2;margin:.4rem 0 .6rem}
.pproof__head p:last-child{color:var(--text)}
.pproof__top{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}
.pproof__grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}
.pcard{background:#fff;border:1px solid var(--border);border-radius:20px;padding:1.4rem 1.3rem 1.3rem;display:flex;flex-direction:column;gap:.35rem;line-height:1.45;transition:border-color .25s,box-shadow .25s,transform .25s}
.pcard:hover{border-color:#cdbcf3;box-shadow:0 14px 34px -18px rgba(70,40,140,.35);transform:translateY(-2px)}
.pcard img{height:40px;width:auto;max-width:100%;object-fit:contain;object-position:left center;margin-bottom:.9rem}
.pcard b{font-size:15px;font-weight:600;color:var(--ink,#1d1a17)}
.pcard span{font-size:14px;color:var(--text)}
.pcard__link{margin-top:auto;padding-top:.7rem;display:flex;width:fit-content;white-space:nowrap;align-items:center;gap:.4rem;font-size:14px;font-weight:600;color:var(--accent)}
.pcard__link svg{width:14px;height:14px;flex:none;transition:transform .2s}
.pcard__link:hover svg{transform:translate(2px,-2px)}
.pcard--lg{flex-direction:row;align-items:center;gap:1.75rem;padding:1.6rem 1.8rem}
.pcard--lg img{height:92px;margin:0;flex:none}
.pcard--lg .pcard__tx{display:flex;flex-direction:column;gap:.3rem}
.pcard--lg b{font-size:18px}
.pcard--lg span{font-size:15px}
.pcard--lg .pcard__link{padding-top:.5rem}
.pcard--nsw img{height:56px;margin-bottom:.5rem}
.pcard img[src*="tyro"]{height:32px;margin-top:4px;margin-bottom:calc(.9rem + 4px)}
.pcard img[src*="shopify"]{height:46px;margin-top:-3px;margin-bottom:calc(.9rem - 3px)}
@media (max-width:1180px){.pproof__grid{grid-template-columns:repeat(3,minmax(0,1fr))}.pcard--lg{flex-direction:column;align-items:flex-start;gap:1rem}.pcard--lg img{height:72px}}
@media (max-width:767px){.pproof{margin-top:44px;padding-top:40px}.pproof__head{text-align:center;margin-left:auto;margin-right:auto}.pproof__head h3{font-size:28px}.pproof__top{grid-template-columns:1fr;gap:.75rem;margin-bottom:.75rem}.pproof__grid{grid-template-columns:1fr;gap:.75rem}.pcard{padding:1.1rem 1.1rem}.pcard--lg img{height:64px}
  .pproof__grid .pcard{display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:1rem;row-gap:.15rem;align-content:start}
  .pproof__grid .pcard > *{grid-column:2}
  .pproof__grid .pcard img,.pproof__grid .pcard img[src]{grid-column:1;grid-row:1/span 3;width:96px;height:auto;max-height:46px;margin:3px 0 0;object-position:left top}
  .pproof__grid .pcard img[src*="tyro"]{width:64px}
  .pproof__grid .pcard--nsw img{max-height:52px;width:auto}
  .pproof__grid .pcard__link{padding-top:.35rem}}
.integrations__right{width:52%}
/* Orbit: EUX in the centre, systems on two counter-rotating rings */
.orbit{position:relative;width:min(540px,100%);aspect-ratio:1;margin:0 auto;container-type:inline-size}
.orbit__ring{position:absolute;border-radius:50%;border:1.5px dashed #d8d1e6;pointer-events:none}
.orbit__ring.r1{inset:23%}
.orbit__ring.r2{inset:7%}
.orbit__track{position:absolute;inset:0}
.orbit__track.t1{animation:orbit-spin 60s linear infinite}
.orbit__track.t2{animation:orbit-spin-rev 90s linear infinite}
.orbit__pos{position:absolute;left:50%;top:50%;width:0;height:0;transform:rotate(var(--a)) translateX(var(--r)) rotate(calc(-1 * var(--a)))}
.orbit__tile{position:absolute;width:var(--t);height:var(--t);left:calc(var(--t) / -2);top:calc(var(--t) / -2);border-radius:50%;background:#fff;border:1px solid #ece8f3;box-shadow:0 8px 22px rgba(21,15,43,.10);display:flex;align-items:center;justify-content:center;transition:transform .25s ease,box-shadow .25s ease}
.t1 .orbit__tile{animation:orbit-spin-rev 60s linear infinite}
.t2 .orbit__tile{animation:orbit-spin 90s linear infinite}
.orbit__tile img{max-width:58%;max-height:52%;object-fit:contain}
.orbit__tile.wide img{max-width:78%;max-height:60%}
.orbit__tile::after{content:attr(data-name);position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);white-space:nowrap;background:var(--navy);color:#fff;font-size:12px;font-weight:500;padding:4px 10px;border-radius:999px;opacity:0;pointer-events:none;transition:opacity .2s}
.orbit__tile:hover{box-shadow:0 12px 28px rgba(112,56,226,.28);z-index:5}
.orbit__tile:hover::after{opacity:1}
.orbit:hover .orbit__track,.orbit:hover .orbit__tile,.orbit:hover .orbit__spark{animation-play-state:paused}
.orbit__core{position:absolute;left:50%;top:50%;width:26cqw;height:26cqw;transform:translate(-50%,-50%);border-radius:50%;background:linear-gradient(135deg,var(--grad-a),var(--grad-b));display:flex;align-items:center;justify-content:center;box-shadow:0 18px 40px rgba(112,56,226,.35);z-index:3}
.orbit__core img{width:56%;height:auto}
.orbit__core::before,.orbit__core::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(112,56,226,.45);animation:orbit-pulse 3.6s ease-out infinite;z-index:-1}
.orbit__core::after{animation-delay:1.8s}
.orbit__spark{position:absolute;inset:7%;border-radius:50%;animation:orbit-spin 14s linear infinite;pointer-events:none}
.orbit__spark::before{content:"";position:absolute;left:50%;top:-5px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px rgba(112,56,226,.15),0 0 18px 4px rgba(160,102,238,.6)}
.orbit__spark.s2{inset:23%;animation-duration:9s;animation-direction:reverse}
.orbit__spark.s2::before{width:8px;height:8px;margin-left:-4px;top:-4px}
.orbit-caption{margin-top:1.25rem;text-align:center;font-size:13px;color:var(--muted);line-height:1.6}
@keyframes orbit-spin{to{transform:rotate(360deg)}}
@keyframes orbit-spin-rev{to{transform:rotate(-360deg)}}
@keyframes orbit-pulse{0%{transform:scale(1);opacity:.9}100%{transform:scale(2.1);opacity:0}}
@media (prefers-reduced-motion:reduce){.orbit__track,.orbit__tile,.orbit__spark,.orbit__core::before,.orbit__core::after{animation:none!important}.orbit__spark{display:none}}
@media (max-width:1023px){
  .integrations__inner{flex-direction:column;text-align:center}
  .integrations__left,.integrations__right{width:100%;max-width:none;align-items:center}
  .integrations__left h2{font-size:32px}
}


/* ============ How we work (pricing) ============ */
.pricing-head{max-width:760px;margin:0 auto;padding:100px 35px 30px;text-align:center}
.pricing-head h2{font-size:48px;padding-bottom:15px;line-height:1.2}
.pricing-head p{color:var(--text)}
.plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.25rem;max-width:1360px;margin:0 auto;align-items:stretch}
.plan{
  position:relative;display:flex;flex-direction:column;justify-content:space-between;width:100%;max-width:420px;
  background:#fff;border:1px solid #e7e4ec;border-radius:12px;
  opacity:0;transform:translateY(40px);transition:opacity .5s,transform .5s;
}
.plan.in{opacity:1;transform:none}
.plan:nth-child(2){transition-delay:.12s}
.plan:nth-child(3){transition-delay:.24s}
.plan:nth-child(4){transition-delay:.36s}
.plan{max-width:none}
.plan__top,.plan__price{padding:1.6rem}
.plans .plan__top{border-bottom:0;padding-bottom:.4rem}
.plans .plan__price{padding-top:.6rem}
.plans .fine{min-height:0;margin-bottom:1.1rem}
.plan__title{font-size:20px}
.price{font-size:30px;white-space:nowrap}
.badge{top:1.5rem;right:1.25rem}
.plan.popular{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#7038e2,#a066ee,#c9a6f7) border-box}
.badge{position:absolute;right:1.5rem;top:1.75rem;background:linear-gradient(135deg,#7038e2,#a066ee);color:#fff;border-radius:6px;font-size:13px;font-weight:500;padding:.35rem .9rem}
.plan__top{padding:2rem 2rem 1.5rem;border-bottom:1px solid var(--border)}
.plan__icon{width:56px;height:56px;border:1px solid #e7e4ec;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem;color:var(--accent)}
.plan__icon svg{width:26px;height:26px}
.plan__title{font-size:22px;font-weight:500;color:#1a1a1a;margin-bottom:.75rem}
.plan__desc{font-size:15px;color:#5e5b66;line-height:1.55}
.plan__price{padding:2rem}
.from{font-size:14px;color:var(--muted);font-weight:500;margin-bottom:.25rem}
.price-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:.35rem;margin-bottom:.5rem}
.price{font-size:40px;font-weight:600;line-height:1.05;color:#1a1a1a}
.per{font-size:14px;color:var(--muted)}
.fine{font-size:13px;color:var(--muted);margin-bottom:1.5rem;min-height:2.6em}
.tbc{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;background:#fff4d6;color:#8a5a00;border-radius:4px;padding:2px 6px;vertical-align:middle}
@media (max-width:1180px){.plans{grid-template-columns:repeat(2,minmax(0,1fr));max-width:860px}}
@media (max-width:900px){.plans{grid-template-columns:1fr;max-width:460px}.plan__top,.plan__price{padding:1.5rem}.badge{top:1.5rem;right:1.5rem}.pricing-head h2{font-size:34px}}

/* ============ Also: marketing ============ */
.extra{margin:70px auto 0;max-width:1100px;border:1px solid var(--border);border-radius:24px;padding:2rem 2.25rem;display:flex;align-items:center;justify-content:space-between;gap:2rem}
.extra .eyebrow{margin-bottom:.35rem}
.extra h3{font-size:26px;font-weight:600;letter-spacing:-.01em;line-height:1.2;margin-bottom:.4rem}
.extra p{color:var(--text);max-width:640px}
@media (max-width:860px){.extra{flex-direction:column;align-items:flex-start;margin-left:1rem;margin-right:1rem;padding:1.5rem}}

/* ============ About ============ */
.about{margin-top:90px;padding:90px 0;background:var(--soft)}
.about__inner{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:4.5rem;align-items:center;max-width:1320px}
.about__media{position:relative}
.team-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.team-grid figure{position:relative;margin:0;border-radius:18px;overflow:hidden;background:#ddd}
.about__media .team-grid img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:0;box-shadow:none;filter:grayscale(1);transition:transform .6s cubic-bezier(.16,1,.3,1),filter .4s ease}
.team-grid figure:hover img{transform:scale(1.04);filter:grayscale(0)}
.team-grid figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 12px 10px;background:linear-gradient(180deg,rgba(10,8,20,0),rgba(10,8,20,.72));color:#fff;line-height:1.25}
.team-grid figcaption b{display:block;font-size:14px;font-weight:600}
.team-grid figcaption span{display:block;font-size:11.5px;line-height:1.3;opacity:.85}
.about__media img{width:100%;aspect-ratio:22/25;object-fit:cover;border-radius:28px;box-shadow:0 30px 60px rgba(21,15,43,.14)}
.about__copy{display:flex;flex-direction:column;gap:1.1rem}
.about__copy h2{font-size:46px;line-height:1.15}
.about__copy > p:not(.eyebrow){color:var(--text);font-size:17px;max-width:620px}
.about__ctas{display:flex;align-items:center;gap:1.75rem;flex-wrap:wrap;margin-top:.5rem}
.about__ctas .link-arrow{margin-top:0}
@media (max-width:1023px){
  .about{padding:60px 0;margin-top:60px}
  .about__inner{grid-template-columns:1fr;gap:2.5rem}
  .about__media{max-width:560px}
  .about__copy h2{font-size:32px}
}

/* ============ Story cards ============ */
.stories-head{padding-top:90px;text-align:center}
.stories-head h3{font-size:44px;padding-bottom:10px;line-height:1.2;font-weight:400}
.stories-head p{padding:0 1rem 30px;color:var(--text)}
.cards{overflow:hidden;padding:20px 0}
.cards__track{overflow:hidden;padding:0 20px;touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none}
.cards__container{display:flex}
.cards__container .card{margin-right:24px}
.cards__track .card img{pointer-events:none;-webkit-user-drag:none}
@media (hover:hover) and (pointer:fine){.cards.has-cursor .cards__track{cursor:none}}
.card{flex:0 0 auto;width:380px;min-height:560px;padding:22px;border-radius:24px;background:var(--soft);transition:transform .3s ease}
.card:hover{transform:translateY(-4px)}
.card__inner{display:flex;flex-direction:column;height:100%}
.card__img{position:relative;aspect-ratio:4/3;border-radius:16px;overflow:hidden;margin-bottom:22px}
.card__img img{width:100%;height:100%;object-fit:cover}
.card__label{position:absolute;left:18px;bottom:18px;background:#fff;border-radius:20px;padding:7px 14px;font-size:13px;font-weight:600}
.card h3{font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1.2;margin-bottom:12px}
.card p{color:#55525c;flex-grow:1;line-height:1.6;margin-bottom:20px}
.card__link{display:inline-flex;align-items:center;gap:8px;font-weight:600;margin-top:auto}
.card__link svg{width:20px;height:20px}
.cards__dots{display:flex;justify-content:center;gap:8px;padding-top:20px}
.cards__dots button{width:8px;height:8px;border-radius:50%;border:0;padding:0;background:#cfcbd8;cursor:pointer;transition:all .3s}
.cards__dots button.is-active{background:#4b4656;transform:scale(1.25)}
@media (max-width:768px){.card{width:calc(100% - 48px);min-width:260px;min-height:0}.stories-head h3{font-size:30px}}

/* ============ FAQ ============ */
.faq{max-width:1230px;margin:60px auto 0;padding:60px 0;background:var(--soft);border-radius:28px}
.faq h2.title{font-size:34px;font-weight:600;margin-bottom:2rem}
.acc{display:flex;align-items:center;justify-content:space-between;width:100%;padding:1.6rem 0;background:transparent;border:0;border-top:1px solid #000;text-align:left;cursor:pointer;color:#333}
.acc h3{font-size:18px;font-weight:600;width:85%;line-height:1.4}
.pm{position:relative;width:15px;height:15px;flex-shrink:0}
.pm::before,.pm::after{content:"";position:absolute;left:0;top:50%;width:100%;height:2px;background:var(--accent);transition:.35s}
.pm::before{transform:translateY(-50%)}
.pm::after{transform:translateY(-50%) rotate(90deg)}
.pm.active::before{opacity:0;transform:translateY(-50%) rotate(-90deg)}
.pm.active::after{transform:translateY(-50%) rotate(0)}
.acc-body{max-height:0;overflow:hidden;transition:max-height .2s ease-out;line-height:1.65}
.acc-body p{color:#2f2f2f;width:80%;padding-bottom:16px}
.acc-body p:last-child{padding-bottom:28px}
@media (max-width:767px){.faq{border-radius:0}.faq h2.title{font-size:27px}.acc-body p{width:100%}}

/* ============ Talk to us ============ */
.talk{margin-top:80px;background:radial-gradient(circle at 100% 0%,rgba(160,102,238,.5) 0,rgba(21,15,43,0) 45%),var(--navy-2);color:#fff}
.talk__inner{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;padding-top:5rem;padding-bottom:5rem;max-width:1400px}
.talk h2{font-size:48px;font-weight:500;letter-spacing:-.02em;line-height:1.1;margin-bottom:1rem}
.talk p{color:rgba(255,255,255,.85);max-width:520px}
.talk .big-phone{display:inline-block;margin-top:1.5rem;font-size:30px;font-weight:600;letter-spacing:.01em}
.talk .big-phone small{display:block;font-size:13px;font-weight:400;color:rgba(255,255,255,.7);letter-spacing:0}
.talk .addr{margin-top:.75rem;font-size:14px;color:rgba(255,255,255,.7)}.talk .addr a{color:inherit;text-decoration:none}.talk .addr a:hover{color:#fff;text-decoration:underline}
.form{background:#fff;color:var(--ink);border-radius:20px;padding:2rem;display:grid;grid-template-columns:1fr 1fr;gap:1rem;box-shadow:0 30px 60px rgba(0,0,0,.25)}
.form .full{grid-column:1 / -1}
.form label{display:flex;flex-direction:column;gap:.35rem;font-size:14px;font-weight:500}
.form input,.form textarea{font:inherit;font-size:15px;border:1px solid var(--border);border-radius:12px;padding:.8rem 1rem;background:#fff;color:var(--ink)}
.form textarea{min-height:120px;resize:vertical}
.form input:focus,.form textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.form .note{font-size:13px;color:var(--muted)}
.form .ok{display:none;grid-column:1 / -1;background:#eef8f1;color:#1f6b3f;border-radius:12px;padding:.8rem 1rem;font-size:14px}
.form.sent .ok{display:block}
@media (max-width:1023px){.talk__inner{grid-template-columns:1fr;gap:2.5rem}.talk h2{font-size:34px}}
@media (max-width:560px){.form{grid-template-columns:1fr;padding:1.4rem}}

/* ============ Footer ============ */
footer .wrap{max-width:1448px;margin-left:auto;margin-right:auto}
.partners-band{max-width:1320px;margin:60px auto 0;background:#000;color:#fff;border-radius:28px;padding:44px 44px 40px}
.partners-band__top{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-bottom:32px;border-bottom:1px solid #1d1d1d}
.partners-band h3{font-size:26px;font-weight:500;line-height:1.25;letter-spacing:-.01em}
.partners-band__nsw{display:flex;align-items:center;gap:56px}
.partners-band__nsw img{height:76px;width:auto}
.partners-band__logos{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:34px}
.partners-band__logos img{height:42px;width:auto;max-width:150px;object-fit:contain;min-width:0;flex:0 1 auto}
.partners-band__logos img[alt="Salesforce"]{height:58px}
.partners-band__logos img[alt*="Pro Partner"]{height:56px;max-width:170px}
@media (max-width:1180px){.partners-band__logos{flex-wrap:wrap;justify-content:center;gap:28px 36px}}
@media (max-width:1360px){.partners-band{margin-left:20px;margin-right:20px}}
@media (max-width:1023px){.partners-band__top{flex-direction:column;align-items:flex-start}.partners-band__nsw{flex-wrap:wrap;gap:24px}.partners-band__logos{justify-content:center}}
@media (max-width:767px){.partners-band{margin:40px 0 0;border-radius:0;padding:32px 20px}.partners-band__nsw img{height:56px;max-width:100%}.partners-band__logos img{height:42px}.partners-band__logos img[alt*="Pro Partner"],.partners-band__logos img[alt="Salesforce"]{height:50px}}
.footer__sub h4{font-size:16px;font-weight:500;margin-bottom:.25rem}
.footer__sub .contact-lines{margin-top:.9rem}
.footer__sub .contact-lines a:hover{color:var(--accent)}
.footer__top{display:flex;justify-content:space-between;gap:3rem;padding-top:4rem;padding-bottom:4rem}
.footer__cols{display:flex;gap:4.5rem;width:64%;font-size:14px}
.footer__cols h4{font-size:16px;font-weight:500;margin-bottom:.25rem}
.footer__cols ul{list-style:none;margin:0;padding:0}
.footer__cols li{margin-top:.9rem}
.footer__cols a:hover{color:var(--accent)}
.footer__sub{width:36%;display:flex;flex-direction:column;align-items:flex-end}
.footer__sub > div{max-width:460px;width:100%}
.footer__sub p{font-size:14px;line-height:1.4;margin-bottom:.5rem;color:var(--text)}
.footer__sub p:first-child{font-size:16px;font-weight:500;color:var(--ink)}
.contact-lines{margin-top:1.5rem;font-size:14px;line-height:1.8}
.contact-lines b{font-weight:600}
.sub-form{display:flex;gap:.5rem;margin-top:.5rem}
.sub-form input{flex:1;min-width:0;height:50px;border:1px solid var(--border);border-radius:50px;padding:0 1.2rem;font:inherit;font-size:14px}
.sub-form button{min-height:50px;padding:0 1.2rem;border-radius:40px;border:2px solid transparent;background:var(--accent);color:#fff;font-weight:500;cursor:pointer;transition:all .2s linear}
.sub-form button:hover{background:#fff;color:var(--accent);border-color:var(--accent)}
.footer__bottom{padding:0 0 2rem}
.footer__bottom .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:linear-gradient(var(--border),var(--border)) content-box 0 0/100% 2px no-repeat}
.footer__bottom .wrap > *{margin-top:2rem}
.footer__legal{display:flex;gap:2.5rem;font-size:14px;flex-wrap:wrap}
.footer__legal a:first-child{font-weight:500}
.footer__legal a:hover{color:var(--accent)}
.socials{display:flex;gap:1.25rem;font-size:14px}
.socials a:hover{color:var(--accent)}
@media (max-width:1024px){.footer__cols{gap:2.5rem;flex-wrap:wrap}}
@media (max-width:767px){
  .footer__top{flex-direction:column;padding-top:3rem;padding-bottom:0}
  .footer__cols{width:100%;flex-wrap:wrap;row-gap:2.5rem;column-gap:3rem}
  .footer__sub{width:100%;padding:2rem 0 3rem;align-items:stretch}
  .footer__bottom .wrap{flex-direction:column-reverse;row-gap:1.5rem}
  .footer__legal{gap:1rem 2rem;justify-content:center}
}

/* ============ Mobile call / talk bar ============ */
.mbar{display:none}
@media (max-width:767px){
  .mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:98;gap:.5rem;padding:.6rem .75rem calc(.6rem + env(safe-area-inset-bottom,0px));background:#fff;border-top:1px solid var(--border);box-shadow:0 -6px 20px rgba(21,15,43,.08)}
  .mbar .btn{flex:1;height:46px;font-size:15px;padding:0 12px}
  body{padding-bottom:70px}
}

/* ============ Floating Google rating (bottom left) and back to top (bottom right) ============ */
.rate-float{position:fixed;left:24px;bottom:24px;z-index:97;display:inline-flex;align-items:center;gap:6px;padding:9px 14px 9px 12px;background:#fff;border-radius:999px;
  box-shadow:0 10px 30px rgba(21,15,43,.14),0 0 0 1px rgba(21,15,43,.06);color:var(--ink);font-size:14px;font-weight:500;text-decoration:none;
  opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .45s ease,transform .45s ease,box-shadow .3s ease}
.rate-float.is-on{opacity:1;transform:none;pointer-events:auto}
body:has(.hero .greview) .rate-float{display:none} /* the homepage shows the long rating in the hero instead */
.rate-float:hover{box-shadow:0 14px 34px rgba(21,15,43,.2),0 0 0 1px rgba(21,15,43,.08)}
.rate-float .stars{display:inline-flex;gap:1px}
.rate-float .stars svg{width:13px;height:13px}
.rate-float svg.g{width:17px;height:17px}
.rate-float b{font-weight:600}
.rate-float__n{color:var(--muted);font-weight:400}
.to-top{position:fixed;right:24px;bottom:24px;z-index:97;width:48px;height:48px;border-radius:50%;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;
  background:#fff;color:var(--ink);box-shadow:0 10px 30px rgba(21,15,43,.14),0 0 0 1px rgba(21,15,43,.06);
  opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .35s ease,transform .35s ease,background .25s ease,color .25s ease}
.to-top.is-on{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{background:var(--ink);color:#fff}
.to-top svg{width:20px;height:20px;transform:rotate(-90deg)}
@media (max-width:767px){.rate-float{display:none}.to-top{right:14px;bottom:calc(82px + env(safe-area-inset-bottom,0px));width:44px;height:44px}}
@media (prefers-reduced-motion:reduce){.rate-float,.to-top{transition:opacity .2s ease;transform:none}}

/* ============ Motion ============ */
/* Blocks rise in from below as they enter the screen */
.js [data-reveal]{opacity:0;transform:translate3d(0,40px,0);transition:opacity 1s cubic-bezier(.25,1,.5,1),transform 1.2s cubic-bezier(.16,1,.3,1);transition-delay:var(--d,0s)}
.js [data-reveal].in{opacity:1;transform:none}
/* Waterfall: items in a group drop in one after another once the group scrolls into view */
.js [data-fall]{opacity:0;transform:translate3d(0,22px,0);transition:opacity .7s ease,transform 1s cubic-bezier(.16,1,.3,1);transition-delay:var(--d,0s)}
.js .partners-band [data-fall]{transform:translate3d(0,22px,0) scale(.94)}
.js .fall-in [data-fall]{opacity:1;transform:none}
/* Headings fade up word by word */
[data-split="words"] .w{display:inline-block}
.js [data-split="words"] .w{opacity:0;transform:translate3d(0,.55em,0);transition:opacity .9s ease,transform 1.1s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--d,0s) + var(--i) * 60ms)}
.js [data-split="words"].in .w{opacity:1;transform:none}
/* Problem titles: letters slide up out of a mask, one after another */
[data-split="letters"] .wd{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
[data-split="letters"] .wd > span{display:inline-block}
.js [data-split="letters"] .wd > span{transform:translate3d(0,115%,0);transition:transform 1s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--i) * 22ms)}
.js [data-split="letters"].in .wd > span{transform:none}

/* Problems: each photo is a small scene (shape grows in, photo wipes up, UI cards float on top) */
.js .scene__photo{clip-path:inset(100% 0 0 0 round 24px);transition:clip-path 1.3s cubic-bezier(.65,0,.35,1) .1s}
.js .is-active .scene__photo{clip-path:inset(0 0 0 0 round 24px)}
.scene__photo img{transform:scale(1.18);transition:transform 1.9s cubic-bezier(.16,1,.3,1) .1s}
.is-active .scene__photo img{transform:none}
.float{position:absolute;z-index:3;transform:translate3d(0,var(--py,0px),0);will-change:transform}
.float.f1{left:2.25rem;top:calc(17vh - 1rem)}
.float.f2{right:2rem;bottom:calc(17vh - 1.5rem)}
.float__card{display:flex;align-items:center;gap:10px;background:#fff;color:var(--ink);border-radius:16px;padding:12px 16px 12px 12px;box-shadow:0 20px 45px rgba(8,5,22,.38);font-size:13px;line-height:1.35;white-space:nowrap;
  opacity:0;transform:translate3d(0,34px,0) scale(.94);transition:opacity .8s ease .75s,transform 1.1s cubic-bezier(.16,1,.3,1) .75s;animation:bob 6s ease-in-out infinite}
.f2 .float__card{transition-delay:1.05s;animation-delay:-3s}
.is-active .float__card,.in .float__card{opacity:1;transform:none}
.float__card b{display:block;font-weight:600;font-size:13.5px}
.float__card small{display:block;font-size:12px;color:var(--muted)}
.float__ic{flex-shrink:0;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--grad-a),var(--grad-b));color:#fff;display:flex;align-items:center;justify-content:center}
.float__ic svg{width:17px;height:17px}
.float__ic.ok{background:#1fa463}
.float__ic.spin svg{animation:orbit-spin 3s linear infinite}
.sys{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.sys em{font-style:normal;font-weight:600;font-size:12.5px;background:var(--grey);border-radius:999px;padding:4px 10px}
.bars{display:flex;align-items:flex-end;gap:5px;height:34px;margin-top:6px}
.bars i{width:9px;height:var(--h);border-radius:3px;background:linear-gradient(180deg,var(--grad-b),var(--grad-a));transform-origin:bottom;transform:scaleY(0);transition:transform .7s cubic-bezier(.16,1,.3,1);transition-delay:calc(1.3s + var(--i) * 90ms)}
.is-active .bars i,.in .bars i{transform:none}
.float__card.col{flex-direction:column;align-items:flex-start;gap:0;padding:14px 16px}
.checks{list-style:none;margin:6px 0 0;padding:0}
.checks li{display:flex;align-items:center;gap:8px;margin-top:5px;opacity:0;transform:translateX(-8px);transition:opacity .5s ease,transform .5s ease;transition-delay:calc(1.2s + var(--i) * .35s)}
.checks li svg{width:16px;height:16px;padding:3px;border-radius:50%;background:#1fa463;color:#fff}
.is-active .checks li,.in .checks li{opacity:1;transform:none}
.sms{max-width:230px;white-space:normal;background:#f3effb;border-radius:14px 14px 14px 4px;padding:9px 12px;margin-top:6px;font-size:13px;color:var(--ink)}
.live{width:10px;height:10px;border-radius:50%;background:#1fa463;flex-shrink:0;box-shadow:0 0 0 0 rgba(31,164,99,.5);animation:live 2s ease-out infinite;margin:0 4px}
@keyframes live{0%{box-shadow:0 0 0 0 rgba(31,164,99,.55)}100%{box-shadow:0 0 0 12px rgba(31,164,99,0)}}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -8px}}
/* Outgoing scene resets only after it has faded out */
/* Sample store product page over the "Build or rebuild" photo; sizes in em so the whole window scales with --bw */
.sf-stage{position:relative;width:100%}
.has-browser .float.f1{left:auto;right:2rem}
/* A wide screenshot ("Connect my online and in-store systems") keeps its 1.6 shape so nothing is cropped; the cards sit on its corners */
.sticky-feature__img.is-wide .scene__photo{height:auto;aspect-ratio:1.6}
.sticky-feature__img.is-wide .float.f1{top:calc(50% - (50vw - 151px) / 1.6 / 2 - 1.75rem)}
.sticky-feature__img.is-wide .float.f2{bottom:calc(50% - (50vw - 151px) / 1.6 / 2 - 1.75rem)}
/* Orders dashboard over the "Keep my store running" photo, bottom left, under the care check card (Ben 2026-10-12) */
.sf-dash{--dw:clamp(280px,28vw,440px);position:absolute;z-index:3;left:-3.25rem;bottom:-2.25rem;width:var(--dw);transform:translate3d(0,var(--py,0px),0);will-change:transform}
.sf-dash img{display:block;width:100%;height:auto;border-radius:calc(var(--dw) / 34);box-shadow:0 24px 60px rgba(21,15,43,.24),0 0 0 1px rgba(21,15,43,.06);opacity:0;transform:translate3d(0,40px,0) scale(.96);transform-origin:left bottom;transition:opacity .8s ease .55s,transform 1.1s cubic-bezier(.16,1,.3,1) .55s}
.is-active .sf-dash img{opacity:1;transform:none}
.sf-browser{--bw:clamp(250px,24vw,400px);position:absolute;z-index:3;left:-3.5rem;bottom:-2.5rem;width:var(--bw);font-size:calc(var(--bw) / 34);transform:translate3d(0,var(--py,0px),0);will-change:transform;text-align:left;line-height:1.35}
.sf-win{background:#fff;color:var(--ink);border-radius:1em;overflow:hidden;box-shadow:0 24px 60px rgba(21,15,43,.22),0 0 0 1px rgba(21,15,43,.05);
  opacity:0;transform:translate3d(0,40px,0) scale(.96);transform-origin:left bottom;transition:opacity .8s ease .55s,transform 1.1s cubic-bezier(.16,1,.3,1) .55s}
.is-active .sf-win{opacity:1;transform:none}
.sf-win__bar{display:flex;align-items:center;gap:.35em;padding:.55em .8em;background:#f4f2f8;border-bottom:1px solid #ebe8f2}
.sf-win__bar i{width:.55em;height:.55em;border-radius:50%;background:#ff6159}.sf-win__bar i+i{background:#ffbd2e}.sf-win__bar i+i+i{background:#28c840}
.sf-win__bar span{flex:1;margin:0 2.4em 0 1.2em;background:#fff;border-radius:.5em;padding:.2em .8em;font-size:.72em;color:#8a8597;text-align:center}
.sf-win__nav{display:flex;align-items:center;gap:1.3em;padding:.8em 1.2em;font-size:.72em;color:#5d5874;border-bottom:1px solid #f1eff5}
.sf-win__nav b{font-weight:700;letter-spacing:.14em;color:var(--ink);margin-right:auto;font-size:1.05em}
.sf-win__nav em{display:flex;gap:.9em;margin-left:1em}.sf-win__nav svg{width:1.15em;height:1.15em;color:var(--ink)}
.sf-win__body{display:grid;grid-template-columns:1fr 1.05fr;gap:1.3em;padding:1.2em 1.2em 1.3em}
.sf-win__main{aspect-ratio:1;border-radius:.6em;overflow:hidden;background:#f3efe9}
.sf-win__main img,.sf-win__thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.sf-win__thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:.4em;margin-top:.45em}
.sf-win__thumbs span{aspect-ratio:1;border-radius:.35em;overflow:hidden;background:#f3efe9}.sf-win__thumbs span.on{box-shadow:0 0 0 2px var(--accent)}
.sf-win__info h4{font-family:var(--serif);font-weight:400;font-size:1.35em;line-height:1.15;margin:.1em 0 .25em}
.sf-price{font-weight:600;font-size:1em;margin:0 0 .35em}
.sf-stars{display:flex;align-items:center;gap:.1em;margin:0 0 .55em;color:#f5a623}.sf-stars svg{width:.85em;height:.85em}.sf-stars small{color:#8a8597;font-size:.68em;margin-left:.45em}
.sf-desc{font-size:.74em;color:#5d5874;margin:0 0 .8em}
.sf-buy{display:flex;gap:.5em;margin-bottom:.85em}
.sf-qty{display:flex;align-items:center;gap:.7em;border:1px solid #e3e0ea;border-radius:.45em;padding:.3em .6em;font-size:.72em}.sf-qty i{font-style:normal;color:#8a8597}
.sf-add{flex:1;display:flex;align-items:center;justify-content:center;background:var(--ink);color:#fff;border-radius:.45em;font-size:.72em;font-weight:600;padding:.45em .6em}
.sf-usp{list-style:none;margin:0;padding:0;font-size:.68em;color:#3c3846}
.sf-usp li{display:flex;align-items:center;gap:.6em;margin-top:.45em}.sf-usp svg{width:1.25em;height:1.25em;color:var(--accent);flex-shrink:0}
/* "Improve how customers buy": phone with the store open, cart, ways to get the order and the ready text */
.sb{z-index:4}
.sb-online{left:-2.5rem;top:7%}
.sb-cart{right:-1.5rem;top:4%}
.sb-collect{right:-2.25rem;top:43%}
.sb-delivery{right:-2.25rem;top:calc(43% + 66px)}
.sb-sms{right:-1rem;bottom:5%}
.sb-collect .float__card,.sb-delivery .float__card{width:218px}
.sf-cart{width:clamp(210px,17vw,262px);white-space:normal}
.sf-cart__row{display:flex;gap:11px;width:100%;padding-bottom:10px;border-bottom:1px solid #efedf3}
.sf-cart__img{width:54px;height:54px;border-radius:9px;overflow:hidden;background:#f3efe9;flex-shrink:0}.sf-cart__img img{width:100%;height:100%;object-fit:cover}
.sf-cart__nm{display:flex;flex-direction:column;gap:2px}.sf-cart__nm .sf-qty{align-self:flex-start;font-size:11px;margin-top:3px;padding:2px 8px;gap:9px}
.sf-cart__sub{display:flex;justify-content:space-between;width:100%;font-size:12.5px;margin:9px 0}.sf-cart__sub b{display:inline;font-size:12.5px}
.sf-cart__btn{display:block;width:100%;text-align:center;background:var(--accent);color:#fff;border-radius:9px;padding:8px 10px;font-weight:600;font-size:12.5px}
.sf-sms__h{display:flex!important;justify-content:space-between;width:100%;gap:30px;text-transform:uppercase;letter-spacing:.06em;font-size:10.5px!important}
.sf-sms__h span{display:flex;align-items:center;gap:6px}.sf-sms__h svg{width:15px;height:15px;padding:2px;border-radius:4px;background:#1fa463;color:#fff}.sf-sms__h em{font-style:normal;text-transform:none;letter-spacing:0}
.sf-phone{--pw:clamp(150px,12.5vw,205px);position:absolute;z-index:3;left:-3rem;bottom:-2.75rem;width:var(--pw);font-size:calc(var(--pw) / 15);transform:translate3d(0,var(--py,0px),0);will-change:transform;text-align:left;line-height:1.35}
.sf-ph{background:#fff;color:var(--ink);border-radius:1.9em;border:.45em solid #17151c;overflow:hidden;box-shadow:0 26px 60px rgba(21,15,43,.3);
  opacity:0;transform:translate3d(0,46px,0) rotate(-4deg);transform-origin:left bottom;transition:opacity .8s ease .55s,transform 1.1s cubic-bezier(.16,1,.3,1) .55s}
.is-active .sf-ph{opacity:1;transform:rotate(-4deg)}
.sf-ph__top{display:flex;align-items:center;justify-content:space-between;padding:1.5em 1em .7em;font-size:.72em}
.sf-ph__top b{letter-spacing:.14em;font-size:.95em}.sf-ph__top svg{width:1.3em;height:1.3em}
.sf-ph__menu{display:flex;flex-direction:column;gap:.18em}.sf-ph__menu i{display:block;width:1.1em;height:.12em;background:var(--ink);border-radius:2px}
.sf-ph__img{height:7.2em;background:#f3efe9;overflow:hidden}.sf-ph__img img{width:100%;height:100%;object-fit:cover;object-position:50% 60%}
.sf-ph__body{padding:.9em .9em 1.3em}
.sf-ph__body h4{font-family:var(--serif);font-weight:400;font-size:1.55em;line-height:1.1;margin:0 0 .35em}
.sf-ph__body p{font-size:.7em;color:#5d5874;margin:0 0 .9em}
.sf-ph__btn{display:block;text-align:center;background:var(--ink);color:#fff;border-radius:.5em;padding:.55em;font-size:.72em;font-weight:600}
.sf-ph__body small{display:block;text-align:center;font-size:.62em;color:#8a8597;margin-top:.7em}
.sticky-feature__img:not(.is-active) :is(.scene__photo,.scene__photo img,.float__card,.checks li,.bars i,.sf-win,.sf-ph){transition-duration:0s!important;transition-delay:1s!important}
/* Mobile: one card sits on each photo */
.sticky-feature__mobile .img{position:relative}
.sticky-feature__mobile .float{left:10px;bottom:10px;top:auto;right:auto;text-align:left;transform:scale(.8);transform-origin:left bottom}
.sticky-feature__mobile .float__card{transform:translate3d(0,20px,0);transition-delay:.45s;box-shadow:0 12px 28px rgba(8,5,22,.25)}
.sticky-feature__mobile .in .float__card{transform:none}

/* Case studies: press to zoom out, drag, image parallax, category icon */
.portal{overflow:hidden}
.portal .embla__viewport{margin:0 -6vw;-webkit-user-select:none;user-select:none}
.portal img{-webkit-user-drag:none}
.slide__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,8,20,.05) 0%,rgba(10,8,20,0) 50%,rgba(10,8,20,.7) 100%);pointer-events:none}
.slide__logo{position:absolute;left:22px;bottom:22px;z-index:1;max-width:58%;max-height:52px;width:auto;height:auto;object-fit:contain;object-position:left bottom;filter:drop-shadow(0 2px 10px rgba(0,0,0,.35));pointer-events:none;transition:opacity .2s ease}
.slide:hover .slide__logo{opacity:0}
.portal .slide{flex:0 0 18vw;margin-right:24px;aspect-ratio:auto;overflow:visible;border-radius:0;box-shadow:none}
.slide__frame{position:relative;aspect-ratio:3/4;border-radius:24px;overflow:hidden;box-shadow:0 2px 10px rgba(99,99,99,.18);transition:border-radius .8s cubic-bezier(.16,1,.3,1)}
.portal .slide__name{position:static;background:none;border-radius:0;padding:14px 4px 0;opacity:1!important}
.portal .slide__name span{font-size:16px}
/* Card text under the photo: black title, then the text, then the case study link */
.portal .slide__name b{font-size:20px;line-height:1.3;font-weight:600;color:var(--ink)}
.portal .slide__name span{margin-top:12px;font-weight:400;line-height:1.6;color:var(--text)}
.portal .slide__name .link-arrow{display:inline-flex;margin-top:14px;font-size:15px}
.portal .embla__viewport{transition:transform .8s cubic-bezier(.16,1,.3,1);touch-action:pan-y pinch-zoom}
.portal.is-down .embla__viewport{transform:scale(.9)}
.portal .slide{transition:border-radius .8s cubic-bezier(.16,1,.3,1),box-shadow .8s ease}
.portal.is-down .slide__frame{border-radius:34px}
.portal.is-down .slide__hover,.portal.is-down .slide__icon::after{opacity:0!important}
.slide__icon{position:absolute;top:14px;right:14px;z-index:2;width:46px;height:46px;border-radius:50%;background:#fff;color:var(--accent);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(21,15,43,.2)}
.slide__icon svg{width:21px;height:21px}
.slide__icon img{width:27px;height:auto}
.slide__icon::after{content:attr(data-label);position:absolute;right:0;top:calc(100% + 8px);white-space:nowrap;background:var(--navy);color:#fff;font-size:12px;font-weight:500;padding:4px 10px;border-radius:999px;opacity:0;transform:translateY(-4px);transition:opacity .2s,transform .2s;pointer-events:none}
.slide:hover .slide__icon::after{opacity:1;transform:none}
.drag-cursor{position:fixed;left:0;top:0;z-index:60;pointer-events:none;will-change:transform}
.drag-cursor span{display:flex;align-items:center;justify-content:center;gap:6px;width:88px;height:88px;margin:-44px 0 0 -44px;border-radius:50%;background:linear-gradient(135deg,var(--grad-a),var(--grad-b));color:#fff;font-size:13px;font-weight:600;letter-spacing:.02em;box-shadow:0 10px 30px rgba(112,56,226,.35);transform:scale(0);transition:transform .45s cubic-bezier(.16,1,.3,1)}
.drag-cursor span svg{width:9px;height:9px}
.drag-cursor span svg:first-child{transform:rotate(180deg)}
.drag-cursor.show span{transform:scale(1)}
.drag-cursor.down span{transform:scale(.78)}
@media (hover:hover) and (pointer:fine){.portal.has-cursor .embla__viewport{cursor:none}.portal.has-cursor .pill-btn{cursor:pointer}}
@media (max-width:1024px){.portal .slide{flex-basis:30vw;margin-right:20px}}
@media (min-width:1025px){.portal .slide__name span{font-size:15.5px}.slide__logo{max-height:44px;left:18px;bottom:18px}}
@media (max-width:768px){.portal .embla__viewport{margin:0 -8vw}.portal .slide{flex-basis:74vw;margin-right:16px}.slide__logo{max-height:40px;left:16px;bottom:16px}.slide__icon{width:40px;height:40px}}

@media (prefers-reduced-motion:reduce){
  .js [data-reveal],.js [data-fall],.js [data-split] .w,.js [data-split] .wd > span,.js .scene__photo,.scene__photo img,.float__card,.checks li,.bars i,.sf-win,.sf-ph{transition:none!important;opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;scale:1!important}
  .float__card,.float__ic.spin svg,.live{animation:none!important}
  .portal .embla__viewport{transition:none}
}

/* ============ Theme: Talk to us form (WPForms) ============ */
.talk .form--wp{display:block}
.talk .form--wp .wpforms-container{margin:0!important;padding:0!important}
.talk .form--wp .wpforms-form .wpforms-field{padding:0 0 1rem!important;margin:0!important;max-width:none!important}
.talk .form--wp .wpforms-form .wpforms-field-hidden{display:none!important}
.talk .form--wp .wpforms-form .iti input[type=tel]{padding-left:52px!important}
.talk .form--wp .wpforms-form .wpforms-field-label{font:500 14px/1.4 var(--sans)!important;color:var(--ink)!important;margin:0 0 .35rem!important;padding:0!important}
.talk .form--wp .wpforms-form .wpforms-required-label{color:var(--accent)!important}
.talk .form--wp .wpforms-form input[type=text],.talk .form--wp .wpforms-form input[type=email],.talk .form--wp .wpforms-form input[type=tel],.talk .form--wp .wpforms-form input[type=url],.talk .form--wp .wpforms-form textarea{
  width:100%!important;max-width:100%!important;height:auto!important;font:400 15px/1.5 var(--sans)!important;color:var(--ink)!important;background:#fff!important;
  border:1px solid var(--border)!important;border-radius:12px!important;padding:.8rem 1rem!important;box-shadow:none!important}
.talk .form--wp .wpforms-form textarea{min-height:120px!important;resize:vertical}
.talk .form--wp .wpforms-form input:focus,.talk .form--wp .wpforms-form textarea:focus{outline:2px solid var(--accent)!important;outline-offset:1px;border-color:transparent!important}
.talk .form--wp .wpforms-form .wpforms-field-sublabel,.talk .form--wp .wpforms-form .wpforms-field-description{font-size:13px!important;color:var(--muted)!important}
.talk .form--wp .wpforms-form .wpforms-submit-container{padding:1rem 0 0!important;margin:0!important}
.talk .form--wp .wpforms-form button.wpforms-submit{
  width:100%!important;height:50px!important;padding:0 26px!important;border:0!important;border-radius:50px!important;cursor:pointer;
  background:linear-gradient(to right,var(--grad-a),var(--grad-b))!important;color:#fff!important;font:500 16px/1.5 var(--sans)!important;
  box-shadow:none!important;transition:filter .3s ease!important}
.talk .form--wp .wpforms-form button.wpforms-submit:hover{filter:brightness(1.08)}
.talk .form--wp .wpforms-form label.wpforms-error,.talk .form--wp .wpforms-form em.wpforms-error{font-size:13px!important;color:#c62828!important;margin-top:.3rem!important}
.talk .form--wp .wpforms-form .wpforms-error-container{color:#c62828;font-size:14px}
.talk .form--wp .wpforms-confirmation-container-full,.talk .form--wp .wpforms-confirmation-container{background:#eef8f1!important;border:0!important;color:#1f6b3f!important;border-radius:12px!important;padding:1rem 1.2rem!important;font-size:15px}
.talk .form--wp .note{font-size:13px;color:var(--muted);margin-top:.9rem}

/* ============ Theme: WordPress admin bar for logged-in staff ============ */
/* WordPress pushes the page down by the bar's height; the fixed header and anything pinned under it move down too */
body.admin-bar{--ab:32px}
@media screen and (max-width:782px){body.admin-bar{--ab:46px}}
@media screen and (max-width:600px){body.admin-bar #wpadminbar{position:fixed}}
body.admin-bar .header{top:var(--ab)}
body.admin-bar .submenu-overlay{top:calc(var(--header-h) + var(--ab))}
body.admin-bar .sticky-feature__right{top:calc(var(--header-h) + var(--ab));height:calc(100vh - var(--header-h) - var(--ab))}
@media (max-width:1024px){body.admin-bar .header__menu{top:calc(var(--header-h) + var(--ab));height:calc(100dvh - var(--header-h) - var(--ab))}}

/* ============ Theme: guard against plugin CSS that loads site-wide ============ */
/* Salient's FontAwesome styles anything whose class starts with "icon-" */
.modal .icon-btn{font-family:var(--sans);font-size:13.3333px;line-height:normal}
.modal .modal__close{color:#000}
/* Salient / WPBakery grid rule for .col */
.float__card.col{position:static;width:auto;float:none}
.portal .tags,.modal .tags{margin-top:0}

/* ============ Theme: plain pages (anything not built as a template yet) ============ */
.e26-page{padding-top:calc(var(--header-h) + 4rem);padding-bottom:5rem;max-width:920px}
.e26-page__title{font-size:48px;font-weight:500;letter-spacing:-.02em;line-height:1.1;margin-bottom:1.5rem}
.e26-page__content > * + *{margin-top:1rem}
.e26-page__content h2{font-size:30px;line-height:1.2;margin-top:2.5rem}
.e26-page__content h3{font-size:22px;line-height:1.3;margin-top:2rem}
.e26-page__content a{color:var(--accent);text-decoration:underline}
.e26-page__content img{height:auto;border-radius:16px}
.e26-list article + article{margin-top:2.5rem;padding-top:2.5rem;border-top:1px solid var(--border)}
.e26-list h2{font-size:28px;line-height:1.2;margin-bottom:.5rem}
@media (max-width:767px){.e26-page{padding-top:calc(var(--header-h) + 2.5rem)}.e26-page__title{font-size:34px}}

/* ============ Service page template (templates/service.php) ============ */
/* Reuses the homepage hero, sticky feature panels, chips, float cards, FAQ, logos strip and Talk to us section. */
.svc-h2{font-size:48px;line-height:1.2;font-weight:400}
.svc-head{text-align:center;max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:16px;padding:100px 2rem 40px}
.svc-head p{font-size:18px;color:var(--text)}

/* Hero: the homepage hero, with breadcrumbs and a wider heading and intro */
.svc-hero .hero__content{max-width:1240px}
.svc-hero h1{max-width:1140px}
.svc-hero .hero__content > p{max-width:900px}
.svc-crumbs{display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem;font-size:13px;color:var(--muted);list-style:none;margin:0 0 .2rem;padding:0}
.svc-crumbs li+li::before{content:"/";margin-right:.35rem;color:#c9c5d2}
.svc-crumbs a:hover{color:var(--accent)}

/* Platform logos pointing to WooCommerce */
.svc-from{max-width:1320px;margin:70px auto 0;padding:0 2rem}
.svc-from__inner{border-radius:28px;background:var(--soft);padding:56px 48px}
.svc-from__head{text-align:center;max-width:760px;margin:0 auto 36px}
.svc-from__head h2{font-size:40px;line-height:1.2;font-weight:400}
.svc-from__head p{color:var(--text);margin-top:12px}
.svc-from__map{display:flex;align-items:center;justify-content:center;gap:26px}
.svc-from__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;flex:0 1 820px}
.svc-from__grid li,.svc-from__to{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#fff;border:1px solid var(--border);border-radius:18px;height:104px;padding:14px;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.svc-from__grid li:hover{transform:translateY(-3px);border-color:#d9cdf7;box-shadow:0 12px 26px rgba(21,15,43,.07)}
.svc-from__logo{height:30px;display:flex;align-items:center;justify-content:center}
.svc-from__logo img{height:30px;max-width:128px;width:auto;object-fit:contain}
.svc-from__name{font-size:12.5px;color:var(--muted);text-align:center;line-height:1.3}
.svc-from__arrow{flex-shrink:0;width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,var(--grad-a),var(--grad-b));color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(112,56,226,.3)}
.svc-from__arrow svg{width:22px;height:22px}
.svc-from__to{width:230px;height:222px;flex-shrink:0;border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#7038e2,#a066ee) border-box;box-shadow:0 18px 40px rgba(112,56,226,.14)}
.svc-from__to .svc-from__logo{height:46px}
.svc-from__to .svc-from__logo img{height:46px;max-width:176px}
.svc-from__to .svc-from__name{color:var(--ink);font-weight:600;font-size:14px}
.svc-from__note{text-align:center;color:var(--muted);font-size:14px;margin-top:24px}

/* Signs: short icon cards on a soft panel (same panel as the platform logos) */
.svc-signs{max-width:1320px;margin:70px auto 0;padding:0 2rem}
.svc-signs__inner{border-radius:28px;background:var(--soft);padding:56px 48px}
.svc-signs__head{text-align:center;max-width:760px;margin:0 auto 36px}
.svc-signs__head h2{font-size:40px;line-height:1.2;font-weight:400}
.svc-signs__head p{color:var(--text);margin-top:12px}
.svc-signs__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.svc-sign{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid var(--border);border-radius:18px;padding:24px;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.svc-sign:hover{transform:translateY(-3px);border-color:#d9cdf7;box-shadow:0 12px 26px rgba(21,15,43,.07)}
.svc-sign__ic{width:42px;height:42px;border-radius:12px;background:#f1ebfd;color:var(--accent);display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.svc-sign__ic svg{width:20px;height:20px}
.svc-sign b{font-size:17px;line-height:1.35;color:var(--ink)}
.svc-sign p{color:var(--text);font-size:15px;line-height:1.6}
.svc-signs__note{text-align:center;color:var(--muted);font-size:14px;margin-top:24px}

/* Systems: groups of system cards (label column left, cards right). Linked cards go to that system's page */
.svc-systems__list{max-width:1240px;margin:0 auto;padding:0 2rem;border-top:1px solid var(--border)}
.svc-systems__group{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2.2fr);gap:3rem;padding:36px 0;border-bottom:1px solid var(--border)}
.svc-systems__group.is-plain{grid-template-columns:1fr}
.svc-systems__group.is-plain .svc-systems__grid{grid-template-columns:repeat(4,1fr)}
.svc-systems__group.is-plain .svc-system{flex-direction:column;align-items:flex-start;padding:22px}
.svc-systems__group.is-plain .svc-system__go{margin-top:auto}
.svc-systems__badge{display:block;height:52px;width:auto;margin-bottom:18px}
.svc-systems__label h3{font-family:var(--serif);font-variation-settings:"SOFT" 100;font-weight:400;font-size:28px;line-height:1.2;color:var(--ink)}
.svc-systems__label p{color:var(--text);font-size:15px;line-height:1.6;margin-top:10px;max-width:300px}
.svc-systems__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;align-content:start}
.svc-system{display:flex;align-items:center;gap:16px;height:100%;background:#fff;border:1px solid var(--border);border-radius:18px;padding:16px 18px;color:inherit;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.svc-system__logo{flex-shrink:0;width:56px;height:56px;border-radius:14px;background:var(--soft);display:flex;align-items:center;justify-content:center;color:var(--accent)}
.svc-system__logo img{width:34px;height:34px;object-fit:contain}
.svc-system__logo svg{width:24px;height:24px}
.svc-system__body{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.svc-system__body b{font-size:16.5px;line-height:1.3;color:var(--ink)}
.svc-system__body small{font-size:14px;line-height:1.5;color:var(--text)}
.svc-system__go{flex-shrink:0;width:36px;height:36px;border-radius:50%;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--ink);transition:background .3s ease,border-color .3s ease,color .3s ease,transform .3s ease}
.svc-system__go svg{width:15px;height:15px}
.svc-system.is-link:hover{transform:translateY(-3px);border-color:#d9cdf7;box-shadow:0 12px 26px rgba(21,15,43,.07)}
.svc-system.is-link:hover .svc-system__go{background:linear-gradient(135deg,var(--grad-a),var(--grad-b));border-color:transparent;color:#fff;transform:translateX(3px)}
.svc-systems[id]{scroll-margin-top:calc(var(--header-h,72px) + 12px)}
.svc-system__price{display:inline-block;margin-top:8px;font-size:13px;font-weight:600;color:var(--accent);background:#f3eefd;border-radius:999px;padding:3px 10px;width:fit-content}
.svc-system__price.is-free{color:#1d7a4a;background:#e6f5ec}
.svc-systems__note{text-align:center;color:var(--muted);font-size:14px;margin:24px auto 0;max-width:760px;padding:0 2rem}

/* Feature panels: the homepage sticky section plus a sticky tab bar */
.svc-tabs{--tabs-h:58px}
.svc-tabs .jobs-head{padding-bottom:40px}
/* Phones and tablets: .jobs-head sets padding 0 at the sides, which cancels .wrap; give section headings the same 16px gutter as the panels (Ben 2026-10-12) */
@media (max-width:1023px){.jobs-head{padding-left:16px;padding-right:16px}}
.svc-tabs__nav{position:sticky;top:calc(var(--header-h) + var(--ab,0px));z-index:20;height:var(--tabs-h);background:#fff;border-top:1px solid var(--grey);border-bottom:1px solid var(--border);transition:box-shadow .3s ease}
.svc-tabs__nav.is-stuck{box-shadow:0 10px 24px rgba(21,15,43,.06)}
.svc-tabs__track{display:flex;justify-content:center;gap:2.25rem;height:100%;max-width:1320px;margin:0 auto;padding:0 2rem;overflow-x:auto;scrollbar-width:none}
.svc-tabs__track::-webkit-scrollbar{display:none}
.svc-tabs__track a{position:relative;flex-shrink:0;display:flex;align-items:center;font-size:15px;font-weight:500;color:#5c5866;white-space:nowrap;transition:color .25s ease}
.svc-tabs__track a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.16,1,.3,1)}
.svc-tabs__track a:hover{color:var(--ink)}
.svc-tabs__track a.is-active{color:var(--accent)}
.svc-tabs__track a.is-active::after{transform:scaleX(1)}
.svc-sticky .sticky-feature__panel{height:auto;min-height:calc(100vh - var(--header-h) - var(--ab,0px) - var(--tabs-h));padding:4.5rem 4rem;scroll-margin-top:calc(var(--header-h) + var(--ab,0px) + var(--tabs-h))}
.svc-sticky .sticky-feature__panel h3{font-size:42px;font-weight:600;letter-spacing:-.02em;line-height:1.1}
.svc-sticky .sticky-feature__right{top:calc(var(--header-h) + var(--ab,0px) + var(--tabs-h));height:calc(100vh - var(--header-h) - var(--ab,0px) - var(--tabs-h))}
.svc-sticky .scene__photo{height:auto;aspect-ratio:var(--r,1.6)} /* each tab photo keeps its own shape (--r from tabs.php: image.ratio or the -WxH in the file name), rescaled not cropped (Adrian 2026-10-20) */
.svc-panel-img{display:none}

/* Accordion inside a panel */
.svc-acc{width:100%;max-width:560px;margin-top:.4rem;border-top:1px solid #e4e1ea}
.svc-acc__item{border-bottom:1px solid #e4e1ea}
.svc-acc__btn{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;padding:1rem 0;background:none;border:0;cursor:pointer;text-align:left;font:600 16px/1.4 var(--sans);color:var(--ink)}
.svc-acc__btn:hover{color:var(--accent)}
.svc-acc__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.16,1,.3,1)}
.svc-acc__body > div{overflow:hidden}
.svc-acc__body p{color:var(--text);padding-bottom:1.1rem;font-size:15.5px}
.svc-acc__item.is-open .svc-acc__body{grid-template-rows:1fr}

/* Client story card at the end of a panel */
.svc-story{display:flex;align-items:center;gap:16px;width:100%;max-width:560px;margin-top:1.1rem;background:#fff;border:1px solid #e4e1ea;border-radius:18px;padding:14px 18px 14px 14px;color:inherit;transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease}
.svc-story:hover{border-color:#c9b5f7;box-shadow:0 12px 26px rgba(112,56,226,.10);transform:translateY(-2px)}
.svc-story__logo{flex-shrink:0;width:96px;height:66px;border-radius:12px;background:#15121c;display:flex;align-items:center;justify-content:center;padding:10px}
.svc-story__logo img{max-width:100%;max-height:100%;object-fit:contain}
.svc-story__body{display:flex;flex-direction:column;gap:3px;min-width:0}
.svc-story__quote{font-family:var(--serif);font-size:16.5px;line-height:1.45;color:#2b2733}
.svc-story__result{font-weight:600;font-size:15.5px;line-height:1.4;color:var(--ink)}
.svc-story small{font-size:13px;color:var(--muted);line-height:1.45}
.svc-story .link-arrow{margin-top:.25rem;font-size:14px}

/* Projects: tall brand cards in a grid */
.svc-projects__grid{display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:24px;max-width:1320px;margin:0 auto;padding:0 2rem}
.svc-proj{display:flex;flex-direction:column;gap:1rem;color:inherit}
.svc-proj__frame{display:block;position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4/5;background:#111}
.svc-proj__frame img.bg{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.svc-proj__frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.6) 100%)}
.svc-proj__logo{position:absolute;left:1.5rem;bottom:1.4rem;z-index:1;max-width:58%;max-height:56px;width:auto;height:auto}
.svc-proj__logo.is-tall{max-height:84px;max-width:42%}
.svc-proj__tag{position:absolute;left:1.1rem;top:1.1rem;z-index:1;background:#fff;color:var(--ink);border-radius:999px;padding:6px 13px;font-size:13px;font-weight:600}
.svc-proj__result{position:absolute;left:1.1rem;top:3.5rem;z-index:1;background:linear-gradient(135deg,var(--grad-a),var(--grad-b));color:#fff;border-radius:999px;padding:6px 13px;font-size:13px;font-weight:600}
.svc-proj:hover .svc-proj__frame img.bg{transform:scale(1.05)}
.svc-proj b{font-size:18px}
.svc-proj p{color:var(--text);font-size:15px;line-height:1.6}
.svc-proj .link-arrow{margin-top:0}
/* Fewer than three cards: keep each card the same size instead of stretching them */
.svc-projects__grid{max-width:calc(var(--n,3) * 440px + 4rem)}

/* Response times: one column per priority level, with a large serif figure */
.svc-levels__grid{list-style:none;display:grid;grid-template-columns:repeat(var(--n,4),1fr);max-width:1320px;margin:0 auto;padding:0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.svc-levels{padding:0 2rem}
.svc-level{display:flex;flex-direction:column;gap:18px;padding:36px 30px 40px;border-left:1px solid var(--border);transition:background .35s ease}
.svc-level:first-child{border-left:0}
.svc-level:hover{background:var(--soft)}
.svc-level__tag{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--ink);border:1px solid var(--border);border-radius:999px;padding:5px 12px 5px 10px;background:#fff}
.svc-level__tag i{width:8px;height:8px;border-radius:50%;background:#b9b4c4}
.svc-level__tag.is-critical i{background:#e5484d;box-shadow:0 0 0 4px rgba(229,72,77,.14)}
.svc-level__tag.is-high i{background:#f08c2e}
.svc-level__tag.is-medium i{background:var(--accent)}
.svc-level__time{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:12px;row-gap:6px}
.svc-level__time b{font-size:92px;line-height:.9;font-weight:400;font-variation-settings:"SOFT" 100;color:var(--ink);transition:color .35s ease}
.svc-level__time small{font-size:15px;color:var(--muted);line-height:1.3;max-width:90px}
.svc-level:hover .svc-level__time b{color:var(--accent)}
.svc-level p{color:var(--text);font-size:15.5px;line-height:1.6}
.svc-levels__note{max-width:760px;margin:22px auto 0;text-align:center;color:var(--muted);font-size:14px}

/* Steps: a warm cream editorial band. Heading on the left (sticky), numbered steps on the right. The step in the
   middle of the screen lights up (outlined number fills, text brightens) and a thin rail fills as you scroll. */
.svc-steps{max-width:1320px;margin:100px auto 0;padding:0 2rem}
.svc-steps__inner{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:5rem;border-radius:28px;padding:96px 80px;color:#1d1a17;background:#f5f0e8}
.svc-steps__head{position:sticky;top:calc(var(--header-h) + var(--ab,0px) + 60px);align-self:start;display:flex;flex-direction:column;gap:1rem}
.svc-steps__head .eyebrow{color:var(--accent)}
.svc-steps__head h2{font-size:52px;line-height:1.1;font-weight:400;color:#1d1a17}
.svc-steps__head p{color:#57514a;font-size:17px;max-width:440px}
.svc-steps__head .svc-steps__note{display:inline-flex;align-self:flex-start;margin-top:.4rem;padding:8px 15px;border:1px solid #d9cfc2;border-radius:999px;font-size:14px;color:#1d1a17;background:#fff}
.svc-steps__col{position:relative;padding-left:40px}
.svc-steps__rail{position:absolute;left:0;top:0;bottom:0;width:1px;background:#e2d8cb}
.svc-steps__rail span{position:absolute;left:0;top:0;width:1px;height:100%;background:linear-gradient(180deg,#a066ee,#7038e2);transform:scaleY(var(--p,0));transform-origin:top;transition:transform .2s linear}
.svc-steps__list{list-style:none;margin:0;padding:0}
.svc-step{display:grid;grid-template-columns:112px minmax(0,1fr);gap:1.25rem;align-items:start;padding:36px 0;border-top:1px solid #e4dbcf}
.svc-step:first-child{border-top:0;padding-top:4px}
.svc-step__num{font-size:76px;line-height:.85;font-weight:400;font-variation-settings:"SOFT" 100;color:transparent;-webkit-text-stroke:1px #c4b6a4;transition:color .6s ease,-webkit-text-stroke-color .6s ease}
.svc-step b{display:block;font-size:22px;font-weight:600;line-height:1.3;margin:.35rem 0 .5rem;color:#8a8076;transition:color .5s ease}
.svc-step p{color:#a2988d;font-size:16px;line-height:1.65;max-width:520px;transition:color .5s ease}
.svc-step.is-active .svc-step__num,.svc-step:hover .svc-step__num{color:#1d1a17;-webkit-text-stroke-color:transparent}
.svc-step.is-active b,.svc-step:hover b{color:#1d1a17}
.svc-step.is-active p,.svc-step:hover p{color:#3d3832}

/* CTA band */
.svc-cta{max-width:1100px;margin:90px auto 0;padding:0 2rem}
.svc-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:2rem;border-radius:24px;padding:2.2rem 2.5rem;background:radial-gradient(circle at 100% 0%,rgba(160,102,238,.14) 0,rgba(160,102,238,0) 45%),var(--soft);border:1px solid #ece8f3;color:var(--ink)}
.svc-cta h3{font-size:28px;font-weight:500;line-height:1.2;margin-bottom:.5rem}
.svc-cta p{color:var(--text);max-width:640px}
.svc-cta .btn{flex-shrink:0}

/* Related services: a list of large rows (photo, title, line, arrow) beside a sticky heading */
.svc-related{max-width:1240px;margin:100px auto 0;padding:0 2rem}
.svc-related__inner{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,2fr);gap:3.5rem;align-items:start}
.svc-related__head{position:sticky;top:calc(var(--header-h) + var(--ab,0px) + 40px);padding-top:1rem}
.svc-related__head h2{font-size:44px;line-height:1.15;font-weight:400}
.svc-related__head p{color:var(--text);margin-top:14px}
.svc-related__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--border)}
.svc-related__list li{border-bottom:1px solid var(--border)}
.svc-related__list a{display:grid;grid-template-columns:136px minmax(0,1fr) 52px;align-items:center;gap:1.6rem;padding:1.15rem .9rem;margin:0 -.9rem;border-radius:20px;color:inherit;transition:background .3s ease}
.svc-related__img{display:block;width:136px;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--grey)}
.svc-related__img img{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.16,1,.3,1)}
.svc-related__text{display:flex;flex-direction:column;gap:.3rem}
.svc-related__text b{font-family:var(--serif);font-variation-settings:"SOFT" 100;font-weight:400;font-size:27px;line-height:1.2;color:var(--ink)}
.svc-related__text span{color:var(--text);font-size:15px;line-height:1.55}
.svc-related__go{width:50px;height:50px;border-radius:50%;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--ink);transition:background .3s ease,border-color .3s ease,color .3s ease,transform .3s ease}
.svc-related__go svg{width:18px;height:18px}
.svc-related__list a:hover{background:var(--soft)}
.svc-related__list a:hover .svc-related__img img{transform:scale(1.08)}
.svc-related__list a:hover .svc-related__go{background:linear-gradient(135deg,var(--grad-a),var(--grad-b));border-color:transparent;color:#fff;transform:translateX(4px)}

@media (max-width:1100px){
  .svc-from__map{flex-direction:column}
  .svc-from__grid{flex:none;width:100%}
  .svc-from__arrow{transform:rotate(90deg)}
  .svc-from__to{width:100%;max-width:420px;height:120px}
}
@media (max-width:1024px){
  .svc-steps__inner{grid-template-columns:1fr;gap:2.5rem;padding:64px 40px}
  .svc-steps__head{position:static}
  .svc-tabs__track{justify-content:flex-start}
  .svc-sticky .sticky-feature__left{display:block;width:100%;background:none}
  .svc-sticky .sticky-feature__right{display:none}
  .svc-sticky .sticky-feature__panel{min-height:0;max-width:none;margin:0;padding:3rem 2rem 1rem}
  .svc-sticky .sticky-feature__panel h3{font-size:30px}
  .svc-panel-img{display:block;position:relative;border-radius:18px;overflow:hidden;margin-bottom:1rem;width:100%}
  .svc-panel-img img{width:100%;height:auto;aspect-ratio:var(--r,1.6);object-fit:cover}
  .svc-panel-img .float{left:12px;bottom:12px;top:auto;right:auto;transform:scale(.85);transform-origin:left bottom}
  .svc-panel-img .float.f2{display:none}
  .svc-projects__grid{grid-template-columns:1fr 1fr}
  .svc-signs__grid{grid-template-columns:1fr 1fr}
  .svc-systems__group{grid-template-columns:1fr;gap:1.25rem}
  .svc-systems__label p{max-width:none}
  .svc-systems__group.is-plain .svc-systems__grid{grid-template-columns:1fr 1fr}
  .svc-levels__grid{grid-template-columns:1fr 1fr}
  .svc-level:nth-child(odd){border-left:0}
  .svc-level:nth-child(n+3){border-top:1px solid var(--border)}
  .svc-cta__inner{flex-direction:column;align-items:flex-start}
  .svc-related__inner{grid-template-columns:1fr;gap:1.5rem}
  .svc-related__head{position:static;text-align:center}
}
@media (max-width:767px){
  .svc-h2{font-size:34px}
  .svc-head{padding:70px 1rem 28px}
  .svc-head p{font-size:16px}
  .svc-crumbs{font-size:12px}
  .svc-from{padding:0;margin-top:40px}
  .svc-from__inner{border-radius:0;padding:44px 1rem}
  .svc-from__head h2{font-size:30px}
  .svc-from__grid{grid-template-columns:1fr 1fr;gap:10px}
  .svc-from__grid li{height:92px}
  .svc-from__logo img{max-width:112px;height:26px}
  .svc-systems__list{padding:0 1rem}
  .svc-systems__group{padding:28px 0}
  .svc-systems__label h3{font-size:24px}
  .svc-systems__grid,.svc-systems__group.is-plain .svc-systems__grid{grid-template-columns:1fr;gap:10px}
  .svc-systems__group.is-plain .svc-system{flex-direction:row;align-items:center;padding:14px}
  .svc-systems__group.is-plain .svc-system__go{margin-top:0}
  .svc-system{padding:14px}
  .svc-system__logo{width:48px;height:48px}
  .svc-system__logo img{width:30px;height:30px}
  .svc-signs{padding:0;margin-top:40px}
  .svc-signs__inner{border-radius:0;padding:44px 1rem}
  .svc-signs__head h2{font-size:30px}
  .svc-signs__grid{grid-template-columns:1fr;gap:10px}
  .svc-sign{padding:18px;flex-direction:row;flex-wrap:wrap;column-gap:14px;row-gap:6px}
  .svc-sign__ic{margin:0}
  .svc-sign b{flex:1;align-self:center}
  .svc-sign p{flex-basis:100%}
  .svc-tabs__track{padding:0 1rem;gap:1.5rem}
  .svc-sticky .sticky-feature__panel{padding:2.5rem 1rem .5rem}
  .svc-sticky .sticky-feature__panel h3{font-size:27px}
  .svc-story{padding:12px}
  .svc-story__logo{width:76px;height:56px}
  .svc-projects__grid{grid-template-columns:1fr;padding:0 1rem}
  .svc-levels{padding:0 1rem}
  .svc-level{padding:26px 16px 28px;gap:14px}
  .svc-level__time{flex-direction:column;gap:4px}
  .svc-level__time b{font-size:60px}
  .svc-level p{font-size:14.5px}
  .svc-steps{padding:0;margin-top:70px}
  .svc-steps__inner{border-radius:0;padding:60px 1.25rem}
  .svc-steps__head h2{font-size:36px}
  .svc-steps__col{padding-left:22px}
  .svc-step{grid-template-columns:62px minmax(0,1fr);gap:.9rem;padding:26px 0}
  .svc-step__num{font-size:46px}
  .svc-step b{font-size:19px;margin-top:.15rem}
  .svc-step p{font-size:15px}
  .svc-cta{padding:0 1rem;margin-top:60px}
  .svc-cta__inner{padding:1.75rem 1.5rem}
  .svc-cta .btn{width:100%}
  .svc-related{padding:0 1rem;margin-top:70px}
  .svc-related__head h2{font-size:32px}
  .svc-related__list a{grid-template-columns:84px minmax(0,1fr) 38px;gap:.9rem;padding:1rem .5rem;margin:0 -.5rem}
  .svc-related__img{width:84px}
  .svc-related__text b{font-size:19px}
  .svc-related__text span{font-size:14px}
  .svc-related__go{width:38px;height:38px}
}
@media (prefers-reduced-motion:reduce){
  .svc-acc__body,.svc-proj__frame img.bg,.svc-related__img img{transition:none!important}
  .svc-steps__rail span{transition:none!important}
}

/* Team (About page) */
.svc-team__grid{list-style:none;margin:0 auto;padding:0 2rem;max-width:1180px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 28px}
.svc-person{display:flex;flex-direction:column;gap:4px}
.svc-person__photo{display:block;border-radius:20px;overflow:hidden;background:#ddd;margin-bottom:14px}
.svc-person__photo img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;filter:grayscale(1);transition:transform .6s cubic-bezier(.16,1,.3,1),filter .4s ease}
.svc-person:hover .svc-person__photo img{transform:scale(1.03);filter:grayscale(0)}
.svc-person__name{font-family:var(--serif);font-size:24px;font-weight:400;line-height:1.2;color:var(--ink,#1d1a17)}
.svc-person__role{font-size:14px;font-weight:600;color:var(--accent)}
.svc-person p{font-size:15px;line-height:1.6;color:var(--text);margin-top:8px}
/* One customer quote */
.svc-quote{max-width:1320px;margin:90px auto 0;padding:0 2rem}
.svc-quote__inner{margin:0;border-radius:28px;background:var(--soft);padding:64px 48px;text-align:center}
.svc-quote blockquote{margin:0 auto;max-width:900px;font-size:32px;line-height:1.35;font-weight:400;color:var(--ink,#1d1a17)}
.svc-quote figcaption{margin-top:24px;display:flex;flex-direction:column;align-items:center;gap:4px}
.svc-quote figcaption b{font-size:16px;font-weight:600}
.svc-quote__photo{width:72px;height:72px;border-radius:50%;object-fit:cover;margin-bottom:10px;box-shadow:0 0 0 4px #fff,0 12px 26px -10px rgba(21,15,43,.35)}
.svc-quote figcaption span{font-size:14px;color:var(--muted)}
.svc-quote .link-arrow{margin-top:10px}
@media (max-width:1024px){.svc-team__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){
  .svc-team__grid{padding:0 1rem;gap:34px 14px}
  .svc-person__name{font-size:20px}
  .svc-person__role{font-size:13px}
  .svc-person p{font-size:14px}
  .svc-quote{padding:0;margin-top:60px}
  .svc-quote__inner{border-radius:0;padding:48px 1.25rem}
  .svc-quote blockquote{font-size:23px}
}
/* Wide logos (partner badges) in system cards */
.svc-systems.has-wide-logos .svc-system__logo{width:116px;height:64px;padding:8px}
.svc-systems.has-wide-logos .svc-system__logo img{width:100%;height:100%;object-fit:contain}
@media (max-width:767px){.svc-systems.has-wide-logos .svc-system__logo{width:92px;height:56px}}
/* Contact options (Contact page) */
.svc-contact{max-width:1320px;margin:56px auto 0;padding:0 2rem}
.svc-contact__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.svc-contact__card{display:flex;flex-direction:column;gap:4px;height:100%;background:#fff;border:1px solid var(--border);border-radius:20px;padding:24px 22px;color:inherit;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.svc-contact__card:hover{border-color:#cdbcf3;box-shadow:0 14px 34px -18px rgba(70,40,140,.35);transform:translateY(-2px)}
.svc-contact__ic{width:48px;height:48px;border-radius:14px;background:var(--soft);color:var(--accent);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.svc-contact__ic svg{width:22px;height:22px}
.svc-contact__card small{font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.svc-contact__card b{font-size:18px;font-weight:600;color:var(--ink,#1d1a17);overflow-wrap:anywhere}
.svc-contact__text{font-size:14.5px;color:var(--text);margin-top:4px}
@media (max-width:1100px){.svc-contact__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){.svc-contact{padding:0 1rem}.svc-contact__grid{grid-template-columns:1fr;gap:12px}.svc-contact__card{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:14px;padding:18px}.svc-contact__card > *{grid-column:2}.svc-contact__ic{grid-column:1;grid-row:1/span 3;margin:0}}
/* Featured case studies (Our work) */
.svc-showcase__list{max-width:1320px;margin:0 auto;padding:0 2rem;display:flex;flex-direction:column;gap:110px}
.svc-case{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:72px;align-items:center}
.svc-case.is-flip .svc-case__media{order:2}
.svc-case__media{position:relative;display:block;border-radius:26px;overflow:hidden;aspect-ratio:4/3;background:#eee;box-shadow:0 30px 60px -36px rgba(30,20,60,.45)}
.svc-case__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.svc-case__media:hover img{transform:scale(1.04)}
.svc-case__stat{position:absolute;left:22px;bottom:22px;display:flex;align-items:baseline;gap:10px;background:#fff;border-radius:18px;padding:12px 18px;box-shadow:0 14px 34px -14px rgba(20,12,40,.4)}
.svc-case__stat b{font-size:40px;line-height:1;font-weight:400;background:linear-gradient(135deg,var(--grad-a),var(--grad-b));-webkit-background-clip:text;background-clip:text;color:transparent}
.svc-case__stat small{font-size:13.5px;line-height:1.3;color:var(--text);max-width:150px}
.svc-case__client{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:14px;margin-bottom:14px}
.svc-case__client b{font-weight:700;color:var(--accent);letter-spacing:.02em}
.svc-case__client span{color:var(--muted)}
.svc-case__client span::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:currentColor;margin:0 10px 3px 0;opacity:.6}
.svc-case h3{font-size:34px;line-height:1.2;font-weight:400;color:var(--ink,#1d1a17)}
.svc-case__text{margin-top:16px;font-size:16.5px;line-height:1.65;color:var(--text)}
.svc-case__tags{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.svc-case__tags li{font-size:13px;font-weight:600;background:var(--soft);border-radius:999px;padding:6px 12px;color:var(--ink,#1d1a17)}
.svc-case__quote{margin:24px 0 0;padding:4px 0 4px 18px;border-left:3px solid var(--accent);font-family:var(--serif);font-size:18px;line-height:1.5;color:#2b2733}
.svc-case__quote cite{display:block;margin-top:8px;font-family:inherit;font-style:normal;font-size:13.5px;font-weight:600;color:var(--muted);font-family:var(--sans,inherit)}
.svc-case__ctas{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:28px}
/* All projects with filters (Our work) */
.svc-work{scroll-margin-top:80px}
.svc-work__filters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:1100px;margin:0 auto 40px;padding:0 2rem}
.svc-work__chip{appearance:none;border:1px solid var(--border);background:#fff;color:var(--ink,#1d1a17);border-radius:999px;padding:10px 16px;font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.svc-work__chip small{font-size:12px;font-weight:600;opacity:.55;margin-left:3px}
.svc-work__chip:hover{border-color:#cdbcf3}
.svc-work__chip.is-on{background:var(--ink,#1d1a17);border-color:var(--ink,#1d1a17);color:#fff}
.svc-work__grid{list-style:none;margin:0 auto;padding:0 2rem;max-width:1320px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 22px}
.svc-work__item[hidden]{display:none}
.svc-work__item.pop{animation:svcWorkPop .5s cubic-bezier(.16,1,.3,1) both}
@keyframes svcWorkPop{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.svc-work__item .svc-proj{gap:.7rem;height:100%}
.svc-work__item .svc-proj__logo{max-height:46px;left:1.2rem;bottom:1.1rem}
.svc-work__item .svc-proj__logo.is-tall{max-height:70px}
.svc-proj__result.is-top{top:1.1rem}
.svc-work__meta{display:flex;flex-direction:column;gap:2px}
.svc-work__meta b{font-size:17px}
.svc-work__meta small{font-size:13px;color:var(--muted)}
.svc-work__item p{font-size:14.5px;line-height:1.55;color:var(--text)}
.svc-work__tags{display:flex;flex-wrap:wrap;gap:6px}
.svc-work__tags span{font-size:12px;font-weight:600;background:var(--soft);border-radius:999px;padding:4px 10px}
.svc-work__item .link-arrow{margin-top:auto;font-size:14px}
@media (max-width:1200px){.svc-work__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1024px){.svc-case{grid-template-columns:1fr;gap:28px}.svc-case.is-flip .svc-case__media{order:0}.svc-showcase__list{gap:80px}}
@media (max-width:900px){.svc-work__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){
  .svc-showcase__list{padding:0 1rem;gap:64px}
  .svc-case h3{font-size:26px}
  .svc-case__text{font-size:15.5px}
  .svc-case__stat{left:12px;bottom:12px;padding:10px 14px}
  .svc-case__stat b{font-size:30px}
  .svc-case__ctas .btn{width:100%}
  .svc-work__filters{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding:2px 1rem 6px;margin-bottom:26px;scrollbar-width:none}
  .svc-work__filters::-webkit-scrollbar{display:none}
  .svc-work__chip{flex:none}
  .svc-work__grid{padding:0 1rem;gap:28px 12px}
  .svc-work__item p,.svc-work__tags{display:none}
  .svc-work__item .svc-proj__logo{max-height:30px;left:.8rem;bottom:.8rem;max-width:70%}
  .svc-work__item .svc-proj__logo.is-tall{max-height:46px}
  .svc-work__meta b{font-size:15px}
  .svc-work__item .svc-proj__frame{border-radius:16px}
  .svc-proj__result.is-top{top:.7rem;left:.7rem;font-size:11.5px;padding:5px 10px}
}
@media (prefers-reduced-motion:reduce){.svc-work__item.pop{animation:none}.svc-case__media img{transition:none}}
/* Hero without a photo (Our work): only as tall as its content */
.svc-hero.is-text{height:auto;min-height:0;padding-bottom:20px}
.svc-hero.is-text + .svc-showcase .svc-head{padding-top:70px}
/* Our work: "More projects" with site mockups (landscape cards) */
.svc-work__more{max-width:1320px;margin:80px auto 0}
.svc-work__more[hidden]{display:none}
.svc-work__more h3{font-size:30px;font-weight:400;line-height:1.2;padding:0 2rem;margin-bottom:24px}
.svc-proj.is-shot .svc-proj__frame{aspect-ratio:4/3;background:#f3efe8;border-radius:18px}
.svc-proj.is-shot .svc-proj__frame::after{display:none}
@media (max-width:767px){.svc-work__more{margin-top:56px}.svc-work__more h3{font-size:24px;padding:0 1rem;margin-bottom:16px}.svc-proj.is-shot .svc-proj__frame{border-radius:12px}}
/* Links inside split-screen panel text */
.svc-acc__body a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;font-weight:600}
/* Our work cards: photo and text on one tinted panel so they read as a single card */
.svc-work__item .svc-proj{background:#f3efe9;border-radius:22px;padding:8px 8px 20px;transition:background .25s,box-shadow .25s,transform .25s}
.svc-work__item .svc-proj:hover{background:#ece6dc;box-shadow:0 18px 40px -26px rgba(40,25,70,.45);transform:translateY(-2px)}
.svc-work__item .svc-proj__frame{border-radius:16px}
.svc-work__item .svc-proj > :not(.svc-proj__frame){padding:0 10px}
.svc-work__item .svc-work__meta{padding-top:6px}
@media (max-width:767px){.svc-work__item .svc-proj{border-radius:16px;padding:5px 5px 14px}.svc-work__item .svc-proj__frame{border-radius:12px}.svc-work__item .svc-proj > :not(.svc-proj__frame){padding:0 6px}}
.svc-work__item .svc-work__tags span{background:#fff}
/* Split-screen rows with a system logo and a link (integrations hub) */
.svc-acc__name{display:flex;align-items:center;gap:14px;text-align:left}
.svc-acc__logo{flex:none;width:46px;height:46px;border-radius:12px;background:#fff;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--accent)}
.svc-acc__logo img{max-width:32px;max-height:30px;width:auto;height:auto;object-fit:contain}
.svc-acc__logo svg{width:22px;height:22px}
.svc-acc__link{display:inline-flex;margin:-.4rem 0 1.2rem;font-size:14.5px}
@media (max-width:767px){.svc-acc__logo{width:40px;height:40px;border-radius:10px}.svc-acc__logo img{max-width:28px;max-height:26px}}
/* Contact options beside the enquiry form (Contact page) */
.talk-contacts{list-style:none;margin:1.75rem 0 0;padding:0;display:grid;gap:10px;max-width:520px}
.talk-contacts a{display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:16px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#fff;transition:background .2s,border-color .2s}
.talk-contacts a:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3)}
.talk-contacts__ic{flex:none;width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center}
.talk-contacts__ic svg{width:20px;height:20px}
.talk-contacts small{display:block;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:rgba(255,255,255,.65)}
.talk-contacts b{display:block;font-size:17px;font-weight:600;overflow-wrap:anywhere}
.talk-book{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:1.5rem}
.talk-book .btn span{display:inline-flex;align-items:center;gap:10px}
.talk-book .btn svg{width:18px;height:18px}
.talk-book small{font-size:13.5px;color:rgba(255,255,255,.7)}
@media (max-width:767px){.talk-book .btn{width:100%}.talk-contacts b{font-size:16px}}
/* Compact hero (Contact): copy, then the photo as a short rounded strip */
.svc-hero.is-compact{height:auto;min-height:0;display:flex;flex-direction:column;padding-bottom:0;position:relative;z-index:2;overflow:visible}
.svc-hero.is-compact::after{display:none}
.svc-hero.is-compact .hero__content{order:1;padding-top:2.25rem;padding-bottom:0;gap:.9rem}
.svc-hero.is-compact h1{font-size:46px}
.svc-hero.is-compact picture{order:2;position:relative;display:block;width:calc(100% - 4rem);max-width:1320px;height:var(--compact-h,260px);margin:2.25rem auto 0;border-radius:26px;overflow:hidden}
.svc-hero.is-compact picture::before{display:none}
.svc-hero.is-compact picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.svc-hero.is-compact + .talk{margin-top:-130px;padding-top:130px}
@media (max-width:767px){.svc-hero.is-compact h1{font-size:32px}.svc-hero.is-compact picture{width:calc(100% - 2rem);height:var(--compact-h-m,150px);border-radius:18px;margin-top:1.5rem}.svc-hero.is-compact + .talk{margin-top:-70px;padding-top:70px}}
.svc-work__more h3{text-align:center;font-size:36px;margin-bottom:32px}
@media (max-width:767px){.svc-work__more h3{font-size:28px;margin-bottom:20px}}
/* Hero logos: the systems or partners a page is about */
.svc-hero__logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin-bottom:.25rem}
.svc-hero__logo{display:flex;align-items:center;justify-content:center;height:58px;min-width:96px;padding:10px 18px;background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:0 10px 26px -18px rgba(30,20,60,.4)}
.svc-hero__logo img{height:30px;max-width:150px;width:auto;object-fit:contain}
.svc-hero__logo.is-square img{height:38px}
.svc-hero__logo.is-badge img{height:auto}
.svc-hero__logo.is-badge{padding:8px 12px}
.svc-hero__logo.is-badge img{max-height:40px;max-width:150px}
.svc-hero__logo.is-dark{background:#1d1a24;border-color:#1d1a24}
.svc-hero__join{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--grad-a),var(--grad-b));color:#fff;display:flex;align-items:center;justify-content:center;flex:none}
.svc-hero__join svg{width:16px;height:16px}
@media (max-width:767px){.svc-hero__logo{height:48px;min-width:80px;padding:8px 12px;border-radius:13px}.svc-hero__logo img{height:24px;max-width:118px}.svc-hero__logo.is-square img{height:30px}.svc-hero__logo.is-badge img{max-height:32px}.svc-hero__join{width:28px;height:28px}.svc-hero__logos{gap:8px}}
/* Partner badge in the sticky tab bar, lined up under the header's "Call us" (position set in service.js) */
.svc-tabs__badge{position:absolute;top:50%;left:var(--badge-x,auto);right:auto;transform:translateY(-50%);display:flex;align-items:center}
.svc-tabs__badge img{height:34px;width:auto}
@media (max-width:1100px){.svc-tabs__badge{display:none}}
/* Projects carousel on service pages (homepage portal styles) */
.svc-projects + .svc-portal{margin-top:-1rem}
.svc-portal .slide__frame{display:block;color:inherit}
.svc-portal .slide__logo.is-tall{max-height:72px;max-width:40%}
.svc-portal .dot[hidden],.svc-portal.is-static .dots{display:none}
.svc-portal.is-static.has-cursor .embla__viewport{cursor:default}
/* Scene hero (Migration): a photo with its own empty wall where the copy sits, no white fade. The laptop takes the space under the copy,
   25.2% of the image width up from the bottom (Migration image), so the copy is padded by that much. Phones: the wall runs behind the copy and the laptop sits under it. */
.svc-hero.is-scene::after{display:none}
.svc-hero.is-scene picture img{object-position:center bottom}
@media (min-width:1024px){.svc-hero.is-scene{height:auto;min-height:0}.svc-hero.is-scene .hero__content{padding-bottom:calc(var(--scene-gap,25.2vw) + 1.5rem)}}
@media (max-width:1023px){.svc-hero.is-scene{background:var(--scene-wall,#e8e9e4)}.svc-hero.is-scene picture::before{display:none}.svc-hero.is-scene picture{overflow:hidden;margin-top:.75rem;height:var(--scene-band-h,min(560px,calc(var(--scene-gap,25.2vw) * var(--scene-band-k,2.3) + 1.25rem)));-webkit-mask-image:linear-gradient(transparent,#000 28px);mask-image:linear-gradient(transparent,#000 28px)}.svc-hero.is-scene picture img{width:var(--scene-band-w,230%);max-width:none;height:auto;left:var(--scene-band-left,-65%);top:auto;bottom:0}}
/* Breadcrumbs: a slim line at the bottom of the page (parts/service/crumbs.php), not in the hero */
.svc-crumbs-bar{padding-top:28px}
.svc-crumbs-bar .svc-crumbs{justify-content:flex-start}
/* Hero partner pill above the heading (Migration: WooCommerce Pro Partner), styled like the Google rating pill */
.svc-hero__pills{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:.15rem}
.svc-hero__pill{display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 13px;border-radius:999px;background:#fff;
  box-shadow:0 6px 18px rgba(21,15,43,.08),0 0 0 1px rgba(21,15,43,.06);font-size:13.5px;font-weight:500;line-height:1.4;color:var(--ink);transition:box-shadow .25s ease}
.svc-hero__pill img{height:13px;width:auto;display:block}
.svc-hero__pill img.is-square{height:18px}
.svc-hero__pill svg{width:10px;height:10px;color:var(--accent);margin-left:-2px}
a.svc-hero__pill:hover{box-shadow:0 8px 22px rgba(21,15,43,.12),0 0 0 1px rgba(124,77,220,.35)}
@media (max-width:767px){.svc-hero__pills{gap:6px}.svc-hero__pill{font-size:11.5px;gap:6px;padding:5px 11px 5px 10px;white-space:nowrap;max-width:100%}.svc-hero__pill img{height:11px}.svc-hero__pill img.is-square{height:15px}.svc-hero__pill svg{width:9px;height:9px}}
/* Gallery (About: behind the scenes): bento grid, tall and wide cells, captions on the photo */
.svc-gallery{max-width:1320px;margin:0 auto;padding:0 2rem}
.svc-gallery__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:250px;grid-auto-flow:dense;gap:14px}
.svc-gallery__item{position:relative;overflow:hidden;border-radius:22px;background:#f3efe9}
.svc-gallery__item.is-tall{grid-row:span 2}
.svc-gallery__item.is-wide{grid-column:span 2}
.svc-gallery__item img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.svc-gallery__item:hover img{transform:scale(1.04)}
.svc-gallery__cap{position:absolute;left:12px;bottom:12px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.92);font-size:13px;font-weight:500;color:var(--ink);box-shadow:0 6px 18px rgba(21,15,43,.12)}
@media (max-width:1023px){.svc-gallery__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:240px}}
@media (max-width:767px){.svc-gallery{padding:0 1rem}.svc-gallery__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:160px;gap:10px}.svc-gallery__item{border-radius:16px}.svc-gallery__cap{left:8px;bottom:8px;font-size:11.5px;padding:4px 9px}}
@media (prefers-reduced-motion:reduce){.svc-gallery__item img{transition:none}}
/* Team as a carousel (About): the projects carousel with people; role under the name in the accent colour */
.svc-team + .svc-portal{margin-top:-1rem}
.svc-team-portal .slide__role{display:block;margin-top:6px;font-size:14px;font-weight:500;color:var(--accent)}
.svc-team-portal .slide__name span{margin-top:10px}

/* Float card with an official badge instead of an icon (e.g. the Woo PRO Partner and Shopify Partners badges) */
.float__card.has-logo{gap:12px;padding:10px 16px 10px 10px}
.float__logo{display:block;height:38px;width:auto;flex-shrink:0}
.float__card.has-logo small{font-size:12.5px;color:var(--text);max-width:150px;white-space:normal;line-height:1.35}
/* Tabs: a wide photo (image.ratio) keeps its own shape, with the cards on its corners */
.svc-sticky .sticky-feature__img .float.f1{top:calc(50% - (50vw - 9rem) / 1.6 / 2 - 1.75rem)}
.svc-sticky .sticky-feature__img .float.f2{bottom:calc(50% - (50vw - 9rem) / 1.6 / 2 - 1.75rem)}
.svc-panel-img .float__logo{width:auto;height:38px;aspect-ratio:auto;object-fit:contain}
/* Tabs: a line under the list, e.g. "Learn more about ..." */
.svc-more{margin:1.1rem 0 0;font-size:15px;color:var(--text)}
.svc-more a{color:var(--accent);font-weight:500;text-decoration:underline;text-underline-offset:3px}
/* Tabs: tracking event cards stacked down the right of the photo (panel "events"), each ticked for Analytics, Ads and Meta (Adrian 2026-10-15) */
.trk{position:absolute;z-index:3;right:2.25rem;top:50%;width:clamp(232px,19.5vw,300px);display:flex;flex-direction:column;gap:12px;transform:translate3d(0,calc(-50% + var(--py,0px)),0);font-size:13px;line-height:1.3;color:var(--ink)}
.trk__card{display:grid;grid-template-columns:98px 1fr;align-items:center;gap:12px;background:#fff;border-radius:16px;padding:12px 14px;box-shadow:0 20px 45px rgba(21,15,43,.18),0 0 0 1px rgba(21,15,43,.04);position:relative;
  opacity:0;transform:translate3d(0,34px,0) scale(.92);transition:opacity .7s ease,transform 1.1s cubic-bezier(.16,1,.3,1);transition-delay:calc(.6s + var(--i) * .9s);animation:bob 6s ease-in-out infinite;animation-delay:calc(var(--i) * -2s)}
/* staggered, so the three read as separate floating cards rather than one column */
.trk__card:nth-child(2){left:-2.25rem}
.trk__head{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;padding-right:10px;align-self:stretch;justify-content:center;border-right:1px solid #eeecf2}
.trk__head b{font-weight:600;font-size:13.5px;line-height:1.25}
.trk__head small{font-size:12px;color:var(--text)}
.trk__ic{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;margin-bottom:4px}
.trk__ic svg{width:19px;height:19px}
.trk__ic.is-cart{background:#f0eaff;color:var(--accent)}
.trk__ic.is-card{background:#e7f0ff;color:#2f6fd6}
.trk__ic.is-done{background:#22a55a;color:#fff;border-radius:50%;width:30px;height:30px;margin:2px 2px 6px}
.trk__ic.is-done svg{width:16px;height:16px}
.trk__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
.trk__list li{display:flex;align-items:center;gap:7px;font-size:12px;color:#4b4760;white-space:nowrap;opacity:0;transition:opacity .4s ease;transition-delay:calc(1.15s + var(--i) * .9s + var(--k) * .15s)}
.trk__ok{display:grid;place-items:center;width:15px;height:15px;border-radius:50%;background:#22a55a;color:#fff;flex-shrink:0}
.trk__ok svg{width:10px;height:10px;stroke-width:3}
.trk__logo{display:grid;place-items:center;width:16px;height:16px;flex-shrink:0}
.trk__logo svg,.trk__logo img{display:block;width:16px;height:auto;max-height:16px}
/* .go is added by service.js once the stack is on screen, so the cards come in when people actually see them */
.is-active .trk.go .trk__card,.in .trk.go .trk__card,.is-active .trk.go .trk__list li,.in .trk.go .trk__list li,html:not(.js) .trk__card,html:not(.js) .trk__list li{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.trk__card,.trk__list li{transition:none;animation:none}}
@media (max-width:1024px){
  .svc-panel-img .trk{right:12px;width:270px;transform:translateY(-50%) scale(.72);transform-origin:right center}
  .svc-panel-img .trk img{width:16px;height:auto;aspect-ratio:auto;object-fit:contain}
}
@media (max-width:600px){.svc-panel-img .trk{transform:translateY(-50%) scale(.56)}}
/* Tabs: photo layers (panel "layers"), the photo's own cards and table rows cut out and placed back over it, coming in one after the other once on screen (Adrian 2026-10-15) */
.scene__photo.has-lyrs img:not(.lyr){transform:none}
.lyrs{position:absolute;inset:0;z-index:2;pointer-events:none}
.scene__photo img.lyr,.svc-panel-img img.lyr{position:absolute;height:auto;aspect-ratio:auto;object-fit:fill;max-width:none;opacity:0;transform:translate3d(0,10px,0);transition:opacity .5s ease,transform .7s cubic-bezier(.16,1,.3,1);transition-delay:var(--d)}
.scene__photo img.lyr.is-card,.svc-panel-img img.lyr.is-card{filter:drop-shadow(0 14px 26px rgba(21,15,43,.2));transform:translate3d(0,26px,0) scale(.94);transition-duration:.7s,1.1s;animation:bob 6s ease-in-out infinite}
.lyrs img.lyr.is-card:last-child{animation-delay:-3s}
.is-active .lyrs.go img.lyr,.in .lyrs.go img.lyr,html:not(.js) img.lyr{opacity:1;transform:none}
.sticky-feature__img:not(.is-active) :is(img.lyr,.trk__card,.trk__list li){transition-duration:0s!important;transition-delay:1s!important}
@media (prefers-reduced-motion:reduce){img.lyr{transition:none!important;animation:none!important;opacity:1!important;transform:none!important}}
/* a text message pops in from its corner, like it just arrived */
.scene__photo img.lyr.is-msg,.svc-panel-img img.lyr.is-msg{transform:translate3d(0,14px,0) scale(.9);transform-origin:0 100%;transition-duration:.45s,.8s}
/* a chart line draws itself left to right (the grid underneath is the same, so only the lines appear) */
.scene__photo img.lyr.is-draw,.svc-panel-img img.lyr.is-draw{opacity:1;transform:none;clip-path:inset(0 100% 0 0);transition:clip-path 1.6s cubic-bezier(.45,0,.2,1);transition-delay:var(--d)}
.is-active .lyrs.go img.lyr.is-draw,.in .lyrs.go img.lyr.is-draw,html:not(.js) img.lyr.is-draw{clip-path:inset(0 0 0 0)}
@media (prefers-reduced-motion:reduce){img.lyr.is-draw{clip-path:none!important}}
/* Tabs: one checklist card (section "check") shared by every panel; each row is a stage of the job. On the sticky photo service.js sets the rows
   from the active panel's check_at: earlier rows green, the current one red, later ones still to come. On phones each panel prints its own state (Adrian 2026-10-15) */
.chk{position:absolute;z-index:3;right:1rem;top:50%;width:clamp(244px,20vw,300px);transform:translate3d(0,-50%,0)}
.chk__card{background:#fff;border-radius:18px;padding:16px 14px 8px;box-shadow:0 20px 45px rgba(21,15,43,.16),0 0 0 1px rgba(21,15,43,.04);font-size:12px;line-height:1.35;color:var(--ink);text-align:left;
  opacity:0;transform:translate3d(0,30px,0) scale(.96);transition:opacity .8s ease .4s,transform 1.1s cubic-bezier(.16,1,.3,1) .4s}
.chk.is-shared.is-on.go .chk__card,.in .chk__card,html:not(.js) .chk__card{opacity:1;transform:none}
.sticky-feature__img.is-shared .scene__photo{clip-path:none!important;transition:none!important}
.sticky-feature__img.is-shared .scene__photo img{transform:none!important}
.chk__head{display:flex;gap:12px;align-items:flex-start;padding:0 4px 12px;border-bottom:1px solid #eeecf2}
.chk__ic{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#f0eaff;color:var(--accent)}
.chk__ic svg{width:20px;height:20px}
.chk__head b{display:block;font-size:15px;font-weight:600;margin-bottom:3px}
.chk__head small,.chk__row small{display:block;font-size:11.5px;color:var(--text)}
.chk__list{list-style:none;margin:0;padding:0}
.chk__row{display:flex;gap:12px;align-items:center;padding:10px 8px;margin-top:3px;border-radius:12px;transition:background .5s ease}
.chk__row b{display:block;font-size:13px;font-weight:600}
.chk__row .chk__a{display:none}
.chk__row.is-alert .chk__a{display:block}
.chk__row.is-alert .chk__d{display:none}
.chk__row:not(.is-done):not(.is-alert) .chk__d{opacity:.5}
.chk__dot{flex:none;position:relative;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#f1eff5;color:#fff;transition:background .4s ease,color .4s ease}
.chk__dot::after{content:"";position:absolute;inset:7px;border-radius:50%;border:2px solid #d6d2e2;border-top-color:var(--accent);animation:chk-spin 1s linear infinite;transition:opacity .2s ease}
.chk__dot svg{position:absolute;width:15px;height:15px;opacity:0;transform:scale(.3);transition:opacity .25s ease,transform .5s cubic-bezier(.34,1.56,.64,1)}
.chk__row.is-alert{background:#fff1f1}
.chk__row.is-alert .chk__dot{background:#ffe2e2;color:#e5484d;animation:chk-pulse 1.8s ease-in-out infinite}
.chk__row.is-alert .chk__dot::after,.chk__row.is-done .chk__dot::after{opacity:0;animation:none}
.chk__row.is-alert .chk__warn,.chk__row.is-done .chk__tick{opacity:1;transform:none}
.chk__row.is-done .chk__dot{background:#22a55a;color:#fff}
@keyframes chk-spin{to{transform:rotate(360deg)}}
@keyframes chk-pulse{0%,100%{box-shadow:0 0 0 0 rgba(229,72,77,.35)}50%{box-shadow:0 0 0 7px rgba(229,72,77,0)}}
@media (prefers-reduced-motion:reduce){.chk__dot::after,.chk__row.is-alert .chk__dot{animation:none}.chk__card{transition:none}}
@media (max-width:1024px){.svc-panel-img .chk{right:10px;width:300px;transform:translateY(-50%) scale(.62);transform-origin:right center}}
@media (max-width:600px){.svc-panel-img .chk{transform:translateY(-50%) scale(.5)}}
/* Counters: fixed-width digits so the figure does not jiggle while it counts */
.svc-level__time b[data-countup]{font-variant-numeric:tabular-nums}
/* Project cards with a video (project "video"): a short store walkthrough fades in over the photo on hover, or while the card is mostly on screen on touch screens (Adrian 2026-10-17) */
.svc-proj__vid{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none;transition:opacity .45s ease}
.svc-proj.has-video .svc-proj__frame::after{z-index:1;transition:opacity .35s ease}
.svc-proj.has-video .svc-proj__logo,.svc-proj.has-video .svc-proj__result{z-index:2;transition:opacity .35s ease}
.svc-proj.is-playing .svc-proj__vid{opacity:1}
.svc-proj.is-playing .svc-proj__logo,.svc-proj.is-playing .svc-proj__frame::after{opacity:0}
.svc-proj.is-playing .svc-proj__frame img.bg{transform:none}
@media (prefers-reduced-motion:reduce){.svc-proj__vid{display:none}}

/* Tab panels with a video (featured case studies): a landscape showreel fades in over the photo while the panel is shown (Adrian 2026-10-18) */
.svc-vid{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none;transition:opacity .5s ease}
.has-vid.is-playing .svc-vid{opacity:1}
.has-vid .lyrs{transition:opacity .35s ease}
.has-vid.is-playing .lyrs{opacity:0}
.svc-panel-img.has-vid .float{z-index:2;transition:opacity .35s ease}
.svc-panel-img.has-vid.is-playing .float{opacity:0}
@media (prefers-reduced-motion:reduce){.svc-vid{display:none}}

/* Layer animations for the case study tabs (Adrian 2026-10-18): "pop" cards spring in, then float with a breathing shadow; "slide" rows slide in, then drift */
.scene__photo img.lyr.is-pop,.svc-panel-img img.lyr.is-pop{opacity:0;transform:translate3d(0,30px,0) scale(.82);filter:drop-shadow(0 18px 30px rgba(21,15,43,.22));transition:none}
.scene__photo img.lyr.is-slide,.svc-panel-img img.lyr.is-slide{opacity:0;transform:translate3d(-40px,0,0);filter:drop-shadow(0 12px 22px rgba(21,15,43,.18));transition:none}
.is-active .lyrs.go img.lyr.is-pop,.in .lyrs.go img.lyr.is-pop{animation:lyrPop .95s cubic-bezier(.2,1.35,.4,1) var(--d) both,lyrFloat 5.5s ease-in-out calc(var(--d) + .95s) infinite,lyrGlow 5.5s ease-in-out calc(var(--d) + .95s) infinite}
.is-active .lyrs.go img.lyr.is-slide,.in .lyrs.go img.lyr.is-slide{animation:lyrSlide .8s cubic-bezier(.16,1,.3,1) var(--d) both,lyrDrift 6.5s ease-in-out calc(var(--d) + .8s) infinite}
@keyframes lyrPop{0%{opacity:0;transform:translate3d(0,30px,0) scale(.82)}55%{opacity:1}100%{opacity:1;transform:none}}
@keyframes lyrFloat{0%,100%{opacity:1;transform:translate3d(0,0,0) rotate(0)}50%{opacity:1;transform:translate3d(0,-9px,0) rotate(-.4deg)}}
@keyframes lyrGlow{0%,100%{filter:drop-shadow(0 18px 30px rgba(21,15,43,.22))}50%{filter:drop-shadow(0 30px 46px rgba(21,15,43,.3))}}
@keyframes lyrSlide{0%{opacity:0;transform:translate3d(-40px,0,0)}100%{opacity:1;transform:none}}
@keyframes lyrDrift{0%,100%{opacity:1;transform:translate3d(0,0,0)}50%{opacity:1;transform:translate3d(6px,-4px,0)}}
html:not(.js) img.lyr.is-pop,html:not(.js) img.lyr.is-slide{opacity:1;transform:none}
/* "rise": a phone that comes up after the laptop has wiped in (Adrian 2026-10-18) */
.scene__photo img.lyr.is-rise,.svc-panel-img img.lyr.is-rise{opacity:0;transform:translate3d(0,80px,0);filter:drop-shadow(0 40px 50px rgba(20,30,28,.45));transition:none}
.is-active .lyrs.go img.lyr.is-rise,.in .lyrs.go img.lyr.is-rise{animation:lyrRise 1s cubic-bezier(.16,1,.3,1) var(--d) both}
@keyframes lyrRise{0%{opacity:0;transform:translate3d(0,80px,0)}100%{opacity:1;transform:none}}
html:not(.js) img.lyr.is-rise{opacity:1;transform:none}
/* Layers with out: true sit outside the photo, above or below it, so the cards never cover the mockups (Adrian 2026-10-18). Desktop sticky image only. */
.scene__wrap{position:relative;width:100%;z-index:3}
.lyrs.lyrs--out{z-index:4}
.lyrs--out img.lyr{position:absolute;height:auto;aspect-ratio:auto;object-fit:fill;max-width:none;opacity:0}
.lyrs--out img.lyr.is-pop{transform:translate3d(0,30px,0) scale(.82);filter:drop-shadow(0 18px 30px rgba(21,15,43,.22));transition:none}
.lyrs--out img.lyr.is-slide{transform:translate3d(-40px,0,0);filter:drop-shadow(0 12px 22px rgba(21,15,43,.18));transition:none}
/* Gallery "screens" layout for case studies (Adrian 2026-10-19): 16:10 screens in three columns, a big tile spans 2x2, click opens the lightbox */
.svc-gallery.is-screens .svc-gallery__grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:auto;gap:18px}
.svc-gallery.is-screens .svc-gallery__item{aspect-ratio:1.6;background:#eef0ea}
.svc-gallery.is-screens .svc-gallery__item.is-big{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.svc-gallery__link{position:absolute;inset:0;display:block;cursor:zoom-in;border-radius:inherit}
.svc-gallery__link:focus-visible{outline:3px solid #6d4aff;outline-offset:-3px}
@media (max-width:1023px){.svc-gallery.is-screens .svc-gallery__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:auto}.svc-gallery.is-screens .svc-gallery__item.is-big{grid-row:auto;aspect-ratio:1.6}}
@media (max-width:767px){.svc-gallery.is-screens .svc-gallery__grid{gap:10px}}
.svc-lb{position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;padding:5vh 6vw;background:rgba(14,11,28,.9)}
.svc-lb.open{display:flex;animation:svcLbIn .25s ease both}
@keyframes svcLbIn{from{opacity:0}to{opacity:1}}
.svc-lb img{display:block;max-width:100%;max-height:84vh;border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.svc-lb button{position:absolute;width:48px;height:48px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font:400 26px/48px Arial,sans-serif;text-align:center;cursor:pointer;padding:0}
.svc-lb button:hover,.svc-lb button:focus-visible{background:rgba(255,255,255,.28)}
.svc-lb__close{top:18px;right:18px}.svc-lb__prev{left:18px;top:calc(50% - 24px)}.svc-lb__next{right:18px;top:calc(50% - 24px)}
.svc-lb__cap{position:absolute;left:0;right:0;bottom:18px;text-align:center;color:#fff;font-size:15px}
@media (max-width:767px){.svc-lb{padding:60px 10px}.svc-lb__prev,.svc-lb__next{top:auto;bottom:14px}.svc-lb__cap{bottom:76px}}
/* Gallery "boards" layout (Adrian 2026-10-19): design boards of any shape, natural proportions, masonry columns, same lightbox */
.svc-gallery.is-boards .svc-gallery__grid{display:block;columns:3;column-gap:18px}
.svc-gallery.is-boards .svc-gallery__item{display:block;break-inside:avoid;margin:0 0 18px}
.svc-gallery.is-boards .svc-gallery__item img{position:static;display:block;width:100%;height:auto}
.svc-gallery.is-boards .svc-gallery__link{position:relative;inset:auto}
@media (max-width:1023px){.svc-gallery.is-boards .svc-gallery__grid{columns:2;column-gap:12px}.svc-gallery.is-boards .svc-gallery__item{margin-bottom:12px}}
@media (max-width:599px){.svc-gallery.is-boards .svc-gallery__grid{columns:1}}
/* Bigger outside cards (out_scale 1.4, Adrian 2026-10-19): on shorter screens the sticky image sits a little lower so the card above it clears the tab bar */
@media (min-width:1024px) and (max-height:899px){.sticky-feature__img .scene__wrap{transform:translateY(clamp(0px,calc((900px - 100vh) * .48),68px))}}
/* check card, tone "progress" (Adrian 2026-10-20): the current row is work in progress (purple, spinner), not a red problem */
.chk.is-progress .chk__row.is-alert{background:#f4f0ff}
.chk.is-progress .chk__row.is-alert .chk__dot{background:#ebe4ff;color:var(--accent);animation:none}
.chk.is-progress .chk__row.is-alert .chk__dot::after{opacity:1;animation:chk-spin 1s linear infinite}
.chk.is-progress .chk__row.is-alert .chk__warn{opacity:0}
/* levels, compact (Adrian 2026-10-24): figures at the section-title size (48px, 34px on phones) instead of the 92px display size */
.svc-levels.is-compact .svc-level__time b{font-size:48px;line-height:1.05}
@media (max-width:767px){.svc-levels.is-compact .svc-level__time b{font-size:34px}}
/* Hero scroll zoom (Adrian 2026-10-24): the scene hero holds under the header for 70vh of scrolling (service.js moves it down by the
   scroll, as position:sticky is blocked by an overflow rule higher up) while it fades the copy
   and zooms the photo onto the device screen (hero zoom [x, y, scale]). Desktop only, and off with reduced motion. */
@media (min-width:1024px) and (prefers-reduced-motion:no-preference){
  .svc-hero-zoom{margin-top:var(--header-h);padding-bottom:70vh}
  .svc-hero-zoom .svc-hero.is-zoom{position:relative;margin-top:0;min-height:calc(100vh - var(--header-h));will-change:transform}
  .svc-hero.is-zoom picture img{will-change:transform}
  .svc-hero.is-zoom .hero__content{will-change:opacity,transform}
}
/* Blog: post cards on the Our work grid (parts/service/posts.php). Three across, the newest post as a wide feature card. */
.svc-blog .svc-work__grid.is-blog{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1240px}
.svc-blog .svc-work__item.is-feature{grid-column:span 2}
.svc-blog .svc-proj.is-post .svc-proj__frame{aspect-ratio:16/10;border-radius:16px;background:#ece7df}
.svc-blog .svc-proj.is-post .svc-proj__frame::after{display:none}
.svc-blog .is-feature .svc-proj.is-post .svc-proj__frame{aspect-ratio:2/1}
.svc-blog .svc-proj.is-post h3{font-size:20px;line-height:1.25;font-weight:400;margin:0;padding:0 10px}
.svc-blog .is-feature .svc-proj.is-post h3{font-size:26px}
.svc-blog .svc-work__meta small{font-size:13px}
.svc-blog .svc-work__item p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.svc-blog__more{display:flex;justify-content:center;margin-top:44px}
.svc-blog__more[hidden]{display:none}
.svc-blog__btn{padding:14px 26px;font-size:15px}
@media (max-width:1200px){.svc-blog .svc-work__grid.is-blog{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.svc-blog .svc-work__grid.is-blog{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){.svc-blog .svc-work__grid.is-blog{grid-template-columns:1fr}.svc-blog .svc-work__item.is-feature{grid-column:auto}.svc-blog .is-feature .svc-proj.is-post .svc-proj__frame{aspect-ratio:16/10}.svc-blog .svc-proj.is-post h3{font-size:18px}.svc-blog .is-feature .svc-proj.is-post h3{font-size:20px}.svc-blog .svc-work__item p{display:-webkit-box}}



/* ============ WooCommerce pages (templates/woo.php): cart, checkout, My account ============ */
/* WooCommerce's own stylesheet stays loaded on these pages; these rules restyle it to the brand. Everything is scoped to .woo-page
   (the template wrapper) so nothing leaks into the mini cart or other plugins. Adrian 2026-11-03. */
.woo-page .woo{padding:0 2rem 100px;max-width:1240px}
.woo-page .svc-hero.is-text{padding-bottom:28px}
.woo-page .svc-hero.is-text .hero__content{padding-top:2.5rem}
.woo-page .svc-hero h1{font-size:46px}
.woo-page .svc-hero .hero__content > p{font-size:17px}
.woo-page .woocommerce{font-family:var(--sans);color:var(--ink);font-size:15px;line-height:1.5}
.woo-page .woocommerce h2,.woo-page .woocommerce h3{font-family:var(--serif);font-variation-settings:"SOFT" 100;font-weight:400;letter-spacing:-.01em;font-size:28px;line-height:1.2;margin:0 0 1rem}
/* Low specificity on purpose (:where): plugin landings and page-builder buttons inside product descriptions keep their own link colours */
.woo-page :where(.woocommerce) :where(a:not(.button)){color:var(--accent)}
.woo-page .woocommerce p{margin:0 0 1rem}
.woo-page .woocommerce .woocommerce-notices-wrapper:empty{display:none}
.woo-page .woocommerce .woocommerce-notices-wrapper > *:focus{outline:none}
.woo-page .woocommerce .woocommerce-message,.woo-page .woocommerce .woocommerce-info,.woo-page .woocommerce .woocommerce-error{border:1px solid var(--border);border-top-width:1px;border-radius:16px;background:var(--soft);color:var(--ink);padding:1rem 1.25rem 1rem 3.1rem;margin:0 0 1.5rem;font-size:15px;line-height:1.5;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;width:auto}
.woo-page .woocommerce .woocommerce-message::before,.woo-page .woocommerce .woocommerce-info::before,.woo-page .woocommerce .woocommerce-error::before{color:var(--accent);top:50%;transform:translateY(-50%);left:1.2rem}
.woo-page .woocommerce .woocommerce-message .button,.woo-page .woocommerce .woocommerce-info .button{order:2;margin-left:auto;height:40px;font-size:14px}
.woo-page .woocommerce .woocommerce-error{background:#fdf2f2;border-color:#f3c9c9;display:block}
.woo-page .woocommerce .woocommerce-error::before{color:#c62828;top:1rem;transform:none}
.woo-page .woocommerce .woocommerce-error li{margin:0 0 .3rem}

/* Buttons: the site's pill buttons. Primary actions (checkout, place order, log in) get the gradient. */
.woo-page .woocommerce .button,.woo-page .woocommerce a.button,.woo-page .woocommerce button.button,.woo-page .woocommerce input.button,.woo-page .woocommerce button[type=submit]:not(.show-password-input){display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 24px;border:0;border-radius:50px;font:500 15px/1 var(--sans);color:var(--ink);background:var(--grey);cursor:pointer;text-decoration:none;box-shadow:none;transition:filter .3s ease,background .2s ease,color .2s ease}
.woo-page .woocommerce .button:hover,.woo-page .woocommerce a.button:hover,.woo-page .woocommerce button.button:hover,.woo-page .woocommerce button[type=submit]:not(.show-password-input):hover{background:#ebe8f0;color:var(--ink)}
.woo-page .woocommerce .button.alt,.woo-page .woocommerce a.button.alt,.woo-page .woocommerce button.button.alt,.woo-page .woocommerce a.checkout-button,.woo-page .woocommerce #place_order,.woo-page .woocommerce .woocommerce-Button,.woo-page .woocommerce button[name=login],.woo-page .woocommerce button[name=register],.woo-page .woocommerce button[name=save_account_details],.woo-page .woocommerce button[name=save_address]{background:linear-gradient(to right,var(--grad-a),var(--grad-b));color:#fff}
.woo-page .woocommerce .button.alt:hover,.woo-page .woocommerce a.button.alt:hover,.woo-page .woocommerce button.button.alt:hover,.woo-page .woocommerce a.checkout-button:hover,.woo-page .woocommerce #place_order:hover,.woo-page .woocommerce .woocommerce-Button:hover,.woo-page .woocommerce button[name=login]:hover,.woo-page .woocommerce button[name=register]:hover,.woo-page .woocommerce button[name=save_account_details]:hover,.woo-page .woocommerce button[name=save_address]:hover{background:linear-gradient(to right,var(--grad-a),var(--grad-b));color:#fff;filter:brightness(1.08)}
.woo-page .woocommerce .button:disabled,.woo-page .woocommerce .button.disabled,.woo-page .woocommerce button.button:disabled,.woo-page .woocommerce button.button:disabled:hover{opacity:.45;cursor:not-allowed;padding:0 24px;color:var(--ink);background:var(--grey);filter:none}

/* Fields: same look as the Talk to us form */
.woo-page .woocommerce input.input-text,.woo-page .woocommerce textarea.input-text,.woo-page .woocommerce input[type=text],.woo-page .woocommerce input[type=email],.woo-page .woocommerce input[type=tel],.woo-page .woocommerce input[type=password],.woo-page .woocommerce input[type=number],.woo-page .woocommerce select,.woo-page .woocommerce .select2-container .select2-selection--single{width:100%;max-width:100%;height:auto;min-height:48px;font:400 15px/1.5 var(--sans);color:var(--ink);background:#fff;border:1px solid var(--border);border-radius:12px;padding:.7rem 1rem;box-shadow:none;outline:none;-webkit-appearance:none;appearance:none}
.woo-page .woocommerce textarea.input-text{min-height:110px;resize:vertical}
.woo-page .woocommerce select{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230f0f0f' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 1rem center;padding-right:2.4rem}
.woo-page .woocommerce input.input-text:focus,.woo-page .woocommerce textarea.input-text:focus,.woo-page .woocommerce select:focus,.woo-page .woocommerce .select2-container--open .select2-selection--single,.woo-page .woocommerce .select2-container--focus .select2-selection--single{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.woo-page .woocommerce .select2-container .select2-selection--single{display:flex;align-items:center;padding:0 2.4rem 0 1rem}
.woo-page .woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered{line-height:1.5;padding:0;color:var(--ink)}
.woo-page .woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow{height:100%;top:0;right:.9rem;width:14px}
.woo-page .woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow b{border-color:var(--ink) transparent transparent;border-width:5px 5px 0}
.woo-page .woocommerce .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent var(--ink);border-width:0 5px 5px}
.woo-page .woocommerce form .form-row{margin:0 0 1rem;padding:0}
.woo-page .woocommerce form .form-row label{font:500 14px/1.4 var(--sans);color:var(--ink);margin:0 0 .35rem;display:block}
.woo-page .woocommerce form .form-row label.inline,.woo-page .woocommerce form .form-row label.checkbox,.woo-page .woocommerce form .form-row label.woocommerce-form__label-for-checkbox{display:inline-flex;align-items:center;gap:.5rem;font-weight:400;margin:0}
.woo-page .woocommerce form .form-row .required{color:var(--accent);text-decoration:none;border:0}
.woo-page .woocommerce form .form-row .optional{color:var(--muted);font-weight:400}
.woo-page .woocommerce form .form-row-first,.woo-page .woocommerce form .form-row-last{width:calc(50% - .5rem)}
.woo-page .woocommerce form .form-row.woocommerce-invalid .input-text,.woo-page .woocommerce form .form-row.woocommerce-invalid .select2-selection--single{border-color:#c62828}
.woo-page .woocommerce form .form-row.woocommerce-validated .input-text,.woo-page .woocommerce form .form-row.woocommerce-validated .select2-selection--single{border-color:var(--border)}
.woo-page .woocommerce form .form-row.woocommerce-invalid label{color:var(--ink)}
.woo-page .woocommerce input[type=checkbox],.woo-page .woocommerce input[type=radio]{accent-color:var(--accent);width:16px;height:16px;margin:0}
.woo-page .woocommerce form .password-input{display:block;position:relative;width:100%}
.woo-page .woocommerce form .show-password-input{top:50%;transform:translateY(-50%);right:1rem}
body.woocommerce-checkout .select2-dropdown,body.woocommerce-account .select2-dropdown,body.woocommerce-cart .select2-dropdown{border:1px solid var(--border);border-radius:12px;overflow:hidden;font-family:var(--sans);font-size:15px;box-shadow:0 14px 34px rgba(21,15,43,.12)}
body.woocommerce-checkout .select2-results__option,body.woocommerce-account .select2-results__option,body.woocommerce-cart .select2-results__option{padding:.55rem 1rem}
body.woocommerce-checkout .select2-container--default .select2-results__option--highlighted[aria-selected],body.woocommerce-account .select2-container--default .select2-results__option--highlighted[aria-selected],body.woocommerce-cart .select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--accent);color:#fff}
body.woocommerce-checkout .select2-container--default .select2-search--dropdown .select2-search__field,body.woocommerce-account .select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid var(--border);border-radius:8px;padding:.4rem .6rem;font-family:var(--sans)}

/* Tables */
.woo-page .woocommerce table.shop_table{border:1px solid var(--border);border-radius:20px;border-collapse:separate;border-spacing:0;margin:0;font-size:15px;overflow:hidden;background:#fff;width:100%}
.woo-page .woocommerce table.shop_table th,.woo-page .woocommerce table.shop_table td{border:0;border-top:1px solid var(--border);padding:1rem 1.1rem;vertical-align:middle;line-height:1.4;text-align:left}
.woo-page .woocommerce table.shop_table thead th{border-top:0;font:500 12.5px/1.4 var(--sans);color:var(--muted);text-transform:uppercase;letter-spacing:.05em;background:var(--soft);padding:.8rem 1.1rem}
.woo-page .woocommerce table.shop_table tfoot th,.woo-page .woocommerce table.shop_table tfoot td,.woo-page .woocommerce table.shop_table th{font-weight:500}
.woo-page .woocommerce table.shop_table td.product-thumbnail{width:84px}
.woo-page .woocommerce table.shop_table td.product-thumbnail img{width:60px;height:60px;object-fit:cover;border-radius:12px;display:block;border:1px solid var(--border)}
.woo-page .woocommerce table.shop_table td.product-name a{color:var(--ink);font-weight:500;text-decoration:none}
.woo-page .woocommerce table.shop_table td.product-name a:hover{color:var(--accent)}
.woo-page .woocommerce table.shop_table .product-price,.woo-page .woocommerce table.shop_table .product-subtotal{white-space:nowrap}
.woo-page .woocommerce table.shop_table td.product-remove{width:48px;padding-right:0}
.woo-page .woocommerce a.remove{width:28px;height:28px;line-height:26px;border-radius:50%;color:var(--muted)!important;background:var(--grey);font-size:19px;font-weight:400;text-align:center;display:inline-block}
.woo-page .woocommerce a.remove:hover{background:#c62828;color:#fff!important}
.woo-page .woocommerce .quantity .qty{width:72px;min-height:42px;padding:.4rem .5rem;text-align:center;border-radius:10px;border:1px solid var(--border);font:400 15px/1.5 var(--sans)}
.woo-page .woocommerce table.shop_table td.actions{padding:1rem 1.1rem;background:var(--soft)}
.woo-page .woocommerce table.shop_table td.actions .coupon{display:inline-flex;align-items:center;gap:.6rem;float:none}
.woo-page .woocommerce table.shop_table td.actions .coupon .input-text{width:210px;float:none;min-height:46px;padding:.5rem 1rem;margin:0}
.woo-page .woocommerce table.shop_table td.actions > .button{float:right}
.woo-page .woocommerce table.shop_table td.actions::after{content:"";display:table;clear:both}
.woo-page .woocommerce .cart-collaterals .cross-sells{display:none}

/* Cart: items on the left, totals in a soft panel on the right */
.woocommerce-cart .woo-page .woocommerce{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:2rem 2.5rem;align-items:start}
.woocommerce-cart .woo-page .woocommerce > .woocommerce-notices-wrapper,.woocommerce-cart .woo-page .woocommerce > .cart-empty,.woocommerce-cart .woo-page .woocommerce > .return-to-shop,.woocommerce-cart .woo-page .woocommerce > .woocommerce-notices-wrapper + .woocommerce-message{grid-column:1/-1}
.woocommerce-cart .woo-page .woocommerce .woocommerce-notices-wrapper .woocommerce-message{margin-bottom:0}
.woocommerce-cart .woo-page .woocommerce .cart-empty{font-size:18px;margin:0}
.woocommerce-cart .woo-page .woocommerce .return-to-shop .button{background:linear-gradient(to right,var(--grad-a),var(--grad-b));color:#fff}
.woocommerce-cart .woo-page .woocommerce .cart-collaterals{position:sticky;top:calc(var(--header-h) + 1.5rem);width:100%}
.woocommerce-cart .woo-page .woocommerce .cart-collaterals .cart_totals{width:100%;float:none;background:var(--soft);border-radius:24px;padding:1.5rem}
.woocommerce-cart .woo-page .woocommerce .cart_totals h2{font-size:24px;margin:0 0 .75rem}
.woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table{border:0;border-radius:0;background:transparent;overflow:visible}
.woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table th,.woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table td{padding:.7rem 0;border-top:1px solid var(--border);background:transparent}
.woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table tr:first-child th,.woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table tr:first-child td{border-top:0}
.woocommerce-cart .woo-page .woocommerce .cart_totals th{font-weight:400;color:var(--text);width:auto}
.woocommerce-cart .woo-page .woocommerce .cart_totals td{text-align:right}
.woocommerce-cart .woo-page .woocommerce .cart_totals tr.order-total th,.woocommerce-cart .woo-page .woocommerce .cart_totals tr.order-total td{font-size:18px;font-weight:500;color:var(--ink);padding-top:.9rem}
.woocommerce-cart .woo-page .woocommerce .cart_totals .woocommerce-shipping-destination,.woocommerce-cart .woo-page .woocommerce .cart_totals .shipping ul{font-size:14px;color:var(--muted)}
.woocommerce-cart .woo-page .woocommerce .wc-proceed-to-checkout{padding:1.25rem 0 0}
.woocommerce-cart .woo-page .woocommerce .wc-proceed-to-checkout a.checkout-button{display:flex;width:100%;height:50px;font-size:16px;margin-bottom:0}
.woocommerce-cart .woo-page .woocommerce .wc-proceed-to-checkout .wc-stripe-express-checkout-wrapper,.woocommerce-cart .woo-page .woocommerce #wc-stripe-express-checkout-element{margin-top:.9rem}
.woocommerce-cart .woo-page .woocommerce #wc-stripe-express-checkout-button-separator{color:var(--muted);font-size:13px;margin:.6rem 0}

/* Checkout: details on the left, order summary and payment in a soft panel on the right */
.woocommerce-checkout .woo-page form.checkout{display:grid;grid-template-columns:minmax(0,1fr) 440px;grid-template-rows:auto 1fr;column-gap:3.5rem;row-gap:.75rem;align-items:start}
.woocommerce-checkout .woo-page form.checkout #customer_details{grid-column:1;grid-row:1/3;width:100%}
.woocommerce-checkout .woo-page form.checkout #customer_details .col-1,.woocommerce-checkout .woo-page form.checkout #customer_details .col-2{float:none;width:100%;max-width:640px}
.woocommerce-checkout .woo-page form.checkout #customer_details .col-2{margin-top:1.25rem}
.woocommerce-checkout .woo-page form.checkout #order_review_heading{grid-column:2;grid-row:1;margin:0;font-size:24px}
.woocommerce-checkout .woo-page form.checkout #order_review{grid-column:2;grid-row:2;background:var(--soft);border-radius:24px;padding:1.5rem;width:100%}
.woocommerce-checkout .woo-page .woocommerce-billing-fields h3,.woocommerce-checkout .woo-page .woocommerce-additional-fields h3,.woocommerce-checkout .woo-page .woocommerce-shipping-fields h3{font-size:24px;margin:0 0 1rem}
.woocommerce-checkout .woo-page .woocommerce-shipping-fields h3 label{display:inline-flex;align-items:center;gap:.5rem;font:inherit}
.woocommerce-checkout .woo-page .woocommerce-account-fields,.woocommerce-checkout .woo-page .create-account{margin-top:.5rem}
.woocommerce-checkout .woo-page #order_review table.shop_table{border:0;border-radius:0;background:transparent;overflow:visible}
.woocommerce-checkout .woo-page #order_review table.shop_table th,.woocommerce-checkout .woo-page #order_review table.shop_table td{padding:.7rem 0;border-top:1px solid var(--border);background:transparent}
.woocommerce-checkout .woo-page #order_review table.shop_table thead th{border-top:0;padding-top:0;background:transparent}
.woocommerce-checkout .woo-page #order_review table.shop_table td,.woocommerce-checkout .woo-page #order_review table.shop_table th.product-total{text-align:right;white-space:nowrap}
.woocommerce-checkout .woo-page #order_review table.shop_table td.product-name{text-align:left;white-space:normal;font-weight:400;color:var(--text)}
.woocommerce-checkout .woo-page #order_review table.shop_table td.product-name .product-quantity{color:var(--muted);font-weight:400;margin-left:.25rem}
.woocommerce-checkout .woo-page #order_review table.shop_table tfoot th{font-weight:400;color:var(--text)}
.woocommerce-checkout .woo-page #order_review table.shop_table tr.order-total th,.woocommerce-checkout .woo-page #order_review table.shop_table tr.order-total td{font-size:18px;font-weight:500;color:var(--ink);padding-top:.9rem}
.woocommerce-checkout .woo-page #order_review table.shop_table .woocommerce-shipping-methods{list-style:none;margin:0;padding:0;text-align:left}
.woocommerce-checkout .woo-page #order_review table.shop_table .woocommerce-shipping-methods label{font-weight:400}
.woocommerce-checkout .woo-page #payment{background:transparent;border-radius:0;margin-top:1.25rem}
.woocommerce-checkout .woo-page #payment ul.payment_methods{padding:0;border-bottom:0;margin:0}
.woocommerce-checkout .woo-page #payment ul.payment_methods li{background:#fff;border:1px solid var(--border);border-radius:16px;padding:1rem 1.1rem;margin:0 0 .6rem;line-height:1.5}
.woocommerce-checkout .woo-page #payment ul.payment_methods li label{font-weight:500;display:inline;padding:0}
.woocommerce-checkout .woo-page #payment ul.payment_methods li input[type=radio]{margin-right:.5rem;vertical-align:-2px}
.woocommerce-checkout .woo-page #payment ul.payment_methods li img{max-height:24px;vertical-align:middle;margin-left:.3rem}
.woocommerce-checkout .woo-page #payment div.payment_box{background:transparent;padding:.75rem 0 0;margin:0;border-radius:0;color:var(--text);font-size:14px;width:100%}
.woocommerce-checkout .woo-page #payment div.payment_box::before{display:none}
.woocommerce-checkout .woo-page #payment div.payment_box p{margin:0 0 .5rem;font-size:14px}
.woocommerce-checkout .woo-page #payment div.payment_box .wc-stripe-upe-element,.woocommerce-checkout .woo-page #payment div.payment_box .wc-stripe-elements-field{margin:0}
.woocommerce-checkout .woo-page #payment .place-order{padding:1rem 0 0;margin:0}
.woocommerce-checkout .woo-page #payment #place_order{width:100%;display:flex;height:50px;font-size:16px;float:none;margin:0}
.woocommerce-checkout .woo-page #payment .woocommerce-terms-and-conditions-wrapper{margin-bottom:1rem}
.woocommerce-checkout .woo-page #payment .woocommerce-privacy-policy-text p{font-size:13px;color:var(--muted);line-height:1.5;margin:0 0 .75rem}
.woocommerce-checkout .woo-page #payment .place-order label,.woocommerce-checkout .woo-page #payment .place-order .form-row label{font-size:14px;font-weight:400;display:inline-flex;align-items:center;gap:.5rem;margin:0 0 1rem}
.woocommerce-checkout .woo-page .woocommerce-form-coupon-toggle .woocommerce-info,.woocommerce-checkout .woo-page .woocommerce-form-login-toggle .woocommerce-info{margin-bottom:1rem}
.woocommerce-checkout .woo-page form.checkout_coupon,.woocommerce-checkout .woo-page form.woocommerce-form-login{border:1px solid var(--border);border-radius:20px;padding:1.5rem;margin:0 0 1.5rem;max-width:640px}
.woocommerce-checkout .woo-page form.checkout_coupon .form-row{margin:0}
.woocommerce-checkout .woo-page .blockUI.blockOverlay{border-radius:24px}
.woocommerce-checkout .woo-page .woocommerce-order{max-width:760px}
.woocommerce-checkout .woo-page .woocommerce-order .woocommerce-thankyou-order-received{font-size:20px;font-weight:500;color:var(--ink);margin-bottom:1.5rem}
.woocommerce-checkout .woo-page .woocommerce-order ul.order_details{list-style:none;margin:0 0 2rem;padding:1.25rem 1.5rem;display:flex;flex-wrap:wrap;gap:1rem 2rem;background:var(--soft);border-radius:20px}
.woocommerce-checkout .woo-page .woocommerce-order ul.order_details li{border:0;float:none;margin:0;padding:0;font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;line-height:1.5}
.woocommerce-checkout .woo-page .woocommerce-order ul.order_details li strong{display:block;font-size:16px;color:var(--ink);text-transform:none;letter-spacing:0;font-weight:500}
.woocommerce-checkout .woo-page .woocommerce-order h2{font-size:24px;margin:2rem 0 1rem}
.woocommerce-checkout .woo-page .woocommerce-order .woocommerce-customer-details address{border:1px solid var(--border);border-radius:20px;padding:1.25rem 1.5rem;font-style:normal;line-height:1.6}
.woocommerce-checkout .woo-page .woocommerce-order table.shop_table td,.woocommerce-checkout .woo-page .woocommerce-order table.shop_table th{text-align:left}
.woocommerce-checkout .woo-page .woocommerce-order table.shop_table .product-total,.woocommerce-checkout .woo-page .woocommerce-order table.shop_table tfoot td{text-align:right}

/* My account: menu on the left, content on the right (logged out: the login form on its own) */
.woocommerce-account .woo-page .woocommerce:has(> .woocommerce-MyAccount-navigation){display:grid;grid-template-columns:250px minmax(0,1fr);gap:3rem;align-items:start}
.woocommerce-account .woo-page .woocommerce > .woocommerce-notices-wrapper{grid-column:1/-1}
.woocommerce-account .woo-page .woocommerce-MyAccount-navigation{float:none;width:100%;position:sticky;top:calc(var(--header-h) + 1.5rem)}
.woocommerce-account .woo-page .woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0}
.woocommerce-account .woo-page .woocommerce-MyAccount-navigation li a{display:block;padding:.65rem 1rem;border-radius:12px;color:var(--text);font-size:15px;text-decoration:none;transition:background .2s ease,color .2s ease}
.woocommerce-account .woo-page .woocommerce-MyAccount-navigation li a:hover{background:var(--soft);color:var(--ink)}
.woocommerce-account .woo-page .woocommerce-MyAccount-navigation li.is-active a{background:var(--grey);color:var(--ink);font-weight:500}
.woocommerce-account .woo-page .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border)}
.woocommerce-account .woo-page .woocommerce-MyAccount-content{float:none;width:100%;max-width:820px}
.woocommerce-account .woo-page .woocommerce-MyAccount-content p{margin:0 0 1rem}
.woocommerce-account .woo-page .woocommerce-MyAccount-content h3,.woocommerce-account .woo-page .woocommerce-MyAccount-content legend{font-family:var(--serif);font-variation-settings:"SOFT" 100;font-weight:400;font-size:24px;margin:0 0 1rem}
.woocommerce-account .woo-page .woocommerce-MyAccount-content fieldset{border:0;padding:0;margin:1.5rem 0 0}
.woocommerce-account .woo-page .woocommerce-MyAccount-content .button{height:40px;padding:0 16px;font-size:14px}
.woocommerce-account .woo-page .woocommerce-MyAccount-content table.shop_table td .button + .button{margin-left:.4rem}
.woocommerce-account .woo-page .woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions{white-space:nowrap}
.woocommerce-account .woo-page .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address{border:1px solid var(--border);border-radius:20px;padding:1.25rem 1.5rem}
.woocommerce-account .woo-page .woocommerce-MyAccount-content .woocommerce-Address address{font-style:normal;line-height:1.6}
.woocommerce-account .woo-page .woocommerce-MyAccount-content .woocommerce-Address-title h2,.woocommerce-account .woo-page .woocommerce-MyAccount-content .woocommerce-Address-title h3{font-size:20px;margin:0 0 .5rem;float:none}
.woocommerce-account .woo-page .woocommerce-MyAccount-content .woocommerce-Address-title .edit{font-size:14px}
.woocommerce-account .woo-page .woocommerce-MyAccount-content mark{background:var(--grey);border-radius:6px;padding:.1rem .4rem}
.woocommerce-account .woo-page .woocommerce-MyAccount-content .woocommerce-Pagination .button,.woocommerce-account .woo-page .woocommerce-MyAccount-content .woocommerce-pagination .button{margin:1rem .5rem 0 0}
.woocommerce-account .woo-page .woocommerce-MyAccount-content .subscription_details tr:first-child th{border-top:0}
.woocommerce-account .woo-page form.login,.woocommerce-account .woo-page form.register,.woocommerce-account .woo-page form.woocommerce-ResetPassword,.woocommerce-account .woo-page form.woocommerce-EditAccountForm,.woocommerce-account .woo-page form.edit-account{border:1px solid var(--border);border-radius:24px;padding:2rem;margin:0;max-width:520px}
.woocommerce-account .woo-page .woocommerce:has(> form.login) > h2,.woocommerce-account .woo-page .woocommerce > form.woocommerce-ResetPassword + h2{font-size:24px}
.woocommerce-account .woo-page .woocommerce-ResetPassword p:first-child{color:var(--text)}
.woocommerce-account .woo-page form .form-row.woocommerce-form-login__submit,.woocommerce-account .woo-page form .form-row.woocommerce-form-register__submit{margin:.5rem 0 0}
.woocommerce-account .woo-page form .woocommerce-form-login__rememberme{display:inline-flex;align-items:center;gap:.5rem;margin:0 0 0 1rem;font-weight:400}
.woocommerce-account .woo-page form .woocommerce-LostPassword{margin:1rem 0 0;font-size:14px}
.woocommerce-account .woo-page form.register .woocommerce-privacy-policy-text p{font-size:13px;color:var(--muted)}
.woocommerce-account .woo-page .woocommerce-MyAccount-content .wc-stripe-payment-methods-list,.woocommerce-account .woo-page .woocommerce-MyAccount-content .woocommerce-PaymentMethods{margin:0}
.woocommerce-account .woo-page .u-columns.col2-set .col-1,.woocommerce-account .woo-page .u-columns.col2-set .col-2{float:none;width:100%;max-width:none}
.woocommerce-account .woo-page .u-columns.col2-set{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.woocommerce-account .woo-page .u-columns.col2-set::before,.woocommerce-account .woo-page .u-columns.col2-set::after{display:none}
.woocommerce-account .woo-page .u-columns.col2-set .col-1 form,.woocommerce-account .woo-page .u-columns.col2-set .col-2 form{max-width:none}
.woocommerce-account .woo-page .woocommerce-MyAccount-content .woocommerce-notices-wrapper + .woocommerce-message{margin-bottom:1.5rem}

/* Tablets and phones */
@media (max-width:1024px){
  .woocommerce-cart .woo-page .woocommerce{grid-template-columns:minmax(0,1fr) 320px;gap:1.5rem}
  .woocommerce-checkout .woo-page form.checkout{grid-template-columns:minmax(0,1fr) 380px;column-gap:2rem}
  .woocommerce-account .woo-page .woocommerce:has(> .woocommerce-MyAccount-navigation){grid-template-columns:210px minmax(0,1fr);gap:2rem}
}
@media (max-width:860px){
  .woo-page .woo{padding:0 1.25rem 110px}
  .woo-page .svc-hero h1{font-size:34px}
  .woocommerce-cart .woo-page .woocommerce,.woocommerce-checkout .woo-page form.checkout,.woocommerce-account .woo-page .woocommerce:has(> .woocommerce-MyAccount-navigation){grid-template-columns:minmax(0,1fr)}
  .woocommerce-cart .woo-page .woocommerce .cart-collaterals,.woocommerce-account .woo-page .woocommerce-MyAccount-navigation{position:static}
  .woocommerce-checkout .woo-page form.checkout #customer_details{grid-row:auto;grid-column:1}
  .woocommerce-checkout .woo-page form.checkout #order_review_heading,.woocommerce-checkout .woo-page form.checkout #order_review{grid-column:1;grid-row:auto}
  .woocommerce-checkout .woo-page form.checkout #order_review_heading{margin-top:1.5rem}
  .woocommerce-checkout .woo-page form.checkout #order_review{padding:1.25rem}
  .woocommerce-account .woo-page .woocommerce-MyAccount-navigation ul{display:flex;flex-wrap:wrap;gap:.3rem}
  .woocommerce-account .woo-page .woocommerce-MyAccount-navigation li a{padding:.5rem .85rem;font-size:14px;background:var(--soft)}
  .woocommerce-account .woo-page .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout{margin:0;padding:0;border:0}
  .woocommerce-account .woo-page .u-columns.col2-set{grid-template-columns:1fr}
  .woocommerce-account .woo-page form.login,.woocommerce-account .woo-page form.register,.woocommerce-account .woo-page form.woocommerce-ResetPassword,.woocommerce-account .woo-page form.woocommerce-EditAccountForm,.woocommerce-account .woo-page form.edit-account{padding:1.25rem}
  .woo-page .woocommerce form .form-row-first,.woo-page .woocommerce form .form-row-last{width:100%;float:none}
  .woo-page .woocommerce table.shop_table td.actions .coupon{display:flex;width:100%;margin-bottom:.75rem}
  .woo-page .woocommerce table.shop_table td.actions .coupon .input-text{width:auto;flex:1}
  .woo-page .woocommerce table.shop_table td.actions > .button{float:none;width:100%;display:flex}
}
@media (max-width:768px){
  /* WooCommerce's responsive table: each cell becomes a row with the column name on the left */
  .woo-page .woocommerce table.shop_table_responsive tr{display:block;padding:.5rem 0;border-top:1px solid var(--border)}
  .woo-page .woocommerce table.shop_table_responsive tbody tr:first-child{border-top:0}
  .woo-page .woocommerce table.shop_table_responsive tr td{display:flex;justify-content:space-between;align-items:center;gap:1rem;border:0;padding:.45rem 1.1rem;text-align:right!important;background:transparent}
  .woo-page .woocommerce table.shop_table_responsive tr td::before{float:none;font-weight:500;color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.04em}
  .woo-page .woocommerce table.shop_table_responsive tr td.product-remove,.woo-page .woocommerce table.shop_table_responsive tr td.product-thumbnail{display:flex;justify-content:flex-start;width:auto}
  .woo-page .woocommerce table.shop_table_responsive tr td.product-remove{padding-top:.8rem}
  .woo-page .woocommerce table.shop_table_responsive tr td.product-remove::before,.woo-page .woocommerce table.shop_table_responsive tr td.product-thumbnail::before{display:none}
  .woo-page .woocommerce table.shop_table_responsive tr td.product-name{justify-content:flex-start;text-align:left!important;font-size:16px}
  .woo-page .woocommerce table.shop_table_responsive tr td.product-name::before{display:none}
  .woo-page .woocommerce table.shop_table_responsive tr td.actions{display:block;background:var(--soft);padding:1rem 1.1rem;text-align:left!important}
  .woo-page .woocommerce table.shop_table_responsive tr td.actions::before{display:none}
  .woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table_responsive tr{padding:0;border:0}
  .woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table_responsive tr td{padding:.7rem 0;border-top:1px solid var(--border)}
  .woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table_responsive tr th{display:none}
  .woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table_responsive tr td[data-title]::before{display:block;content:attr(data-title);text-transform:none;letter-spacing:0;font-size:15px;font-weight:400;color:var(--text)}
  .woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table_responsive tr.order-total td::before{font-weight:500;color:var(--ink);font-size:18px}
  .woocommerce-cart .woo-page .woocommerce .cart_totals table.shop_table_responsive tr:first-child td{border-top:0}
  .woocommerce-account .woo-page .woocommerce-MyAccount-content table.shop_table_responsive tr td{padding:.45rem 1rem}
  .woocommerce-account .woo-page .woocommerce-MyAccount-content table.shop_table_responsive tr td.woocommerce-orders-table__cell-order-actions{justify-content:flex-start;padding-bottom:.8rem}
  .woocommerce-account .woo-page .woocommerce-MyAccount-content table.shop_table_responsive tr td.woocommerce-orders-table__cell-order-actions::before{display:none}
}


/* ============ WooCommerce products: single product, shop and category archives (woocommerce.php) ============ */
.woo-page .woocommerce-breadcrumb{font-size:13px;color:var(--muted);margin:0 0 1.5rem;display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.woo-page .woocommerce-breadcrumb a{color:var(--muted)}
.woo-page .woocommerce-breadcrumb a:hover{color:var(--accent)}
.woo-page .woocommerce-breadcrumb__sep{color:#c9c5d2}
.woo-page .nectar-social,.woo-page .sharing-default-minimal{display:none!important}
.woo-page .woocommerce-notices-wrapper + div.product{margin-top:0}

/* Single product (no hero, so the page itself clears the fixed header): gallery left, summary right, then the tabs and related products across the full width */
.woo-product .woo{padding-top:calc(var(--header-h) + 2.25rem)}
.woo-product .woocommerce div.product{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2.5rem 4rem;align-items:start;position:relative}
.woo-product .woocommerce div.product div.images,.woo-product .woocommerce div.product div.summary{float:none;width:100%;margin:0}
.woo-product .woocommerce div.product .woocommerce-tabs,.woo-product .woocommerce div.product section.related,.woo-product .woocommerce div.product section.upsells,.woo-product .woocommerce div.product .woocommerce-product-gallery__trigger ~ *{grid-column:1/-1}
.woo-product .woocommerce div.product .woocommerce-product-gallery{width:100%!important;opacity:1!important}
.woo-product .woocommerce div.product .woocommerce-product-gallery .flex-viewport,.woo-product .woocommerce div.product .woocommerce-product-gallery__wrapper{border-radius:24px;overflow:hidden;background:var(--soft);border:1px solid var(--border)}
.woo-product .woocommerce div.product .woocommerce-product-gallery__image img{width:100%;height:auto;display:block}
.woo-product .woocommerce div.product .woocommerce-product-gallery__image a{display:block}
.woo-product .woocommerce div.product .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image:not(:first-child){display:none}
.woo-product .woocommerce div.product .woocommerce-product-gallery .flex-viewport + .flex-control-thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:.6rem;margin:.75rem 0 0}
.woo-product .woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li{width:auto;float:none;margin:0;background:var(--soft);border-radius:12px;overflow:hidden;border:2px solid transparent;cursor:pointer;transition:border-color .2s ease}
.woo-product .woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li img{opacity:.55;display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:opacity .2s ease}
.woo-product .woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li:hover img{opacity:.85}
.woo-product .woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active{opacity:1}
.woo-product .woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li:has(.flex-active){border-color:var(--accent)}
.woo-product .woocommerce div.product .woocommerce-product-gallery__trigger{top:1rem;right:1rem;width:40px;height:40px;border-radius:50%;background:#fff;box-shadow:0 4px 14px rgba(21,15,43,.12);z-index:5}
.woo-product .woocommerce div.product span.onsale{position:absolute;top:1rem;left:1rem;z-index:4;min-height:0;min-width:0;line-height:1;padding:.45rem .75rem;border-radius:999px;background:var(--accent);color:#fff;font:500 12px/1 var(--sans);margin:0}
.woo-product .woocommerce div.product .summary{padding-top:.25rem}
.woo-product .woocommerce div.product h1.product_title{font-family:var(--serif);font-variation-settings:"SOFT" 100;font-weight:400;letter-spacing:-.01em;font-size:40px;line-height:1.15;margin:0 0 1rem;color:var(--ink)}
.woo-product .woocommerce div.product .woocommerce-product-rating{margin:0 0 .75rem;display:flex;align-items:center;gap:.5rem}
.woo-product .woocommerce div.product .woocommerce-product-rating .star-rating{margin:0;float:none;color:#f5a623}
.woo-product .woocommerce div.product .woocommerce-review-link{font-size:13px;color:var(--muted)}
.woo-product .woocommerce div.product p.price,.woo-product .woocommerce div.product span.price{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem;font:500 28px/1.2 var(--sans);color:var(--ink);margin:0 0 1.25rem}
.woo-product .woocommerce div.product p.price del,.woo-product .woocommerce div.product span.price del{color:var(--muted);font-size:20px;font-weight:400;opacity:1}
.woo-product .woocommerce div.product p.price ins,.woo-product .woocommerce div.product span.price ins{text-decoration:none;font-weight:500}
.woo-product .woocommerce div.product p.price .from{font-size:15px;color:var(--muted);font-weight:400}
.woo-product .woocommerce div.product p.price .woocommerce-price-suffix{font-size:14px;color:var(--muted);font-weight:400}
.woo-product .woocommerce div.product p.price .subscription-details{font-size:15px;color:var(--muted);font-weight:400}
.woo-product .woocommerce div.product .woocommerce-product-details__short-description{font-size:16px;line-height:1.65;color:var(--text);margin:0 0 1.5rem}
.woo-product .woocommerce div.product .woocommerce-product-details__short-description p{margin:0 0 .9rem}
.woo-product .woocommerce div.product .woocommerce-product-details__short-description ul{padding-left:1.2rem;margin:0 0 .9rem}
.woo-product .woocommerce div.product .woocommerce-product-details__short-description li{margin:.25rem 0}
.woo-product .woocommerce div.product form.cart{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;margin:0 0 1rem}
.woo-product .woocommerce div.product form.cart div.quantity{float:none;margin:0}
.woo-product .woocommerce div.product form.cart .button,.woo-product .woocommerce div.product form.cart .single_add_to_cart_button{height:50px;padding:0 28px;font-size:16px;background:linear-gradient(to right,var(--grad-a),var(--grad-b));color:#fff;float:none}
.woo-product .woocommerce div.product form.cart .button:hover{filter:brightness(1.08);color:#fff}
.woo-product .woocommerce div.product form.cart.variations_form{display:block}
.woo-product .woocommerce div.product form.cart table.variations{margin:0 0 1rem;border:0}
.woo-product .woocommerce div.product form.cart table.variations th,.woo-product .woocommerce div.product form.cart table.variations td{padding:0 0 .5rem;border:0;display:block;text-align:left;line-height:1.4}
.woo-product .woocommerce div.product form.cart table.variations th label{font:500 14px/1.4 var(--sans);color:var(--ink)}
.woo-product .woocommerce div.product form.cart table.variations td.value{padding-bottom:1rem}
.woo-product .woocommerce div.product form.cart table.variations select{max-width:360px}
.woo-product .woocommerce div.product form.cart .reset_variations{font-size:13px;color:var(--muted);margin-left:.5rem}
.woo-product .woocommerce div.product form.cart .single_variation_wrap .woocommerce-variation{margin:0 0 1rem;font-size:15px;color:var(--text)}
.woo-product .woocommerce div.product form.cart .single_variation_wrap .woocommerce-variation .price{font-size:24px;margin:0 0 .5rem}
.woo-product .woocommerce div.product form.cart .woocommerce-variation-add-to-cart{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}
.woo-product .woocommerce div.product form.cart .woocommerce-variation-add-to-cart .button.disabled,.woo-product .woocommerce div.product form.cart .button.wc-variation-selection-needed{opacity:.5;cursor:not-allowed;filter:none}
.woo-product .woocommerce div.product #wc-stripe-express-checkout-element,.woo-product .woocommerce div.product .wc-stripe-express-checkout-wrapper{margin:0 0 1rem;max-width:420px}
.woo-product .woocommerce div.product #wc-stripe-express-checkout-button-separator{font-size:13px;color:var(--muted);margin:.5rem 0}
.woo-product .woocommerce div.product p.first-payment-date{font-size:13px;color:var(--muted);margin:0 0 1rem}
.woo-product .woocommerce div.product .product_meta{font-size:13px;color:var(--muted);border-top:1px solid var(--border);padding-top:1rem;margin-top:.5rem;display:flex;flex-direction:column;gap:.3rem}
.woo-product .woocommerce div.product .product_meta a{color:var(--text)}
.woo-product .woocommerce div.product .product_meta a:hover{color:var(--accent)}
.woo-product .woocommerce div.product .stock{font-size:14px;color:#1f6b3f;margin:0 0 1rem}
.woo-product .woocommerce div.product .out-of-stock{color:#c62828}

/* Tabs: pills, then the panel with no box around it */
.woo-product .woocommerce div.product .woocommerce-tabs{margin-top:1.5rem}
.woo-product .woocommerce div.product .woocommerce-tabs ul.tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 2rem;padding:0;overflow:visible;list-style:none}
.woo-product .woocommerce div.product .woocommerce-tabs ul.tabs::before,.woo-product .woocommerce div.product .woocommerce-tabs ul.tabs::after,.woo-product .woocommerce div.product .woocommerce-tabs ul.tabs li::before,.woo-product .woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none}
.woo-product .woocommerce div.product .woocommerce-tabs ul.tabs li{border:0;background:none;border-radius:999px;padding:0;margin:0;display:inline-block;position:static;box-shadow:none}
.woo-product .woocommerce div.product .woocommerce-tabs ul.tabs li a{display:inline-flex;align-items:center;height:40px;padding:0 1.1rem;border-radius:999px;color:var(--text);font:500 14px/1 var(--sans);background:var(--grey);text-shadow:none;transition:background .2s ease,color .2s ease}
.woo-product .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover{background:#ebe8f0;color:var(--ink)}
.woo-product .woocommerce div.product .woocommerce-tabs ul.tabs li.active a{background:var(--ink);color:#fff}
.woo-product .woocommerce div.product .woocommerce-tabs .panel{padding:0;margin:0;box-shadow:none}
.woo-product .woocommerce div.product .woocommerce-tabs .panel > h2:first-child{display:none}
.woo-product .woocommerce div.product .woocommerce-tabs .panel > p,.woo-product .woocommerce div.product .woocommerce-tabs .panel > ul,.woo-product .woocommerce div.product .woocommerce-tabs .panel > ol{max-width:860px;font-size:16px;line-height:1.7;color:var(--text);margin:0 0 1rem}
.woo-product .woocommerce div.product .woocommerce-tabs .panel > ul,.woo-product .woocommerce div.product .woocommerce-tabs .panel > ol{padding-left:1.3rem}
.woo-product .woocommerce div.product .woocommerce-tabs .panel > h2,.woo-product .woocommerce div.product .woocommerce-tabs .panel > h3{font-family:var(--serif);font-variation-settings:"SOFT" 100;font-weight:400;letter-spacing:-.01em;max-width:860px;margin:2rem 0 .75rem}
.woo-product .woocommerce div.product .woocommerce-tabs .panel > h2{font-size:30px;line-height:1.2}
.woo-product .woocommerce div.product .woocommerce-tabs .panel > h3{font-size:22px;line-height:1.3}
.woo-product .woocommerce div.product .woocommerce-tabs .panel > img,.woo-product .woocommerce div.product .woocommerce-tabs .panel > p > img{max-width:100%;height:auto;border-radius:16px}
.woo-product .woocommerce div.product .woocommerce-tabs .panel table.shop_attributes{border:1px solid var(--border);border-radius:16px;border-collapse:separate;border-spacing:0;overflow:hidden;max-width:640px}
.woo-product .woocommerce div.product .woocommerce-tabs .panel table.shop_attributes th,.woo-product .woocommerce div.product .woocommerce-tabs .panel table.shop_attributes td{border:0;border-top:1px solid var(--border);padding:.7rem 1rem;background:transparent;font-style:normal}
.woo-product .woocommerce div.product .woocommerce-tabs .panel table.shop_attributes tr:first-child th,.woo-product .woocommerce div.product .woocommerce-tabs .panel table.shop_attributes tr:first-child td{border-top:0}
.woo-product .woocommerce div.product .woocommerce-tabs .panel table.shop_attributes th{width:200px;font-weight:500;color:var(--ink)}
.woo-product .woocommerce div.product .woocommerce-tabs .panel table.shop_attributes p{margin:0;padding:0}
/* The theme's homepage .badge rule (absolute, top right) must not catch badges inside product descriptions, e.g. the
   "before cutoff" / "after cutoff" labels in the Pickup & Delivery landing (Adrian 2026-11-03: they showed up next to the title). */
.woo-page .woocommerce-Tabs-panel .badge,.woo-page .eux-pad .badge{position:static;top:auto;right:auto;font-weight:inherit}
/* Same for the theme's .chk (homepage checkout float card) and .pm (FAQ plus/minus) rules, which the landing also uses as class names */
.woo-page .eux-pad .chk{position:static;right:auto;top:auto;transform:none;z-index:auto}
.woo-page .eux-pad .pad-q .pm::before,.woo-page .eux-pad .pad-q .pm::after{transform:none;opacity:1}
.woo-page .eux-pad .pad-q[open] .pm::after{transform:scaleY(0)}
/* Page-builder descriptions (Salient Core shortcodes): keep them inside the page width */
.woo-product .woocommerce div.product .woocommerce-tabs .panel .vc_row[data-vc-full-width]{left:0!important;width:100%!important;padding:0!important;margin-left:0!important;margin-right:0!important}
.woo-product .woocommerce div.product .woocommerce-tabs .panel .vc_row{margin:0 0 2rem}
.woo-product .woocommerce div.product .woocommerce-tabs .panel .vc_row img{max-width:100%;height:auto}

/* Reviews */
.woo-product .woocommerce #reviews #comments h2{font-size:24px;margin:0 0 1.25rem}
.woo-product .woocommerce #reviews #comments ol.commentlist li .comment-text .meta{margin:.35rem 0 .5rem}
.woo-product .woocommerce #reviews #comments ol.commentlist li .comment-text .meta .woocommerce-review__dash{color:var(--muted)}
.woo-product .woocommerce #reviews #comments ol.commentlist{list-style:none;margin:0 0 2rem;padding:0;display:grid;gap:1rem}
.woo-product .woocommerce #reviews #comments ol.commentlist li{margin:0}
.woo-product .woocommerce #reviews #comments ol.commentlist li .comment_container{display:flex;align-items:flex-start;gap:1rem;border:1px solid var(--border);border-radius:18px;padding:1.15rem 1.35rem;background:#fff}
.woo-product .woocommerce #reviews #comments ol.commentlist li img.avatar{position:static;float:none;flex:none;width:44px;height:44px;border-radius:50%;padding:0;border:0;background:var(--soft);margin:0}
.woo-product .woocommerce #reviews #comments ol.commentlist li .comment-text{flex:1;min-width:0;margin:0;border:0;border-radius:0;padding:0}
.woo-product .woocommerce #reviews #comments ol.commentlist li .comment-text .meta{font-size:13px;color:var(--muted);margin:.25rem 0 .5rem}
.woo-product .woocommerce #reviews #comments ol.commentlist li .comment-text .meta strong{color:var(--ink);font-weight:500}
.woo-product .woocommerce #reviews #comments ol.commentlist li .comment-text .description p{margin:0;font-size:15px;line-height:1.6;color:var(--text)}
.woo-product .woocommerce #reviews #comments ol.commentlist li .comment-text .star-rating{float:none;margin:0 0 .25rem;color:#f5a623}
.woo-product .woocommerce #review_form_wrapper{max-width:640px}
.woo-product .woocommerce #review_form #respond{border:1px solid var(--border);border-radius:20px;padding:1.5rem}
.woo-product .woocommerce #review_form #respond .comment-reply-title{display:block;font:500 18px/1.3 var(--sans);margin:0 0 1rem}
.woo-product .woocommerce #review_form #respond p{margin:0 0 1rem}
.woo-product .woocommerce #review_form #respond label{font:500 14px/1.4 var(--sans);display:block;margin:0 0 .35rem}
.woo-product .woocommerce #review_form #respond textarea,.woo-product .woocommerce #review_form #respond input[type=text],.woo-product .woocommerce #review_form #respond input[type=email]{width:100%;min-height:48px;font:400 15px/1.5 var(--sans);color:var(--ink);background:#fff;border:1px solid var(--border);border-radius:12px;padding:.7rem 1rem;box-shadow:none}
.woo-product .woocommerce #review_form #respond textarea{min-height:120px}
.woo-product .woocommerce #review_form #respond .comment-form-cookies-consent{display:flex;align-items:center;gap:.5rem}
.woo-product .woocommerce #review_form #respond .comment-form-cookies-consent label{margin:0;font-weight:400}
.woo-product .woocommerce #review_form #respond .stars a{color:#f5a623}
.woo-product .woocommerce .woocommerce-noreviews,.woo-product .woocommerce p.no-comments{background:var(--soft);border:1px solid var(--border);border-radius:12px;color:var(--text);padding:.9rem 1.25rem;margin:0 0 1.5rem;font-size:15px}

/* Product cards: related products, upsells, the shop and category grids */
.woo-page .woocommerce ul.products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;margin:0;padding:0;list-style:none}
.woo-page .woocommerce ul.products::before,.woo-page .woocommerce ul.products::after{display:none}
.woo-page .woocommerce ul.products li.product{width:auto!important;float:none;margin:0!important;padding:1rem;background:#fff;border:1px solid var(--border);border-radius:20px;display:flex;flex-direction:column;position:relative;text-align:left;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.woo-page .woocommerce ul.products li.product:hover{transform:translateY(-3px);border-color:#d9cdf7;box-shadow:0 12px 26px rgba(21,15,43,.07)}
.woo-page .woocommerce ul.products li.product a.woocommerce-LoopProduct-link{display:flex;flex-direction:column;flex:1;color:inherit}
.woo-page .woocommerce ul.products li.product a img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;background:var(--soft);margin:0 0 1rem;display:block}
.woo-page .woocommerce ul.products li.product .woocommerce-loop-product__title,.woo-page .woocommerce ul.products li.product h2{font:500 16px/1.35 var(--sans);padding:0;margin:0 0 .4rem;color:var(--ink)}
.woo-page .woocommerce ul.products li.product .star-rating{margin:0 0 .4rem;font-size:12px;color:#f5a623}
.woo-page .woocommerce ul.products li.product .price{font:400 15px/1.4 var(--sans);color:var(--text);margin:auto 0 .9rem;display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem}
.woo-page .woocommerce ul.products li.product .price del{color:var(--muted);opacity:1}
.woo-page .woocommerce ul.products li.product .price ins{text-decoration:none;font-weight:500;color:var(--ink)}
.woo-page .woocommerce ul.products li.product .price .woocommerce-price-suffix,.woo-page .woocommerce ul.products li.product .price .subscription-details{font-size:13px;color:var(--muted)}
/* WooCommerce's own card rule (.woocommerce ul.products li.product .button) wins on display, so the flex centring is repeated here */
.woo-page .woocommerce ul.products li.product .button{display:inline-flex;align-items:center;justify-content:center;line-height:1;margin:0;height:40px;padding:0 18px;font-size:14px;align-self:flex-start;background:#fff;border:1.5px solid var(--border)}
.woo-page .woocommerce ul.products li.product .button.loading{opacity:.6}
.woo-page .woocommerce ul.products li.product .added_to_cart{margin:.5rem 0 0;font-size:14px;color:var(--accent)}
.woo-page .woocommerce ul.products li.product span.onsale{position:absolute;top:1.5rem;left:1.5rem;right:auto;width:auto;z-index:2;min-height:0;min-width:0;line-height:1;padding:.4rem .7rem;border-radius:999px;background:var(--accent);color:#fff;font:500 12px/1 var(--sans);margin:0}
.woo-page .woocommerce section.related,.woo-page .woocommerce section.upsells{margin-top:4rem;padding-top:3rem;border-top:1px solid var(--border)}
.woo-page .woocommerce section.related > h2,.woo-page .woocommerce section.upsells > h2{font-size:30px;margin:0 0 1.5rem}

/* Shop and category archives */
.woo-shop .woo{padding-top:.5rem}
.woo-shop .woocommerce{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;position:relative}
.woo-shop .woocommerce > .woocommerce-notices-wrapper,.woo-shop .woocommerce > ul.products,.woo-shop .woocommerce > .woocommerce-pagination,.woo-shop .woocommerce > .woocommerce-info,.woo-shop .woocommerce > .term-description{width:100%}
.woo-shop .woocommerce .woocommerce-result-count{float:none;margin:0 auto 0 0;font-size:14px;color:var(--muted)}
.woo-shop .woocommerce .woocommerce-ordering{float:none;margin:0}
.woo-shop .woocommerce .woocommerce-ordering select{width:auto;min-height:42px;padding:.4rem 2.4rem .4rem 1rem;font-size:14px}
.woo-shop .woocommerce .woocommerce-pagination{margin-top:2rem}
.woo-shop .woocommerce .woocommerce-pagination ul.page-numbers{border:0;display:flex;justify-content:center;gap:.4rem;list-style:none;margin:0;padding:0}
.woo-shop .woocommerce .woocommerce-pagination ul.page-numbers li{border:0;float:none;margin:0}
.woo-shop .woocommerce .woocommerce-pagination ul.page-numbers li a,.woo-shop .woocommerce .woocommerce-pagination ul.page-numbers li span{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 .8rem;border-radius:999px;background:var(--grey);color:var(--ink);font-size:14px;line-height:1}
.woo-shop .woocommerce .woocommerce-pagination ul.page-numbers li a:hover{background:#ebe8f0}
.woo-shop .woocommerce .woocommerce-pagination ul.page-numbers li span.current{background:var(--ink);color:#fff}

@media (max-width:1024px){
  .woo-product .woocommerce div.product{gap:2rem 2.5rem}
  .woo-product .woocommerce div.product h1.product_title{font-size:32px}
}
@media (max-width:860px){
  .woo-product .woocommerce div.product{grid-template-columns:minmax(0,1fr)}
  .woo-product .woocommerce div.product .woocommerce-product-gallery .flex-viewport + .flex-control-thumbs{grid-template-columns:repeat(4,1fr)}
  .woo-page .woocommerce ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
  .woo-product .woocommerce div.product .woocommerce-tabs ul.tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.25rem;scrollbar-width:none}
  .woo-product .woocommerce div.product .woocommerce-tabs ul.tabs li a{white-space:nowrap}
  .woo-shop .woocommerce .woocommerce-result-count{width:100%;margin:0}
}
@media (max-width:560px){
  .woo-page .woocommerce ul.products{grid-template-columns:minmax(0,1fr)}
  .woo-product .woocommerce div.product h1.product_title{font-size:28px}
  .woo-product .woocommerce div.product p.price{font-size:24px}
  .woo-product .woocommerce div.product form.cart .single_add_to_cart_button{flex:1}
}

/* ============ Converted page-builder content (inc/vc-content.php) and old portfolio items (single-portfolio.php) ============ */
.e26-vc{display:flex;flex-direction:column;gap:3.5rem;max-width:1180px}
.e26-vc__eyebrow{display:block;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);font-weight:500;margin:0 0 .6rem}
.e26-vc h2,.e26-work__body h2{font-family:var(--serif);font-variation-settings:"SOFT" 100;font-weight:400;letter-spacing:-.01em;font-size:32px;line-height:1.2;margin:0 0 .75rem;color:var(--ink)}
.e26-vc h3,.e26-work__body h3{font-family:var(--serif);font-variation-settings:"SOFT" 100;font-weight:400;letter-spacing:-.01em;font-size:24px;line-height:1.3;margin:0 0 .6rem;color:var(--ink)}
.e26-vc p,.e26-vc li,.e26-work__body p{font-size:16px;line-height:1.7;color:var(--text)}
.e26-vc p,.e26-work__body p{margin:0 0 .9rem}
.e26-vc p:last-child{margin-bottom:0}
.e26-vc ul:not(.e26-list),.e26-vc ol{margin:0 0 .9rem;padding-left:1.3rem}
.e26-vc img,.e26-work__body img{max-width:100%;height:auto;border-radius:18px;display:block}
.e26-vc a:not(.btn){color:var(--accent)}
.e26-vc .btn{display:inline-flex}
.e26-feat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem;align-items:center}
.e26-feat__copy{padding:0 1.5rem}
.e26-feat__copy > :last-child,.e26-feat__copy .e26-vc__text:last-child > :last-child{margin-bottom:0}
.e26-feat__copy h2 + p:first-of-type,.e26-feat__copy h2 + .e26-vc__text > p:first-child{font-size:17px;color:var(--muted)}
.e26-feat.is-flip .e26-feat__media{order:2}
.e26-feat__media img{border:1px solid var(--border);background:var(--soft);width:100%}
.e26-sec{max-width:860px}
.e26-sec > * + *{margin-top:1rem}
.e26-sec > h2 + .e26-vc__text,.e26-sec > h2 + p,.e26-sec > h2 + ul,.e26-sec > h2 + .e26-faq,.e26-sec > h2 + .e26-list{margin-top:.25rem}
.e26-sec > .e26-vc__text + .e26-faq,.e26-sec > .e26-vc__text + .e26-list{margin-top:1.5rem}
.e26-vc [style*="text-align"]{text-align:left!important}
.e26-vc .e26-vc__text > p:last-child,.e26-sec > p:last-child{margin-bottom:0}
.e26-sec.has-images{max-width:none}
.e26-sec.has-images img{margin:0 0 1.5rem}
.e26-faq{display:flex;flex-direction:column;border-top:1px solid var(--border);max-width:860px;margin:0 0 1rem}
.e26-q{border-bottom:1px solid var(--border)}
.e26-q summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 0;font-weight:500;font-size:16px;color:var(--ink)}
.e26-q summary::-webkit-details-marker{display:none}
.e26-q summary::after{content:"+";color:var(--accent);font-size:24px;line-height:1;font-weight:300;transition:transform .25s ease;flex-shrink:0}
.e26-q[open] summary::after{transform:rotate(45deg)}
.e26-q > div{padding:0 0 1.1rem;font-size:15px;line-height:1.65;color:var(--text);max-width:720px}
.e26-q > div p{font-size:15px}
.e26-list{list-style:none;margin:0 0 1rem;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 2.5rem;max-width:860px;align-items:start}
.e26-list li{padding:.75rem 0;border-bottom:1px solid var(--border);font-size:15px;line-height:1.5;color:var(--ink)}
.e26-logos{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;align-items:center;padding:1.5rem 0 .5rem}
.e26-logos a{display:inline-flex;align-items:center}
.e26-logos img{height:52px;width:auto;max-width:170px;border-radius:0;object-fit:contain;filter:grayscale(1);opacity:.75}
.e26-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1.5rem}
.e26-stat{background:var(--soft);border-radius:20px;padding:1.5rem}
.e26-stat b{display:block;font-size:40px;font-weight:500;line-height:1;margin-bottom:.4rem;letter-spacing:-.02em}
.e26-stat span{font-size:14px;color:var(--muted)}
.e26-vc blockquote{margin:0;padding:1.75rem;background:var(--soft);border-radius:20px;font-size:18px;line-height:1.6;color:var(--ink)}
.e26-vc blockquote footer{font-size:14px;color:var(--muted);margin-top:.75rem}
.e26-work .woo{padding-top:calc(var(--header-h) + 2.25rem)}
.e26-work.is-full{padding-top:var(--header-h)}
.e26-work__title{font-size:46px;line-height:1.15;margin:.75rem 0 1rem;max-width:900px}
.e26-work__chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1.75rem}
.e26-work__chip{font-size:13px;padding:.4rem .85rem;border-radius:999px;background:var(--grey);color:var(--text)}
.e26-work__hero img{width:100%;height:auto;border-radius:24px;margin:0 0 2.5rem;border:1px solid var(--border)}
.e26-work__body{max-width:1180px}
.e26-work__body > p,.e26-work__body > h2,.e26-work__body > h3,.e26-work__body > ul{max-width:860px}
.e26-work__more{margin:3rem 0 0}
.e26-work__more .btn{display:inline-flex}
@media (max-width:860px){
  .e26-vc{gap:2.5rem}
  .e26-feat{grid-template-columns:minmax(0,1fr);gap:1.25rem}
  .e26-feat__copy{padding:0}
  .e26-feat.is-flip .e26-feat__media{order:0}
  .e26-list{grid-template-columns:minmax(0,1fr)}
  .e26-vc h2,.e26-work__body h2{font-size:26px}
  .e26-work__title{font-size:32px}
  .e26-stat b{font-size:32px}
}

/* ============ Product description as the split-screen tabs section (inc/vc-content.php e26_vc_split) ============ */
.woo-product .woocommerce div.product .woo-split{grid-column:1/-1;margin-top:2.5rem}
.woo-product .woo-split .svc-tabs{width:100vw;margin-left:calc(50% - 50vw)}
.woo-product .woo-split .svc-tabs .jobs-head{padding-top:0}
.woo-product .woo-split .svc-text{max-width:560px}
.woo-product .woo-split .svc-text p{font-size:16px;line-height:1.7;color:var(--text);margin:0 0 .9rem}
.woo-product .woo-split .svc-text p:last-child{margin-bottom:0}
.woo-product .woo-split .svc-text ul{padding-left:1.2rem;margin:0 0 .9rem}
.woo-product .woo-split .svc-text a{color:var(--accent)}
.woo-product .woo-split .sticky-feature__panel h3{max-width:560px}
.woo-product .woo-split__rest{max-width:1180px;margin:3.5rem auto 0}
.woo-product .woocommerce div.product .woo-split + .woocommerce-tabs{margin-top:3.5rem}

/* ============ Under the split section: every block spans the full container and is spread across it ============ */
.woo-split__rest .e26-vc{gap:4.5rem}
.woo-split__rest .e26-sec,.woo-split__rest .e26-faq,.woo-split__rest .e26-list{max-width:none}
.woo-split__rest .e26-sec > h2,.woo-split__rest .e26-sec > h3:first-child{font-size:32px;line-height:1.2;margin:0}
.woo-split__rest .e26-sec > h2 + *,.woo-split__rest .e26-sec > h3:first-child + *{margin-top:1.5rem}
.woo-split__rest .e26-sec > h2 + .e26-vc__text{margin-top:.75rem}
.woo-split__rest .e26-sec > .e26-vc__text{max-width:760px}
.woo-split__rest .e26-sec > .e26-vc__text:has(.e26-info){max-width:none;margin-top:1.5rem}
.woo-split__rest .e26-sec > .e26-vc__text + *{margin-top:1.75rem}
/* Logos: one even row in a soft band */
.woo-split__rest .e26-logos{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1.75rem 2rem;align-items:center;justify-items:center;padding:2rem 2.5rem;background:var(--soft);border-radius:24px}
.woo-split__rest .e26-logos a{display:flex;align-items:center;justify-content:center}
.woo-split__rest .e26-logos img{height:auto;width:auto;max-height:56px;max-width:140px}
/* Lists ("Coming soon"): tiles across the width, three up, two up for short lists */
.woo-split__rest .e26-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:0}
.woo-split__rest .e26-list:has(li:nth-child(4):last-child),.woo-split__rest .e26-list:has(li:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.woo-split__rest .e26-list li{min-width:0;overflow-wrap:anywhere;border:1px solid var(--border);border-radius:18px;padding:1.15rem 1.35rem;background:#fff;font-size:15px;line-height:1.55;color:var(--text)}
.e26-list li b{display:block;font-weight:600;color:var(--ink);margin-bottom:.2rem}
/* Accordions: two independent columns on desktop */
.e26-faq--cols{border-top:0}
.e26-faq--cols > div{border-top:1px solid var(--border)}
.e26-faq--cols > div + div{border-top:0}
.woo-split__rest .e26-faq{margin:0}
.woo-split__rest .e26-q summary{padding:1.1rem 0}
.woo-split__rest .e26-q > div{max-width:none;padding-right:2.5rem}
/* Call to action ("Have an idea?", "Can't find the answer?") */
.e26-cta{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem;padding:2.75rem 2rem;border-radius:24px;background:radial-gradient(circle at 100% 0%,rgba(160,102,238,.14) 0,rgba(160,102,238,0) 45%),var(--soft);border:1px solid #ece8f3}
.e26-vc .e26-cta h3{margin:0;font-size:28px}
.e26-vc .e26-cta p{margin:0;max-width:560px;font-size:17px}
.e26-vc .e26-cta [style*="text-align"]{text-align:center!important}
.e26-vc .e26-cta .btn{margin-top:.9rem}
.woo-split__rest .e26-sec > .e26-cta{margin-top:3rem}
/* Technical info: label + value tiles */
.e26-vc ul.e26-info{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.e26-vc ul.e26-info li{background:var(--soft);border-radius:16px;padding:1rem 1.2rem;font-size:15px;line-height:1.5;color:var(--ink)}
.e26-vc ul.e26-info li strong{display:block;font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:.3rem}
@media (min-width:1024px){
  .woo-split__rest .e26-list:has(li:nth-child(4):last-child):not(:has(li b)){grid-template-columns:repeat(4,minmax(0,1fr))}
  .woo-split__rest .e26-faq--cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 3.5rem;align-items:start}
  .woo-split__rest .e26-faq--cols > div + div{border-top:1px solid var(--border)}
}
@media (max-width:1023px){
  .e26-vc ul.e26-info{grid-template-columns:repeat(2,minmax(0,1fr))}
  .woo-split__rest .e26-list,.woo-split__rest .e26-list:has(li:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  .woo-split__rest .e26-vc{gap:3rem}
  .woo-split__rest .e26-sec > h2,.woo-split__rest .e26-sec > h3:first-child{font-size:26px}
  .woo-split__rest .e26-logos{grid-template-columns:repeat(2,minmax(0,1fr));padding:1.5rem;gap:1.25rem}
  .woo-split__rest .e26-list,.woo-split__rest .e26-list:has(li:nth-child(4):last-child),.woo-split__rest .e26-list:has(li:nth-child(2):last-child){grid-template-columns:minmax(0,1fr)}
  .e26-vc ul.e26-info{grid-template-columns:minmax(0,1fr)}
  .e26-cta{padding:2rem 1.25rem}
  .e26-vc .e26-cta h3{font-size:24px}
  .e26-vc .e26-cta .btn{width:100%}
}