/* Masterpiece Design/Build - base styles.
   Merged from the per-page inline <style> blocks of the static site so every
   page shares one stylesheet. Interaction rules live in mp.css. */

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html,body{ margin:0; padding:0; }
body{ background:#F7F4EE; font-family:'Poppins',sans-serif; -webkit-font-smoothing:antialiased; color:#20251E; padding-bottom:64px; }
::selection{ background:#00833E; color:#fff; }

@keyframes heroFade{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:translateY(0); } }
@keyframes scrollCue{ 0%{ transform:rotate(45deg) translate(0,0); opacity:.45; } 50%{ transform:rotate(45deg) translate(5px,5px); opacity:1; } 100%{ transform:rotate(45deg) translate(0,0); opacity:.45; } }

.mp-work{ transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.mp-work:hover{ transform:translateY(-6px); }
.mp-card{ transition:transform .6s cubic-bezier(.2,.7,.2,1), box-shadow .6s ease; }
.mp-card:hover{ transform:translateY(-5px); box-shadow:0 20px 44px -28px rgba(32,37,30,.4); }
.mp-link{ position:relative; }
.mp-link::after{ content:''; position:absolute; left:0; bottom:-6px; height:1px; width:0; background:currentColor; transition:width .4s cubic-bezier(.2,.7,.2,1); }
.mp-link:hover::after{ width:100%; }
.mp-mega div{ transition:color .25s ease; }
.mp-mega:hover div:first-child{ color:#00833E; }
.mp-cta{ transition:background .35s ease, color .35s ease, border-color .35s ease; }

[data-reveal]{ transition:opacity 1s cubic-bezier(.2,.7,.2,1), transform 1s cubic-bezier(.2,.7,.2,1); }
[data-reveal].pre{ opacity:0; transform:translateY(26px); }
[data-reveal].in{ opacity:1 !important; transform:none !important; }

a:focus-visible, button:focus-visible{ outline:2px solid #00833E; outline-offset:3px; border-radius:2px; }

[data-r="burger"]{ display:none; }

@media (max-width:1120px){ [data-r="navlinks"]{ gap:24px; } }

@media (max-width:1000px){
  [data-r="navlinks"]{ display:none !important; }
  [data-r="burger"]{ display:flex !important; }
  [data-r="split"]{ grid-template-columns:1fr !important; gap:46px !important; }
  [data-r="cols2"]{ grid-template-columns:1fr !important; }
  [data-r="cols3"]{ grid-template-columns:1fr 1fr !important; }
  [data-r="process"]{ grid-template-columns:1fr 1fr !important; row-gap:48px; }
  [data-r="pillars"]{ grid-template-columns:1fr 1fr !important; }
  [data-r="adv"]{ grid-template-columns:1fr !important; }
  [data-r="hl"], [data-r="ba2"], [data-r="main"], [data-r="phases"], [data-r="vs"], [data-r="form2"]{ grid-template-columns:1fr !important; }
  [data-r="hl"] > [style*="order:1"], [data-r="hl"] > [style*="order:2"]{ order:0 !important; }
  [data-r="benefits"], [data-r="expect"], [data-r="gallery"], [data-r="team"], [data-r="work3"], [data-r="proof"], [data-r="services"], [data-r="five"]{ grid-template-columns:1fr 1fr !important; }
  [data-r="stats"]{ grid-template-columns:1fr 1fr !important; }
  [data-r="do4"]{ grid-template-columns:1fr 1fr !important; }
  [data-r="values"]{ grid-template-columns:1fr 1fr !important; }
  [data-r="footcols"]{ grid-template-columns:1fr 1fr !important; gap:40px !important; }
  [data-r="sig"]{ grid-template-columns:1fr !important; gap:34px !important; }
  [data-r="sig"] > div[style*="order:2"]{ order:0 !important; }
  [data-r="sig"] > div[style*="order:1"]{ order:0 !important; }
  [data-r="grid3"]{ grid-template-columns:1fr 1fr !important; }
}

@media (max-width:620px){
  [data-r="statgrid"]{ grid-template-columns:1fr !important; }
  [data-r="cols3"]{ grid-template-columns:1fr !important; }
  [data-r="process"]{ grid-template-columns:1fr !important; }
  [data-r="pillars"]{ grid-template-columns:1fr !important; }
  [data-r="benefits"], [data-r="expect"], [data-r="gallery"], [data-r="team"], [data-r="work3"], [data-r="proof"], [data-r="services"], [data-r="five"]{ grid-template-columns:1fr !important; }
  [data-r="stats"]{ grid-template-columns:1fr !important; }
  [data-r="do4"]{ grid-template-columns:1fr !important; }
  [data-r="values"]{ grid-template-columns:1fr !important; }
  [data-r="footcols"]{ grid-template-columns:1fr !important; }
  [data-r="grid3"]{ grid-template-columns:1fr !important; }
  [data-r="bartext"]{ display:none !important; }
  [data-r="barwrap"]{ justify-content:center !important; padding-left:20px !important; padding-right:20px !important; }
}

/* portfolio gallery filter (default: no gfilter attr => all visible) */
body[data-gfilter="custom"] .gal-item[data-type="renovation"]{ display:none !important; }
body[data-gfilter="reno"] .gal-item[data-type="custom"]{ display:none !important; }

/* portfolio filter buttons: active state driven by data-gfilter (default = All) */
.gf-btn{ background:transparent; color:#20251E; }
body:not([data-gfilter]) .gf-all,
body[data-gfilter="all"] .gf-all,
body[data-gfilter="custom"] .gf-custom,
body[data-gfilter="reno"] .gf-reno{ background:#00833E; color:#fff; }

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
  html{ scroll-behavior:auto; }
  [data-reveal]{ opacity:1 !important; transform:none !important; }
}