/* Wordriders — shared styles. Page layout (block positions) lives in each page's <style>,
   generated from measurements of the original site. */

@font-face {
  font-family: "Butler";
  src: url("fonts/butler-bold.woff2") format("woff2");
  font-display: swap;
}
/* Only the regular cut is loaded, as on the original, so bold text is synthesised. */
@font-face {
  font-family: "Inter Wix";
  src: url("fonts/inter-regular.woff2") format("woff2");
  font-display: swap;
}

:root {
  --ff-butler: "Butler", Georgia, serif;
  --ff-inter: "Inter Wix", Helvetica, Arial, sans-serif;
  --gold: 217, 198, 122;
  --teal: 4, 45, 41;

  /* the original's theme text styles */
  --font_0: normal normal normal 60px/1.4em var(--ff-butler);
  --font_1: normal normal normal 16px/1.4em var(--ff-inter);
  --font_2: normal normal normal 40px/1.4em var(--ff-butler);
  --font_3: normal normal normal 38px/1.4em var(--ff-butler);
  --font_4: normal normal normal 35px/1.4em var(--ff-butler);
  --font_5: normal normal normal 27px/1.4em var(--ff-butler);
  --font_6: normal normal normal 25px/1.4em var(--ff-butler);
  --font_7: normal normal normal 22px/1.4em var(--ff-inter);
  --font_8: normal normal normal 16px/1.4em var(--ff-inter);
  --font_9: normal normal normal 14px/1.4em var(--ff-inter);
  --font_10: normal normal normal 12px/1.4em var(--ff-inter);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  min-width: 980px;
  background: #fff;
  color: #000;
  font: 16px/1.4 var(--ff-inter);
  overflow-x: hidden;
}
img { display: block; max-width: none; }
a { color: inherit; }
button { font: inherit; }

.skip-link {
  position: absolute; left: 50%; top: -60px; z-index: 100;
  transform: translateX(-50%);
  padding: 10px 16px; background: #fff; color: #116dff;
  font: 14px Helvetica, Arial, sans-serif; text-decoration: none;
}
.skip-link:focus { top: 8px; }

/* ------------------------------------------------------------ positioned blocks */
.sec { position: relative; overflow: hidden; }
.c { position: absolute; }
.bg { position: absolute; overflow: hidden; }
.fill { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bg picture, .box picture { display: contents; }
.img img, .img picture { width: 100%; height: 100%; object-fit: cover; }
.img a { display: block; width: 100%; height: 100%; }
.vec svg { display: block; width: 100%; height: 100%; }
.m-only { display: none; }

/* ------------------------------------------------------------ Wix rich text */
.rt { overflow-wrap: break-word; }
.rt :where(p, h1, h2, h3, h4, h5, h6, ul, ol) { margin: 0; font-weight: normal; }
.rt :where(ul, ol) { padding-left: 1.3em; }
.rt a { color: inherit; text-decoration: none; }
.rt a:hover { text-decoration: none; }
.font_0 { font: var(--font_0); color: #000; }
.font_1 { font: var(--font_1); color: rgb(89, 89, 89); }
.font_2 { font: var(--font_2); color: #000; }
.font_3 { font: var(--font_3); color: #000; }
.font_4 { font: var(--font_4); color: #000; }
.font_5 { font: var(--font_5); color: #000; }
.font_6 { font: var(--font_6); color: #000; }
.font_7 { font: var(--font_7); color: #000; }
.font_8 { font: var(--font_8); color: #000; }
.font_9 { font: var(--font_9); color: rgb(89, 89, 89); }
.font_10 { font: var(--font_10); color: rgb(89, 89, 89); }
.color_11, .color_36, .color_0, .color_1, .color_8 { color: #fff; }
.color_15, .color_2, .color_37, .color_45, .color_46 { color: #000; }
.color_18, .color_41, .color_48, .color_49 { color: rgb(var(--gold)); }
.color_42 { color: rgb(235, 230, 224); }
.color_43 { color: rgb(var(--teal)); }

/* ------------------------------------------------------------ buttons */
.btn {
  display: flex; align-items: center; justify-content: center;
  text-decoration: none; white-space: nowrap;
  transition: background-color .2s ease, color .2s ease;
}
.btn span { transition: color .2s ease; }
.btn.icon svg {
  display: block; width: var(--icon-w); height: var(--icon-h);
  transition: width .2s ease, height .2s ease;
}

/* ------------------------------------------------------------ header */
#SITE_HEADER { z-index: 20; }
#site-nav { height: 48px; }
#nav { display: flex; height: 100%; margin: 0; padding: 0; list-style: none; }
#nav li { padding: 4px; }
#nav a {
  display: flex; align-items: center; justify-content: center;
  height: 40px; padding: 10px;
  border-top: 1px solid transparent; border-bottom: 1px solid transparent;
  font: 700 16px/1.4 var(--ff-inter); color: #000; text-decoration: none;
  transition: border-color .2s ease;
}
#nav a:hover { border-color: rgb(var(--gold)); }
#nav a[aria-current="page"] { color: rgb(var(--gold)); }
.nav-toggle { display: none; }

/* ------------------------------------------------------------ category cards */
/* zoom the photo inside the card's fixed frame; lifting the card itself would
   paint it over the caption bar + title that sit on top of its bottom edge */
.card { overflow: hidden; }
.card .fill { transition: transform .2s ease; }
.card:hover .fill { transform: scale(1.02); }

/* ------------------------------------------------------------ testimonials slideshow */
.review-slider { overflow: hidden; }
.rv-track { position: absolute; inset: 0; }
.rv-slide { position: absolute; inset: 0; }
.rv-slide:not(.is-active) { visibility: hidden; }
.rv-slide.is-moving { visibility: visible; transition: transform var(--rv-dur, 1s) ease-in-out; }
.rv-prev, .rv-next {
  position: absolute; top: 50%; z-index: 2;
  width: 15px; height: 32px; margin-top: -16px; padding: 0;
  border: 0; background: none; cursor: pointer; fill: rgb(var(--gold));
}
.rv-prev { left: 6px; }
.rv-next { right: 6px; transform: scaleX(-1); }
.rv-prev svg, .rv-next svg { display: block; width: 15px; height: 29px; }
.rv-dots {
  position: absolute; left: 0; right: 0; bottom: 10px; z-index: 2;
  display: flex; justify-content: center; align-items: center; gap: 11px;
}
.rv-dot {
  width: 7px; height: 7px; padding: 0; border: 0; border-radius: 50%;
  background: rgb(var(--gold)); cursor: pointer;
}
.rv-dot.is-active { width: 11px; height: 11px; background: transparent; border: 2px solid rgb(var(--gold)); }

/* ------------------------------------------------------------ contact form */
.wixform label {
  position: absolute; font: 14px/17px var(--ff-inter); color: #000;
}
.wixform .fbox {
  position: absolute; background: rgba(var(--gold), .2); border-radius: 10px;
}
.wixform input:not([type=hidden]), .wixform textarea {
  display: block; width: 100%; height: 100%; margin: 0; padding: 8px 12px;
  border: 0; border-radius: 10px; background: transparent;
  font: 16px/20px var(--ff-inter); color: #000; outline: none;
}
.wixform textarea { padding: 8px 12px; resize: none; }
.wixform .fbox:focus-within { box-shadow: 0 0 0 1px #000; }
.wixform .tel .fbox { display: flex; align-items: center; }
.wixform .tel input { padding-left: 4px; }
.wixform .cc { display: flex; align-items: center; flex: none; padding-left: 12px; }
.wixform .cc svg:first-child { width: 24px; height: 24px; }
.wixform .cc svg:last-child { width: 16px; height: 16px; }
.wixform .form-submit {
  position: absolute; border: 0; cursor: pointer; transition: opacity .2s ease;
}
.wixform .form-submit:hover { opacity: .85; }
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ------------------------------------------------------------ entrance motion (as on the original) */
@keyframes motion-floatIn {
  0% { opacity: 0; transform: translate(var(--tx, 0), var(--ty, 0)); }
  100% { opacity: 1; transform: none; }
}
@keyframes motion-slideIn {
  0% { transform: translateY(100%); clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%); }
  100% { transform: none; clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); }
}
@keyframes motion-spin { from { rotate: -360deg; } to { rotate: 0deg; } }
@media (prefers-reduced-motion: no-preference) {
  .js [data-motion^="float"]:not(.is-in) { opacity: 0; }
  .js [data-motion^="float"].is-in { animation: motion-floatIn 1.2s cubic-bezier(.445, .05, .55, .95) backwards; }
  [data-motion="float-l"] { --tx: -60px; }
  [data-motion="float-r"] { --tx: 60px; }
  [data-motion="float-u"] { --ty: 60px; }
  .js [data-motion="slide-up"]:not(.is-in) { clip-path: polygon(0 0, 0 0, 0 0); }
  .js [data-motion="slide-up"].is-in { animation: motion-slideIn 1.2s cubic-bezier(.645, .045, .355, 1) backwards; }
  [data-spin] { animation: motion-spin 7s linear infinite; }
}

/* ------------------------------------------------------------ Wix mobile layout (320px wide) */
@media (max-width: 750px) {
  body { min-width: 0; }
  .d-only { display: none; }
  .m-only { display: block; }
  #site-nav {
    position: fixed; z-index: 30; display: none;
    /* !important: beats the desktop position the page's own layout rules give the menu */
    inset: 0 !important; width: auto !important; height: auto !important;
    padding-top: 58px; background: #fff;
  }
  #site-nav.is-open { display: block; }
  #nav { flex-direction: column; align-items: center; height: auto; }
  #nav li { width: 188px !important; padding: 0; }
  #nav a {
    height: 51px; padding: 0; border: 0;
    font: 400 18px/51px var(--ff-inter);
  }
  .nav-toggle {
    display: block; left: calc(50% + 90px); top: 9px; z-index: 40;
    width: 50px; height: 50px; padding: 0; border: 0; background: none; cursor: pointer;
  }
  .nav-toggle span {
    position: absolute; left: 14px; width: 22px; height: 2px; border-radius: 2px; background: #000;
    transition: transform .2s ease, opacity .2s ease;
  }
  .nav-toggle span:nth-child(1) { top: 17px; }
  .nav-toggle span:nth-child(2) { top: 24px; }
  .nav-toggle span:nth-child(3) { top: 31px; }
  .nav-open .nav-toggle { position: fixed; }
  .nav-open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
  .nav-open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .nav-open { overflow: hidden; }
}
