/* Typography: Archivo 900 (display) · Manrope 600-800 (UI/body, weight-aliased) · Jost 500 (dropdown descriptions) */
@font-face {
  font-family: 'Archivo';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/archivo-900i-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/archivo-900i-latin.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: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/archivo-900-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/archivo-900-latin.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: 'Manrope';
  font-style: normal;
  font-weight: 100 649;
  font-display: swap;
  src: url("../fonts/manrope-600-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 100 649;
  font-display: swap;
  src: url("../fonts/manrope-600-latin.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: 'Manrope';
  font-style: normal;
  font-weight: 650 749;
  font-display: swap;
  src: url("../fonts/manrope-700-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 650 749;
  font-display: swap;
  src: url("../fonts/manrope-700-latin.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: 'Manrope';
  font-style: normal;
  font-weight: 750 900;
  font-display: swap;
  src: url("../fonts/manrope-800-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 750 900;
  font-display: swap;
  src: url("../fonts/manrope-800-latin.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: 'Jost';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/ed0da5ea.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/9e1d33c3.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/b998964d.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;
}

/* ===== MN Homes Renovation — base styles (matches Claude Design export) ===== */
*{box-sizing:border-box}
body{margin:0;background:#050506;font-family:'Manrope',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
@keyframes mnReveal{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
@keyframes mnDrop{from{opacity:0;transform:translateY(-12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes mnDropItem{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}

/* hover/focus states (originally style-hover / style-focus in the design runtime) */
.hv-gold:hover{color:#c9a45c !important}
.hv-goldbg:hover{background:#d8b673 !important}
.hv-softbg:hover{background:rgba(201,164,92,.1) !important}
.hv-dim:hover{opacity:.7 !important}
.hv-black:hover{background:#000 !important}
.hv-bord:hover{border-color:rgba(201,164,92,.4) !important}
.hv-bord45:hover{border-color:rgba(201,164,92,.45) !important}
.fc-gold:focus{border-color:#c9a45c !important}

/* blog article body */
.mn-article{font-family:'Manrope';font-size:15px;line-height:1.95;color:rgba(240,235,225,.72);max-width:760px}
.mn-article p{margin:0 0 22px}
.mn-article h2{font-family:'Archivo',sans-serif;font-weight:600;font-size:28px;line-height:1.25;color:#f0ebe1;margin:38px 0 16px}
.mn-article h3{font-family:'Archivo',sans-serif;font-weight:600;font-size:21px;line-height:1.3;color:#f0ebe1;margin:30px 0 12px}
.mn-article ul{margin:0 0 22px;padding-left:22px}
.mn-article li{margin-bottom:10px}
.mn-article li::marker{color:#c9a45c}
.mn-article strong{color:#f0ebe1;font-weight:600}
.mn-article em{color:rgba(240,235,225,.85)}
.mn-article a{color:#c9a45c;text-decoration:none;border-bottom:1px solid rgba(201,164,92,.4)}
.mn-article a:hover{opacity:.75}

/* ============================================================
   Cross-browser + responsive layer
   Desktop (>960px) is untouched — these rules only re-flow the
   fixed 1440px design for tablets and phones.
   ============================================================ */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
#mn-ba{-webkit-user-select:none}
img{max-width:100%}

/* mobile menu (hidden on desktop) */
#mn-burger{display:none;width:44px;height:44px;border:1px solid rgba(255,255,255,.14);border-radius:10px;align-items:center;justify-content:center;color:#f0ebe1;font-size:19px;cursor:pointer;-webkit-user-select:none;user-select:none}
#mn-mobile-menu{display:none;position:absolute;top:100%;left:0;right:0;z-index:80;background:#0a0a0c;border-bottom:1px solid rgba(201,164,92,.25);box-shadow:0 40px 80px rgba(0,0,0,.6);padding:10px 20px 22px;flex-direction:column;animation:mnDrop .25s cubic-bezier(.2,.8,.2,1)}
#mn-mobile-menu.open{display:flex}
.mn-mitem{font-family:'Manrope';font-size:13px;letter-spacing:.13em;text-transform:uppercase;font-weight:500;color:rgba(240,235,225,.75);padding:13px 4px;border-bottom:1px solid rgba(255,255,255,.06);cursor:pointer}
.mn-mitem:active{color:#c9a45c}
.mn-mlabel{font-family:'Manrope';font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;font-weight:600;color:#c9a45c;padding:18px 4px 6px}
.mn-mcta{margin-top:18px;background:#c9a45c;color:#0c0c0e;font-family:'Manrope';font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:15px 26px;border-radius:999px;text-align:center;cursor:pointer}

/* ---------- tablet: ≤960px ---------- */
@media (max-width:960px){
  #mn-navbar{display:none!important}
  #mn-quote-btn{display:none!important}
  #mn-burger{display:flex}
  #mn-header{padding:12px 20px!important}
  #mn-header img{height:60px!important}

  #mn-main section{padding-left:32px!important;padding-right:32px!important}
  #mn-main section[style*="repeat(3,1fr)"]{grid-template-columns:repeat(2,1fr)!important}
  #mn-main section[style*="repeat(4,1fr)"]{grid-template-columns:repeat(2,1fr)!important}
  #mn-main section[style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr!important}
  #mn-main section[style*="display:flex"]{flex-wrap:wrap!important}

  #mn-main h1{font-size:44px!important;font-size:clamp(40px,6.5vw,60px)!important}

  /* home hero: right visual becomes narrower */
  #mn-hero-par{width:42%!important}
  /* home "why" decorative panel needs height once stacked */
  [data-page="home"] section div[style*="clip-path"]{min-height:220px}

  footer{padding:44px 32px 26px!important}
  footer > div:first-child{grid-template-columns:1fr 1fr!important;row-gap:34px}
}

/* ---------- phone: ≤640px ---------- */
@media (max-width:640px){
  #mn-main section{padding-left:20px!important;padding-right:20px!important}
  #mn-main section[style*="grid-template-columns"]{grid-template-columns:1fr!important}
  #mn-main section div[style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr!important}

  #mn-main h1{font-size:36px!important;font-size:clamp(32px,9.5vw,44px)!important;line-height:1.12!important}
  #mn-main h2{font-size:27px!important;font-size:clamp(24px,7.5vw,34px)!important;line-height:1.2!important}
  #mn-main input{font-size:16px!important} /* prevents iOS focus zoom */

  /* home hero: full-width text, hide decorative panel */
  [data-page="home"] > section:first-child{height:auto!important;min-height:0!important;padding-top:64px!important;padding-bottom:56px!important}
  [data-page="home"] > section:first-child > div:first-child{padding:0!important;max-width:100%!important}
  #mn-hero-par{display:none!important}

  /* stats bar: 2×2 grid, hide divider lines */
  [data-page="home"] > section:nth-child(2){display:grid!important;grid-template-columns:1fr 1fr!important;gap:24px!important;padding-top:28px!important;padding-bottom:28px!important}
  [data-page="home"] > section:nth-child(2) > div[style*="width:1px"]{display:none!important}

  /* before/after slider */
  #mn-ba{height:280px!important}

  /* about: hide absolute decorative panel */
  [data-page="about"] section > div[style*="position:absolute"]{display:none!important}

  /* case study hero photo */
  [data-page="case"] section > div[style*="height:440px"]{height:220px!important}
  [data-page="case"] section[style*="margin:34px 52px"]{margin-left:20px!important;margin-right:20px!important}

  footer{padding:40px 20px 24px!important}
  footer > div:first-child{grid-template-columns:1fr!important}
  footer > div:last-child{flex-direction:column!important;gap:8px!important;align-items:flex-start!important}
}

/* hero: fade the diagonal edge into the background instead of a hard clip line */
#mn-hero-par{
  -webkit-mask-image:linear-gradient(104deg,transparent 8%,rgba(0,0,0,.5) 22%,#000 36%);
  mask-image:linear-gradient(104deg,transparent 8%,rgba(0,0,0,.5) 22%,#000 36%);
}

/* feathered diagonal edges: photo panels blend into the background (clip-path stays as a fallback) */
.mn-fade-diag{
  -webkit-mask-image:linear-gradient(104deg,transparent 6%,rgba(0,0,0,.5) 19%,#000 34%);
  mask-image:linear-gradient(104deg,transparent 6%,rgba(0,0,0,.5) 19%,#000 34%);
}
