/* Need Marketing, site styles. Brand colours live in :root, change them here to refresh the palette. */
@font-face{font-family:'Bricolage Grotesque';src:url('/assets/fonts/bricolage.woff2') format('woff2');font-weight:600 800;font-display:swap}
@font-face{font-family:'Manrope';src:url('/assets/fonts/manrope.woff2') format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:'Outfit';src:url('/assets/fonts/outfit.woff2') format('woff2');font-weight:100 900;font-display:swap}

:root{
  --brand:#F05454; --brand-tint:#F36A55; --brand-deep:#B42A2A;
  --on-brand:#2A1414; --hero-head:#2A1414; --ink:#2A1414;
  --soft:#FFF1E8; --muted:#6E5450; --body:#4A3330; --rule:#F2D9CF;
  --ink-muted:#EBCFC6; --ink-line:#4A2A26;
  --pop:#FFDE59; --pop2:#FF914D;
  --p1:#FF914D; --p2:#F05454; --p3:#FFDE59;
  --l1:#FA8549; --l2:#F36A55; --l3:#FFCC55;
  --panels:linear-gradient(90deg,var(--p1) 0 25%,var(--p2) 25% 75%,var(--p3) 75% 100%);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:Manrope,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{max-width:100%}
a{color:var(--ink)}
a:hover{color:var(--brand-deep)}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.nm-h,.hd{font-family:'Bricolage Grotesque',Manrope,sans-serif;font-optical-sizing:auto}
.nm-logo{font-family:Outfit,Arial,sans-serif}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:50;background:var(--ink);color:#fff;padding:12px 16px;border-radius:10px;font-weight:700;text-decoration:none}
.skip:focus{top:12px;color:#fff}

/* panels + the n | ee | d letters */
.panels{background:var(--panels);position:relative;overflow:hidden}
.letters{position:absolute;inset:0;pointer-events:none;overflow:hidden;font-family:Outfit,Arial,sans-serif;font-weight:700;line-height:.72;letter-spacing:-.02em}
.letters .ln{position:absolute;left:0;width:25%;top:22%;display:flex;flex-direction:column;align-items:center;font-size:34vw;color:var(--l1)}
.letters .le{position:absolute;left:25%;width:50%;top:-6%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));justify-items:center;font-size:36vw;color:var(--l2)}
.letters .ld{position:absolute;left:76.5%;top:-6%;display:flex;flex-direction:column;font-size:36vw;color:var(--l3)}

/* header */
.site-header{position:relative;z-index:5}
.site-header .bar{max-width:1360px;margin:0 auto;padding:22px 32px 18px;display:flex;align-items:center;justify-content:space-between;gap:20px 28px}
.site-header .logo{display:block;height:44px}
.site-header .logo img{height:100%;width:auto;display:block}
.site-nav{display:flex;gap:8px 30px;flex-wrap:wrap;font-size:15px;font-weight:700}
.site-nav a{color:var(--on-brand);text-decoration:none;padding:6px 0;text-underline-offset:6px;text-decoration-thickness:2px}
.site-nav a[aria-current="page"],.site-nav a:hover{text-decoration:underline;color:var(--on-brand)}
.menu-btn{display:none;min-height:46px;padding:0 16px;border-radius:12px;border:1.5px solid var(--ink);background:#fff;color:var(--ink);font:800 15px Manrope,sans-serif;cursor:pointer}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:15px 24px;border-radius:12px;font-weight:800;font-size:16px;text-decoration:none;border:none;cursor:pointer;font-family:Manrope,sans-serif;line-height:1.2}
.btn-ink{background:var(--ink);color:#fff}.btn-ink:hover{color:#fff;background:#000}
.btn-brand{background:var(--brand);color:var(--on-brand)}.btn-brand:hover{color:var(--on-brand);filter:brightness(1.05)}
.btn-white{background:#fff;color:var(--ink)}.btn-white:hover{color:var(--ink)}
.btn-line{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn-sm{min-height:46px;padding:12px 20px;font-size:15px}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{border:1.5px solid var(--ink);border-radius:999px;padding:11px 18px;font:700 15px Manrope,sans-serif;cursor:pointer;min-height:46px;background:#fff;color:var(--ink);transition:background-color .18s,color .18s}
.chip[aria-pressed="true"]{background:var(--ink);color:#fff}

/* home hero */
.nm-sh{box-shadow:0 34px 60px -30px rgba(20,16,40,.55),0 2px 6px rgba(20,16,40,.08)}
.hero-grid{position:relative;max-width:1360px;margin:0 auto;padding:40px 32px 96px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:center}
.nm-stage{position:relative;height:640px}
.nm-s{position:absolute;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.9,.3,1.2)}
.nm-s.lit{opacity:1;z-index:3}
.nm-s.dim{opacity:.42;z-index:1}
.need-card{background:#fff;border-radius:20px;padding:26px 28px;display:flex;flex-direction:column;gap:18px}

/* features (home services) */
.nm-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:72px;align-items:center}
.nm-feature.flip>.nm-copy{order:2}

/* carousels and cards */
.track{display:flex;gap:32px;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.track>*{flex:0 0 calc((100% - 32px)/2)}
.icon-btn{width:54px;height:54px;border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer}
details summary{list-style:none;cursor:pointer}
details summary::-webkit-details-marker{display:none}
details[open] .nm-plus{transform:rotate(45deg)}
.nm-plus{transition:transform .2s ease;display:inline-block}
.nm-row:hover .nm-name{color:var(--brand-deep)}
.nm-row:hover .nm-go{background:var(--ink);color:#fff}
.nm-post:hover .nm-post-title{text-decoration:underline;text-underline-offset:5px}
.filters .chip{min-height:46px}

/* forms */
.field{display:flex;flex-direction:column;gap:8px;font-size:15px;font-weight:800}
.input{width:100%;min-height:54px;border-radius:12px;border:1.5px solid var(--rule);background:#fff;color:var(--ink);padding:14px 16px;font:16px Manrope,sans-serif}
.input:focus{border-color:var(--ink);outline:none}

/* floating WhatsApp */
.wa-float{position:fixed;right:20px;bottom:20px;z-index:40;display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:#fff;text-decoration:none;font-weight:800;font-size:15px;padding:14px 20px;border-radius:999px;min-height:54px;box-shadow:0 14px 30px -12px rgba(42,20,20,.6)}
.wa-float:hover{color:#fff}

/* footer */
.site-footer{background:var(--ink);color:var(--ink-muted);padding:72px 32px 36px}
.site-footer a{color:var(--ink-muted);text-decoration:none}
.site-footer a:hover{color:#fff}
.site-footer h2{margin:0 0 4px;font-size:15px;font-weight:800;color:#fff}

@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr}
  .nm-stage{height:auto;display:flex;flex-direction:column;align-items:center;gap:20px}
  .nm-s{position:static!important;transform:none!important;opacity:1!important;max-width:100%;width:auto!important}
  .nm-feature{grid-template-columns:1fr;gap:36px}
  .nm-feature.flip>.nm-copy{order:0}
  .track>*{flex:0 0 88%}
}
@media (max-width:860px){
  .menu-btn{display:inline-flex;align-items:center}
  .site-header .bar{flex-wrap:wrap}
  .site-nav{display:none;order:3;width:100%;flex-direction:column;gap:0;background:#fff;border-radius:16px;padding:8px 18px}
  .site-nav a{color:var(--ink);padding:14px 0;border-bottom:1px solid var(--rule)}
  .site-nav a:last-child{border-bottom:none}
  .site-header.open .site-nav{display:flex}
  .site-header .cta{display:none}
  .nm-row{grid-template-columns:1fr!important;gap:14px!important}
  .wa-float span{display:none}
  .wa-float{padding:14px}
}
@media (max-width:600px){
  .site-header .bar,.hero-grid{padding-left:20px;padding-right:20px}
  section{padding-left:20px!important;padding-right:20px!important}
  .site-footer{padding-left:20px;padding-right:20px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
.svc-tag{background:var(--soft);color:var(--ink);border-radius:8px;padding:6px 10px;font-size:14px;font-weight:700}
.concept{display:flex;flex-direction:column;gap:16px;color:inherit;text-decoration:none}
.concept .tile{aspect-ratio:16/9;border-radius:24px;display:flex;flex-direction:column;justify-content:space-between;padding:26px;color:#2A1414}
.concept .tag{align-self:flex-start;background:#2A1414;color:#fff;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:800}
[hidden]{display:none!important}
