/* multi-import:brand-layer:start - managed by Tools > Multi Import; edits inside are replaced on re-import */
/* Mississauga Carpet and Flooring - overrides.css
   Documented tokens (references/style.md) plus safe custom rules.
   Brand: Futura + warm carpet neutrals (beige, taupe, warm gray). */

/* 1. Self-hosted Futura (shipped in styles/assets/fonts/, installed to assets/dist/fonts/). */
@font-face{font-family:'Futura';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/futura-book.woff2') format('woff2');}
@font-face{font-family:'Futura';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/futura-medium.woff2') format('woff2');}
@font-face{font-family:'Futura';font-style:normal;font-weight:700;font-display:swap;
  src:url('../fonts/futura-bold.woff2') format('woff2');}

:root{
  /* Fonts */
  --typography-family-heading:'Futura','Century Gothic','Trebuchet MS',sans-serif;
  --typography-family-main:'Futura','Century Gothic',system-ui,-apple-system,sans-serif;
  --typography-family-paragraph:'Futura','Century Gothic',system-ui,sans-serif;

  /* Brand hues - warm taupe/coffee */
  --color-sienna:#7d6547;
  --color-sienna-deep:#5f4c34;
  --color-canadian-red:#9a8d7a;

  /* Direct role pins */
  --color-primary:#7d6547;
  --color-secondary:#5f4c34;
  --color-accent:#7d6547;
  --color-accent-hover:#5f4c34;
  --color-link-text:#7d6547;
  --color-link-text-hover:#5f4c34;

  /* Surfaces and ink - beige, taupe, warm gray */
  --color-paper:#ffffff;
  --color-paper-tint:#f5efe4;
  --color-paper-deep:#eae0d1;
  --color-rule:#dcd2c0;
  --color-ink:#2c261e;
  --color-ink-soft:#6a6153;
}

/* Page background */
body{background:#f8f3ea;}

/* ---------- Scrollbars: warm palette, styled on BOTH vertical and horizontal ---------- */
html,*{scrollbar-width:thin;scrollbar-color:#7d6547 #eae0d1;}        /* Firefox */
::-webkit-scrollbar{width:12px;height:12px;}                         /* height = the horizontal bar */
::-webkit-scrollbar-track{background:#eae0d1;}
::-webkit-scrollbar-thumb{
  background:linear-gradient(#8a6f50,#6f5941);
  border:3px solid #eae0d1;
  border-radius:8px;}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(#6f5941,#5f4c34);}
/* horizontal thumb: wood grain runs along its length */
::-webkit-scrollbar-thumb:horizontal{
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,0.10) 0 2px, rgba(0,0,0,0.08) 2px 10px),
    linear-gradient(#8a6f50,#6f5941);}
::-webkit-scrollbar-corner{background:#eae0d1;}

/* ---------- Wood-plank CTA ---------- */
/* CTA banner reads as a laid plank floor */
.block-cta-banner{
  background-color:#5f4c34;
  background-image:
    repeating-linear-gradient(90deg, rgba(0,0,0,0.24) 0 2px, rgba(0,0,0,0) 2px 220px),        /* plank seams */
    repeating-linear-gradient(0deg,  rgba(0,0,0,0.16) 0 1px, rgba(0,0,0,0) 1px 60px),          /* course lines */
    repeating-linear-gradient(0deg,  rgba(255,255,255,0.045) 0 3px, rgba(0,0,0,0.05) 3px 9px); /* fine grain */
}
.block-cta-banner :is(h1,h2,h3,h4,p,span){color:#f7f2ea;}

/* Primary CTA buttons look like a single raised plank */
.wp-block-button__link, .wp-element-button,
a.btn, .btn, .btn-primary, .button,
button[type="submit"], input[type="submit"],
.block-cta-banner a[href], .service-hero a[href^="/contact"], .hero a[href^="/contact"]{
  color:#f7f2ea !important;
  background-color:#7d6547;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,0.16), rgba(0,0,0,0.16)),                         /* bevel: lit top, shaded base */
    repeating-linear-gradient(0deg, rgba(255,255,255,0.06) 0 2px, rgba(0,0,0,0.06) 2px 9px);   /* grain along the plank */
  border:1px solid #4f3f2c;
  border-radius:4px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.25),
    inset 0 -2px 0 rgba(0,0,0,0.22),
    0 2px 4px rgba(0,0,0,0.20);
  text-shadow:0 1px 0 rgba(0,0,0,0.28);
  letter-spacing:0.02em;
  transition:transform .08s ease, box-shadow .12s ease, background-color .12s ease;
}
.wp-block-button__link:hover, .wp-element-button:hover, a.btn:hover, .btn:hover, .button:hover,
button[type="submit"]:hover, input[type="submit"]:hover, .block-cta-banner a[href]:hover{
  background-color:#6b543c;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.20),
    inset 0 -2px 0 rgba(0,0,0,0.26),
    0 4px 9px rgba(0,0,0,0.24);
  transform:translateY(-1px);
}
.wp-block-button__link:active, .wp-element-button:active, .btn:active, .button:active,
button[type="submit"]:active, input[type="submit"]:active, .block-cta-banner a[href]:active{
  transform:translateY(1px);
  box-shadow:inset 0 2px 5px rgba(0,0,0,0.32);
}

/* ---------- Process steps: hide the connector element between steps ---------- */
.process-step + .process-step::before,
.process-step + .process-step:before{ content:none !important; display:none !important; }
/* multi-import:brand-layer:end */