/*
Theme Name: Nex Pinnacle Global
Theme URI: https://nxtpinnacaleglobal.com
Author: Nex Pinnacle Global
Author URI: https://nxtpinnacaleglobal.com
Description: Custom WordPress theme for Nex Pinnacle Global - premium interior design studio. Includes enquiry-to-payment pipeline (Stripe), auto-generated PDF quotes/invoices, n8n automation hooks, and an admin dashboard for lead & payment management.
Version: 1.9.1
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: nxtpinnacaleglobal
*/

/* ============================================================
   DESIGN TOKENS
   ------------------------------------------------------------
   Change a value here and it changes everywhere on the site.

   WHAT WAS WRONG BEFORE: the palette was rebranded by overwriting
   the VALUES of variables whose NAMES said something else --
   --npg-gold held #127A4C (a green), --npg-charcoal held #0B3D2A
   (also green), --npg-cream held #ffffff. The result was a site
   that was green on green with no gold and no black anywhere,
   which is why it never looked premium.

   The names below now match what they hold. The old names are
   kept at the bottom as aliases so no existing template breaks.
   ============================================================ */
:root{
  /* --- Green --- */
  --npg-green-900:#062A1F;   /* deepest: footer, dark bands   */
  --npg-green-700:#0B3D2E;   /* primary brand green           */
  --npg-green-500:#14563F;   /* hover / secondary             */
  --npg-green-300:#127A4C;   /* bright green (legacy accent)  */
  --npg-green-050:#E3EEE7;   /* pale wash — deepened, the original was almost indistinguishable from white */

  /* --- Gold (actual gold this time) --- */
  --npg-gold-600:#A88318;    /* gold text on white, AA safe   */
  --npg-gold-500:#C9A227;    /* primary gold                  */
  --npg-gold-300:#E3C972;    /* gold on dark backgrounds      */
  --npg-gold-050:#FBF6E7;    /* gold wash                     */

  /* --- Black --- */
  --npg-black:#101010;
  --npg-ink:#1C1C1C;         /* body text                     */
  --npg-muted:#6B6B6B;       /* secondary text                */

  /* --- White --- */
  --npg-white:#FFFFFF;
  --npg-ivory:#F2EEE5;       /* alternating section background — deepened for the same reason */
  --npg-line:#E4E2DC;        /* hairlines                     */

  /* --- Type: Poppins only, one fixed scale --- */
  --npg-font:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  --fs-eyebrow:12px;                            /* section label      */
  --fs-h1:clamp(38px,26px + 3.4vw,68px);        /* page / hero title  */
  --fs-h2:clamp(28px,21px + 2vw,44px);          /* section topic      */
  --fs-h3:clamp(20px,18px + .6vw,24px);         /* sub-topic          */
  --fs-h4:17px;                                 /* card title         */
  --fs-body:17px;                               /* body copy          */
  --fs-small:15px;                              /* caption / button   */
  --fs-tiny:13px;                               /* meta               */

  --lh-tight:1.14; --lh-heading:1.24; --lh-body:1.75;
  --ls-eyebrow:.18em; --ls-tight:-.02em;

  /* --- Spacing (8pt) --- */
  --sp-1:8px;  --sp-2:16px; --sp-3:24px; --sp-4:32px;
  --sp-5:48px; --sp-6:64px; --sp-7:96px;
  --npg-section-y:clamp(64px,48px + 4vw,112px);

  --npg-radius:2px;
  /* Deepened from the original pass — cards were reading flat because
     they carried almost no shadow until :hover. These are stronger and
     now used at rest, not just on interaction. */
  --npg-shadow:0 1px 2px rgba(6,42,31,.06),0 3px 10px rgba(6,42,31,.07),0 16px 36px rgba(6,42,31,.10);
  --npg-shadow-lg:0 2px 4px rgba(6,42,31,.08),0 8px 20px rgba(6,42,31,.10),0 30px 64px rgba(6,42,31,.16);
  --npg-shadow-inset:inset 0 1px 0 rgba(255,255,255,.6);
  --npg-ease:cubic-bezier(.22,.61,.36,1);

  /* ------------------------------------------------------------
     LEGACY ALIASES -- existing templates still reference these.
     They now point at the correct colour instead of a green one.
     ------------------------------------------------------------ */
  --npg-charcoal:var(--npg-green-700);   /* was #0B3D2A */
  --npg-cream:var(--npg-white);
  --npg-gold:var(--npg-gold-500);        /* was #127A4C -- a green! */
  --npg-sand:var(--npg-line);
  --npg-text:var(--npg-ink);
  --npg-font-head:var(--npg-font);
  --npg-font-body:var(--npg-font);
  --npg-font-mono:var(--npg-font);
  --npg-green-deep:var(--npg-green-900);
  --npg-green-mid:var(--npg-green-500);
  --npg-green-light:var(--npg-green-050);
  --npg-luxury-green:var(--npg-green-700);
  --npg-footer-bg:var(--npg-black);
  --npg-footer-text:var(--npg-white);
}

/* Dual-colour headings: wrap part of any title in <em> to turn it gold. */
h1 em,h2 em,h3 em,h4 em{font-style:normal;color:var(--npg-gold-600);}
.npg-dark h1 em,.npg-dark h2 em,.npg-dark h3 em{color:var(--npg-gold-300);}

/* Standard type scale applied to real headings. */
h1{font-size:var(--fs-h1);line-height:var(--lh-tight);letter-spacing:var(--ls-tight);}
h2{font-size:var(--fs-h2);line-height:var(--lh-heading);letter-spacing:var(--ls-tight);}
h3{font-size:var(--fs-h3);line-height:var(--lh-heading);}
h4{font-size:var(--fs-h4);}
body.npg{font-size:var(--fs-body);}

/* Gold accents so the palette is actually visible. */
.npg-btn:hover{background:var(--npg-gold-500);color:var(--npg-green-900);box-shadow:0 6px 18px rgba(6,42,31,.22);transform:translateY(-1px);}
a:hover{color:var(--npg-gold-600);}
::selection{background:var(--npg-gold-500);color:var(--npg-green-900);}
:focus-visible{outline:2px solid var(--npg-gold-600);outline-offset:3px;}

*{box-sizing:border-box;}
body.npg{
  margin:0;
  font-family:var(--npg-font-body);
  color:var(--npg-text);
  background:#ffffff;
  line-height:1.6;
  position:relative;
}
/* A quiet fixed grain — this is the single most common trick separating
   a "flat" site from a "premium" one. Static, no animation, barely
   perceptible on its own, but it's what stops large solid-colour bands
   (hero, dark sections, cards) from reading as flat digital fills. */
body.npg::before{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;
  opacity:.025;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
@media (prefers-reduced-transparency:reduce){body.npg::before{display:none;}}
h1,h2,h3,h4{font-family:var(--npg-font-head);font-weight:600;color:var(--npg-charcoal);letter-spacing:.3px;}
a{color:var(--npg-gold);text-decoration:none;}
.npg-container{max-width:1180px;margin:0 auto;padding:0 24px;}
.npg-btn{display:inline-block;padding:14px 32px;background:var(--npg-green-700);color:#fff;border:none;border-radius:2px;font-size:14px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:.25s;box-shadow:0 2px 8px rgba(6,42,31,.18);}
.npg-btn:hover{background:var(--npg-gold);color:#fff;}
.npg-btn-outline{background:transparent;border:1px solid var(--npg-charcoal);color:var(--npg-charcoal);}
.npg-btn-outline:hover{background:var(--npg-charcoal);color:#fff;}

/* Header */
.npg-header{
  background:var(--npg-white);padding:16px 0;border-bottom:1px solid var(--npg-line);
  position:sticky;top:0;z-index:100;transition:box-shadow .25s var(--npg-ease);
}
.npg-header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.npg-logo{font-family:var(--npg-font);font-size:24px;font-weight:700;color:var(--npg-green-700);}
.npg-logo a{font-weight:800;font-size:24px;letter-spacing:-.4px;color:var(--npg-green-700);}
.npg-logo a em{font-style:normal;color:var(--npg-gold-600);}

.npg-nav{flex:1;display:flex;justify-content:center;}
.npg-nav ul{display:flex;gap:34px;list-style:none;margin:0;padding:0;}
.npg-nav a{
  position:relative;color:var(--npg-ink);font-size:14px;font-weight:500;
  text-transform:uppercase;letter-spacing:.7px;padding:4px 0;
}
.npg-nav a::after{
  content:"";position:absolute;left:0;bottom:-2px;width:0;height:1.5px;
  background:var(--npg-gold-500);transition:width .25s var(--npg-ease);
}
.npg-nav a:hover{color:var(--npg-green-700);}
.npg-nav a:hover::after{width:100%;}
.npg-admin-notice{font-size:12px;color:#a00;}

.npg-header-actions{display:flex;align-items:center;gap:14px;flex:none;}
.npg-header-cta{padding:12px 22px;}

/* Burger — hidden on desktop, shown under 860px */
.npg-burger{
  display:none;width:42px;height:42px;border:1px solid var(--npg-line);
  background:none;border-radius:var(--npg-radius);cursor:pointer;position:relative;padding:0;
}
.npg-burger span{
  position:absolute;left:11px;width:20px;height:1.5px;background:var(--npg-green-900);
  transition:all .3s var(--npg-ease);
}
.npg-burger span:nth-child(1){top:15px;}
.npg-burger span:nth-child(2){top:20.5px;}
.npg-burger span:nth-child(3){top:26px;}
.npg-burger[aria-expanded="true"] span:nth-child(1){top:20.5px;transform:rotate(45deg);}
.npg-burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.npg-burger[aria-expanded="true"] span:nth-child(3){top:20.5px;transform:rotate(-45deg);}

/* Hero - Blueprint (signature treatment) */
.npg-hero{
  background:
    repeating-linear-gradient(0deg, var(--npg-blueprint-line-dim) 0 1px, transparent 1px 48px),
    repeating-linear-gradient(90deg, var(--npg-blueprint-line-dim) 0 1px, transparent 1px 48px),
    linear-gradient(160deg, var(--npg-blueprint) 0%, var(--npg-blueprint-deep) 100%);
  color:#fff;
  padding:100px 0 80px;
  overflow:hidden;
  position:relative;
}
.npg-hero-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center;}
.npg-hero-eyebrow{font-family:var(--npg-font-mono);font-size:12px;letter-spacing:2.5px;text-transform:uppercase;color:var(--npg-blueprint-line);margin-bottom:18px;display:flex;align-items:center;gap:10px;}
.npg-hero-eyebrow::before{content:"";width:24px;height:1px;background:var(--npg-blueprint-line);display:inline-block;}
.npg-hero h1{color:#fff;font-size:50px;line-height:1.12;margin:0 0 20px;}
.npg-hero p{font-size:17px;color:#c7d9e8;max-width:460px;margin:0 0 32px;}
.npg-hero-ctas{display:flex;gap:14px;flex-wrap:wrap;}
.npg-hero .npg-hero-ctas .npg-btn-outline{border-color:rgba(255,255,255,.5);color:#fff;}
.npg-hero .npg-hero-ctas .npg-btn-outline:hover{background:#fff;color:var(--npg-blueprint-deep);border-color:#fff;}

.npg-blueprint-fig{position:relative;}
.npg-blueprint-fig svg{width:100%;height:auto;display:block;}
.npg-blueprint-fig .npg-bp-line{
  fill:none;stroke:var(--npg-blueprint-line);stroke-width:1.6;
  stroke-dasharray:1400;stroke-dashoffset:1400;
  animation:npgDraw 2.6s ease forwards;
}
.npg-blueprint-fig .npg-bp-line-delay{animation-delay:.4s;}
.npg-blueprint-fig .npg-bp-fill{fill:var(--npg-blueprint-line);opacity:0;animation:npgFadeIn .6s ease forwards;animation-delay:2.2s;}
.npg-blueprint-fig .npg-bp-label{
  font-family:var(--npg-font-mono);font-size:11px;fill:var(--npg-blueprint-line);
  letter-spacing:.5px;opacity:0;animation:npgFadeIn .5s ease forwards;animation-delay:2.4s;
}
@keyframes npgDraw{to{stroke-dashoffset:0;}}
@keyframes npgFadeIn{to{opacity:1;}}
@media (prefers-reduced-motion: reduce){
  .npg-blueprint-fig .npg-bp-line{animation:none;stroke-dashoffset:0;}
  .npg-blueprint-fig .npg-bp-fill,.npg-blueprint-fig .npg-bp-label{animation:none;opacity:1;}
}

@media(max-width:900px){
  .npg-hero-inner{grid-template-columns:1fr;}
  .npg-hero h1{font-size:36px;}
  .npg-blueprint-fig{order:-1;max-width:340px;margin:0 auto 20px;}
}

/* Sections */
.npg-section{padding:80px 0;}
.npg-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.npg-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:40px;}

/* Forms */
/* Generic .npg-form fallback — this is what any custom form built from
   the dashboard actually renders with (plain <input>/<label>, no
   dedicated class), so it was completely unstyled: no radius, no
   shadow, no focus state. Matching it to the premium input language
   here means every dashboard-built form is covered automatically,
   without editing each one individually. */
.npg-form input,.npg-form textarea,.npg-form select{
  width:100%;padding:12px 14px;margin-bottom:16px;
  border:1px solid var(--npg-line);background:var(--npg-white);
  font-family:var(--npg-font);font-size:15px;color:var(--npg-ink);
  border-radius:var(--npg-radius);box-shadow:inset 0 1px 3px rgba(6,42,31,.05);
  transition:border-color .25s var(--npg-ease),box-shadow .25s var(--npg-ease);
}
.npg-form input:focus,.npg-form textarea:focus,.npg-form select:focus{
  outline:none;border-color:var(--npg-gold-500);
  box-shadow:0 0 0 3px rgba(201,162,39,.15);
}
.npg-form label{display:block;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.6px;margin-bottom:6px;color:var(--npg-green-900);}
.npg-form input[type="file"]{box-shadow:none;padding:9px 14px;}


/* Payment page */
.npg-payment-box{max-width:520px;margin:80px auto;background:#fff;padding:48px;border:1px solid var(--npg-sand);text-align:center;}
.npg-payment-amount{font-size:40px;font-family:var(--npg-font-head);color:var(--npg-charcoal);margin:16px 0;}
.npg-payment-status{padding:10px 18px;border-radius:20px;font-size:13px;display:inline-block;margin-bottom:20px;}
.npg-status-pending{background:#fff3cd;color:#856404;}
.npg-status-paid{background:#e6f4ea;color:#1e7e34;}

/* Estimator Wizard */
.npg-wizard{
  max-width:900px;margin:0 auto;background:#fff;
  border:1px solid var(--npg-line);border-radius:var(--npg-radius);
  padding:clamp(24px,4vw,44px);box-shadow:var(--npg-shadow-lg),var(--npg-shadow-inset);
}
/* Progress bar — was plain text tabs with an underline. Redesigned as
   numbered circles on a connecting line, matching the same visual
   language as the "How It Works" numbered track elsewhere on the site,
   so the wizard doesn't look like a separate, unstyled component. */
.npg-progress{display:flex;justify-content:space-between;margin-bottom:40px;position:relative;}
.npg-progress::before{
  content:"";position:absolute;top:17px;left:5%;right:5%;height:1px;
  background:var(--npg-line);z-index:0;
}
.npg-progress-step{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;
  position:relative;z-index:1;
}
.npg-progress-no{
  width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--npg-white);border:1.5px solid var(--npg-line);
  font-size:13px;font-weight:700;color:var(--npg-muted);
  transition:all .3s var(--npg-ease);
}
.npg-progress-label{
  font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--npg-muted);
  transition:color .3s var(--npg-ease);
}
.npg-progress-step.active .npg-progress-no{
  background:var(--npg-green-700);border-color:var(--npg-green-700);color:#fff;
  box-shadow:0 0 0 4px var(--npg-green-050);
}
.npg-progress-step.active .npg-progress-label{color:var(--npg-green-900);font-weight:600;}
.npg-progress-step.done .npg-progress-no{background:var(--npg-gold-500);border-color:var(--npg-gold-500);color:var(--npg-green-900);}
.npg-progress-step.done .npg-progress-label{color:var(--npg-gold-600);}
@media(max-width:700px){
  .npg-progress-label{display:none;}
  .npg-progress-no{width:28px;height:28px;font-size:12px;}
  .npg-progress::before{top:14px;}
}

.npg-wizard-eyebrow{
  display:block;font-size:12px;font-weight:600;letter-spacing:1px;text-transform:uppercase;
  color:var(--npg-gold-600);margin-bottom:8px;
}

/* Result step — the "reveal" moment, given a bit more visual weight
   than a plain centred block. */
.npg-estimate-result{text-align:center;padding:12px 0 4px;}
.npg-estimate-range{font-family:var(--npg-font);font-size:42px;font-weight:700;color:var(--npg-green-700);margin:18px 0 10px;}
.npg-estimate-note{color:var(--npg-muted);font-size:14px;max-width:52ch;margin:0 auto 26px;}
.npg-estimate-result-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.npg-wizard-step{display:none;}
.npg-wizard-step.active{display:block;animation:npgFade .25s ease;}
@keyframes npgFade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}
.npg-wizard-step h2{margin-bottom:6px;}
.npg-wizard-step p.npg-step-sub{color:#888;margin-bottom:24px;}

/* Image option cards — the same "pick what you mean" pattern used in
   the enquiry form, now given the same depth/radius language as every
   other card on the site instead of flat, square-cornered boxes. */
.npg-option-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px;margin-bottom:24px;}
.npg-option-card{
  background:#fff;border:1.5px solid var(--npg-line);border-radius:var(--npg-radius);
  cursor:pointer;overflow:hidden;position:relative;
  box-shadow:var(--npg-shadow);
  transition:border-color .25s var(--npg-ease),box-shadow .25s var(--npg-ease),transform .25s var(--npg-ease);
}
.npg-option-card:hover{border-color:var(--npg-gold-300);transform:translateY(-3px);box-shadow:var(--npg-shadow-lg);}
.npg-option-card.selected{border-color:var(--npg-gold-500);box-shadow:0 0 0 2px var(--npg-gold-500),var(--npg-shadow-lg);}
.npg-option-card img{width:100%;height:104px;object-fit:cover;display:block;background:var(--npg-green-050);}
.npg-option-card .npg-option-label{padding:11px 10px;font-size:13.5px;font-weight:600;text-align:center;color:var(--npg-green-900);}
.npg-option-card .npg-option-check{
  position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;
  background:var(--npg-gold-500);color:var(--npg-green-900);display:none;
  align-items:center;justify-content:center;font-size:13px;font-weight:700;
  box-shadow:0 3px 8px rgba(0,0,0,.25);
}
.npg-option-card.selected .npg-option-check{display:flex;}
.npg-option-card .npg-room-inputs{display:none;padding:0 10px 11px;gap:8px;}
.npg-option-card.selected .npg-room-inputs{display:flex;}
.npg-option-card .npg-room-inputs input{width:70px;padding:7px;font-size:13px;border:1px solid var(--npg-line);border-radius:var(--npg-radius);}

.npg-wizard-nav{display:flex;justify-content:space-between;margin-top:20px;}
.npg-field-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px;}

/* Image upload (enquiry screen) */
.npg-upload-box{border:2px dashed var(--npg-sand);background:#fff;padding:20px;margin-bottom:20px;}
.npg-upload-box.dragover{border-color:var(--npg-gold);background:#fbf6ee;}
.npg-upload-trigger{text-align:center;padding:24px;cursor:pointer;color:#888;}
.npg-upload-trigger:hover{color:var(--npg-charcoal);}
.npg-upload-previews{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:12px;margin-top:16px;}
.npg-upload-thumb{position:relative;border:1px solid var(--npg-sand);}
.npg-upload-thumb img{width:100%;height:90px;object-fit:cover;display:block;}
.npg-upload-thumb .npg-upload-remove{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;background:rgba(28,27,25,.75);color:#fff;border:none;cursor:pointer;font-size:13px;line-height:1;}
.npg-upload-thumb .npg-upload-status{position:absolute;bottom:0;left:0;right:0;font-size:10px;text-align:center;padding:2px;background:rgba(0,0,0,.5);color:#fff;}
.npg-upload-thumb .npg-upload-status.error{background:rgba(164,38,44,.85);}
.npg-upload-thumb .npg-upload-status.ok{background:rgba(30,126,52,.85);}

/* Dashboard-managed gallery */
.npg-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px;}
.npg-gallery-card{display:block;background:#fff;border:1px solid var(--npg-sand);overflow:hidden;text-decoration:none;color:inherit;transition:.2s;}
.npg-gallery-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.08);}
.npg-gallery-card img{width:100%;height:200px;object-fit:cover;display:block;}
.npg-gallery-card-label{padding:16px;}
.npg-gallery-card-label h4{margin:0 0 6px;}
.npg-gallery-card-label p{margin:0;font-size:14px;color:#777;}

/* ============ Custom frontend Login page ============ */
.npg-login-wrap{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:60px 20px;}
.npg-login-box{max-width:420px;width:100%;background:#fff;border:1px solid var(--npg-sand);padding:48px;}
.npg-login-box h1{text-align:center;font-size:28px;margin-bottom:8px;}
.npg-login-box p.npg-login-sub{text-align:center;color:#888;margin-bottom:28px;font-size:14px;}
.npg-login-box .npg-btn{width:100%;margin-top:8px;}
.npg-login-error{background:#fbe6e6;color:#a4262c;padding:12px 14px;margin-bottom:18px;font-size:14px;}
.npg-password-wrap{position:relative;}
.npg-password-wrap input[type=password],.npg-password-wrap input[type=text]{padding-right:44px;}
.npg-password-toggle{position:absolute;right:0;top:0;height:100%;width:40px;background:none;border:none;cursor:pointer;font-size:18px;opacity:.6;display:flex;align-items:center;justify-content:center;}
.npg-password-toggle:hover{opacity:1;}

/* ============ Custom frontend Dashboard ============ */
.npg-dash{display:grid;grid-template-columns:220px 1fr;min-height:80vh;background:var(--npg-cream);}
.npg-dash-sidebar{background:var(--npg-charcoal);color:var(--npg-sand);padding:28px 0;}
.npg-dash-sidebar-title{font-family:var(--npg-font-head);font-size:20px;color:#fff;padding:0 24px 20px;border-bottom:1px solid #3a3733;margin-bottom:16px;}
.npg-dash-nav a{display:block;padding:11px 24px;color:var(--npg-sand);font-size:14px;text-decoration:none;border-left:3px solid transparent;}
.npg-dash-nav a:hover{background:rgba(255,255,255,.04);color:#fff;}
.npg-dash-nav a.active{border-left-color:var(--npg-gold);background:rgba(184,146,90,.12);color:#fff;font-weight:500;}
.npg-dash-nav-heading{padding:16px 24px 6px;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#8a8680;}
.npg-dash-nav-heading:first-child{padding-top:4px;}
.npg-dash-nav .npg-dash-logout{margin-top:20px;padding-top:16px;border-top:1px solid #3a3733;}
.npg-dash-main{padding:32px 40px;overflow-x:auto;}
.npg-dash-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;}
.npg-dash-header h1{font-size:26px;margin:0;}
.npg-dash-msg{padding:12px 16px;margin-bottom:20px;font-size:14px;}
.npg-dash-msg.success{background:#e6f4ea;color:#1e7e34;}
.npg-dash-msg.error{background:#fbe6e6;color:#a4262c;}

.npg-dash-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-bottom:32px;}
.npg-dash-stat{background:#fff;border:1px solid var(--npg-sand);padding:18px 20px;}
.npg-dash-stat .label{font-size:12px;text-transform:uppercase;color:#888;letter-spacing:.5px;}
.npg-dash-stat .value{font-size:24px;font-family:var(--npg-font-head);color:var(--npg-charcoal);margin-top:4px;}

.npg-dash-card{
  background:#fff;border:1px solid var(--npg-line);border-radius:var(--npg-radius);
  padding:26px;margin-bottom:24px;box-shadow:var(--npg-shadow),var(--npg-shadow-inset);
}
.npg-dash-card h2{font-size:18px;margin-top:0;margin-bottom:16px;}

.npg-dash-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--npg-sand);margin-bottom:24px;font-size:14px;}
.npg-dash-table th{background:var(--npg-sand);text-align:left;padding:10px 12px;font-size:12px;text-transform:uppercase;letter-spacing:.3px;}
.npg-dash-table td{padding:10px 12px;border-top:1px solid var(--npg-sand);vertical-align:middle;}
.npg-dash-table tr:hover td{background:#fbf8f3;}

.npg-dash-form label{display:block;font-size:12px;text-transform:uppercase;color:#888;margin-bottom:5px;margin-top:14px;}
.npg-dash-form input[type=text],.npg-dash-form input[type=email],.npg-dash-form input[type=number],.npg-dash-form input[type=password],.npg-dash-form select,.npg-dash-form textarea{width:100%;padding:10px 12px;border:1px solid var(--npg-sand);font-family:var(--npg-font-body);font-size:14px;}
.npg-dash-form input[type=file]{margin-top:4px;}

.npg-pill{display:inline-block;padding:3px 10px;border-radius:12px;font-size:12px;}
.npg-pill-pending{background:#fff3cd;color:#856404;}
.npg-pill-paid{background:#e6f4ea;color:#1e7e34;}
.npg-pill-active{background:#e6f4ea;color:#1e7e34;}
.npg-pill-inactive{background:#f1efe8;color:#888;}

.npg-dash-btn-sm{display:inline-block;padding:6px 14px;font-size:12px;background:var(--npg-charcoal);color:#fff;border:none;cursor:pointer;text-decoration:none;}
.npg-dash-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px;}
.npg-dash-card-head h2{margin:0;}
.npg-dash-btn-sm:hover{background:var(--npg-gold);color:#fff;}
.npg-dash-btn-sm.outline{background:transparent;border:1px solid var(--npg-charcoal);color:var(--npg-charcoal);}
.npg-dash-btn-sm.danger{background:transparent;border:1px solid #a4262c;color:#a4262c;}

.npg-dash-tabs{display:flex;gap:4px;margin-bottom:20px;border-bottom:1px solid var(--npg-sand);}
.npg-dash-tabs a{padding:10px 18px;font-size:13px;text-transform:uppercase;letter-spacing:.3px;color:#888;text-decoration:none;border-bottom:2px solid transparent;}
.npg-dash-tabs a.active{color:var(--npg-charcoal);border-bottom-color:var(--npg-gold);font-weight:500;}

.npg-dash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;}
.npg-dash-thumb{background:#fff;border:1px solid var(--npg-sand);}
.npg-dash-thumb img{width:100%;height:120px;object-fit:cover;display:block;}
.npg-dash-thumb .body{padding:10px 12px;font-size:13px;}

@media(max-width:900px){
  .npg-dash{grid-template-columns:1fr;}
  .npg-dash-sidebar{position:static;}
  .npg-dash-nav{display:flex;overflow-x:auto;}
  .npg-dash-nav a{white-space:nowrap;border-left:none;border-bottom:3px solid transparent;}
  .npg-dash-nav a.active{border-left:none;border-bottom-color:var(--npg-gold);}
  .npg-dash-main{padding:20px;}
}

/* Homepage popup enquiry (right side, medium card, appears after 5s) */
.npg-popup{
  position:fixed;top:50%;right:-380px;transform:translateY(-50%);
  width:340px;background:#fff;border:1px solid var(--npg-sand);
  box-shadow:0 12px 40px rgba(0,0,0,.18);z-index:9999;
  transition:right .5s ease;
}
.npg-popup.npg-popup-open{right:24px;}
.npg-popup-head{background:var(--npg-charcoal);color:#fff;padding:16px 20px;position:relative;}
.npg-popup-head h4{margin:0;font-size:17px;}
.npg-popup-head p{margin:4px 0 0;font-size:13px;color:var(--npg-sand);}
.npg-popup-close{position:absolute;top:10px;right:12px;background:none;border:none;color:#fff;font-size:20px;line-height:1;cursor:pointer;opacity:.7;}
.npg-popup-close:hover{opacity:1;}
.npg-popup-body{padding:18px 20px 20px;}
.npg-popup-body input,.npg-popup-body textarea{width:100%;padding:10px 12px;margin-bottom:10px;border:1px solid var(--npg-sand);font-family:var(--npg-font-body);font-size:14px;}
.npg-popup-body button{width:100%;}
@media(max-width:480px){
  .npg-popup{width:calc(100% - 24px);}
  .npg-popup.npg-popup-open{right:12px;}
}

/* Hero - image background, premium green (new front page design) */
.npg-hero-img{
  background-size:cover;
  background-position:center;
  padding:90px 0 90px;
  position:relative;
}
.npg-hero-img-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:start;}
.npg-hero-locations{font-size:14px;font-weight:700;letter-spacing:3px;color:#fff;margin-bottom:20px;text-transform:uppercase;}
.npg-hero-img-copy h1{color:#fff;font-size:54px;font-weight:800;line-height:1.12;margin:0 0 20px;letter-spacing:-1px;}
.npg-hero-img-copy p{color:#eafaf1;font-size:18px;max-width:480px;margin:0 0 32px;font-weight:400;}
.npg-hero-form-card{background:#fff;border-radius:10px;padding:32px;box-shadow:0 20px 50px rgba(0,0,0,.25);}
.npg-hero-form-card h3{margin-top:0;font-size:22px;font-weight:700;color:var(--npg-charcoal);}

@media(max-width:900px){
  .npg-hero-img-inner{grid-template-columns:1fr;}
  .npg-hero-img-copy h1{font-size:36px;}
}

/* Footer */
.npg-footer{background:var(--npg-black);color:rgba(255,255,255,.68);font-family:var(--npg-font);padding:64px 0 28px;margin-top:0;}
.npg-footer a{color:rgba(255,255,255,.68);}
.npg-footer a:hover{color:var(--npg-gold-300);}
.npg-footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px;padding-bottom:40px;}
.npg-footer h3.npg-on-dark{font-size:22px;font-weight:700;margin-bottom:14px;}
.npg-footer h3.npg-on-dark em{font-style:normal;color:var(--npg-gold-500);}
.npg-footer h4.npg-on-dark{font-size:12px;letter-spacing:1.4px;text-transform:uppercase;color:rgba(255,255,255,.85);margin-bottom:16px;}
.npg-footer p{font-size:14px;line-height:1.7;margin-bottom:16px;}
.npg-footer-contact{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px;}
.npg-footer ul:not(.npg-footer-contact){list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;font-size:14px;}
.npg-footer-bottom{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;
  padding-top:26px;border-top:1px solid rgba(255,255,255,.12);font-size:12.5px;color:rgba(255,255,255,.5);
}
.npg-footer-badge{letter-spacing:1px;text-transform:uppercase;color:var(--npg-gold-300);}

@media(max-width:900px){
  .npg-grid-3,.npg-grid-2{grid-template-columns:1fr;}
  .npg-hero h1{font-size:34px;}
  .npg-footer-grid{grid-template-columns:repeat(2,1fr) !important;}

  /* Mobile navigation — was display:none with no way to reopen it.
     Now a proper dropdown panel triggered by the burger button. */
  .npg-header-inner{flex-wrap:wrap;}
  .npg-nav{
    order:3;flex:0 0 100%;justify-content:flex-start;
    max-height:0;overflow:hidden;transition:max-height .35s var(--npg-ease);
  }
  .npg-nav.is-open{max-height:480px;margin-top:16px;}
  .npg-nav ul{flex-direction:column;gap:0;width:100%;}
  .npg-nav li{border-top:1px solid var(--npg-line);}
  .npg-nav a{display:block;padding:14px 2px;}
  .npg-nav a::after{display:none;}
  .npg-header-cta{display:none;}
  .npg-burger{display:block;}
}
@media(max-width:560px){
  .npg-footer-grid{grid-template-columns:1fr !important;}
}

/* ============================================================
   FRONT PAGE HERO + STATS BAR
   Moved here from an inline <style> block inside front-page.php.
   Inline blocks are re-downloaded with every page view, cannot be
   cached, and hid these rules from the rest of the stylesheet.
   The Playfair Display @import was removed -- the brief is Poppins
   only, and an @import inside a <style> tag blocks rendering.
   ============================================================ */
/* Luxury hero - front page only. Elegant serif headline, bright luxury-green
   background with faceted "diamond" shading, no side image, centered copy. */
.npg-hero-luxury{
	position:relative;overflow:hidden;padding:96px 0 88px;
	/* Richer, layered static background — a two-tone diagonal base
	   (near-black corner to deep green) with a warm gold glow up top
	   and a second, quieter green glow low-right for balance. Nothing
	   here moves; the depth comes from the number of layers, not motion. */
	background:
		radial-gradient(ellipse 780px 460px at 12% -6%,rgba(227,201,114,.16),transparent 62%),
		radial-gradient(ellipse 620px 500px at 96% 108%,rgba(20,86,63,.55),transparent 65%),
		linear-gradient(155deg,var(--npg-green-500) 0%,var(--npg-green-900) 58%,var(--npg-black) 130%);
}
/* Faint architectural hairlines — a quiet nod to a floor-plan sketch,
   on brand for an interior studio, purely decorative and static. */
.npg-hero-luxury::before{
	content:"";position:absolute;inset:0;pointer-events:none;opacity:.05;z-index:1;
	background-image:
		repeating-linear-gradient(90deg,rgba(255,255,255,.5) 0 1px,transparent 1px 120px),
		repeating-linear-gradient(0deg,rgba(255,255,255,.5) 0 1px,transparent 1px 120px);
}
/* One quiet gold hairline low in the frame — the only "flourish", and it holds still. */
.npg-hero-luxury::after{
	content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
	background:linear-gradient(90deg,transparent,rgba(227,201,114,.5) 50%,transparent);
}
/* Split layout — the earlier version was centred text with no visual
   anchor at all, which read as empty on a page for a visual business.
   This gives it a real image side, a floating stat badge, and a style
   tag, the way most premium interior/real-estate sites are built. */
.npg-hero-luxury-inner{
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,64px);
  align-items:center;position:relative;z-index:2;max-width:none;
}
.npg-hero-luxury-copy{max-width:560px;}

.npg-hero-visual{position:relative;}
.npg-hero-visual .npg-frame{display:block;}
/* Frame overflow reduced from -24px to -10px: at -24px it exactly
   cancelled the container's own 24px side padding, so the right edge
   sat flush against the browser edge with zero breathing room, while
   the text column on the left kept the full standard margin. Now
   both sides read as the same, standard margin. */
.npg-hero-visual::after{
  content:"";position:absolute;inset:24px -10px -10px 24px;
  border:1px solid var(--npg-gold-500);border-radius:3px;z-index:-1;
}
.npg-hero-tag{
  position:absolute;top:18px;left:18px;z-index:3;
  background:rgba(16,16,16,.55);backdrop-filter:blur(3px);
  color:var(--npg-gold-300);font-size:11px;font-weight:600;
  letter-spacing:1px;text-transform:uppercase;
  padding:7px 14px;border-radius:20px;border:1px solid rgba(227,201,114,.35);
}
.npg-hero-badge{
  position:absolute;left:-20px;bottom:36px;z-index:4;
  background:var(--npg-green-900);color:#fff;
  padding:18px 24px;border-radius:var(--npg-radius);
  box-shadow:0 20px 44px rgba(0,0,0,.35);
  border:1px solid rgba(227,201,114,.25);
}
.npg-hero-badge strong{display:block;font-size:28px;font-weight:700;color:var(--npg-gold-300);line-height:1.1;}
.npg-hero-badge span{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:rgba(255,255,255,.65);}

@media(max-width:900px){
  .npg-hero-luxury-inner{grid-template-columns:1fr;}
  .npg-hero-visual{order:-1;max-width:360px;margin:0 auto;}
  .npg-hero-visual::after{inset:14px -8px -8px 14px;}
  /* Badge was hanging 18px below the image with no reserved space
     for it, so it overlapped the heading text that followed on
     mobile. Now it sits inside the image's own corner instead. */
  .npg-hero-badge{left:14px;bottom:14px;}
}
.npg-hero-luxury-eyebrow{
	font-family:var(--npg-font);font-size:13px;font-weight:600;
	letter-spacing:3px;color:var(--npg-gold-300);margin-bottom:20px;
	display:flex;align-items:center;gap:10px;
}
.npg-hero-luxury-eyebrow::before{content:"";width:22px;height:1px;background:var(--npg-gold-300);display:inline-block;}
.npg-hero-luxury-copy h1{
	font-family:var(--npg-font);font-weight:600;font-size:50px;line-height:1.18;margin:0 0 22px;
}
.npg-hero-luxury-copy h1 span{display:block;}

/* Gold headline accent — solid, no motion. Calm reads as more expensive than shine. */
.npg-hl-gold{color:var(--npg-gold-500);}
.npg-hl-white{color:#ffffff;}
.npg-hero-luxury-copy p{
	color:rgba(255,255,255,.82);
	font-size:17px;
	line-height:1.75;
	max-width:560px;
	margin:0 0 34px;
}
.npg-hero-luxury-copy .npg-btn,
.npg-hero-luxury-copy .npg-btn:focus,
.npg-hero-luxury-copy .npg-btn:active{
	background:var(--npg-gold-500);
	color:var(--npg-green-900);
	border:none;
	font-weight:600;
	box-shadow:0 10px 26px rgba(0,0,0,.28);
}
.npg-hero-luxury-copy .npg-btn:hover{background:var(--npg-gold-300);color:var(--npg-green-900);}

@media(max-width:700px){
	.npg-hero-luxury-copy h1{font-size:36px;}
}

/* Trust/stats band — static dark green, four columns. No scroll, no shine: just the numbers. */
.npg-stats-bar{background:var(--npg-green-900);padding:0;}
.npg-stats-track{display:grid;grid-template-columns:repeat(4,1fr);}
.npg-stat-item{
	display:flex;flex-direction:column;align-items:center;gap:4px;
	padding:28px 16px;text-align:center;
	border-right:1px solid rgba(255,255,255,.12);
}
.npg-stat-item:last-child{border-right:none;}
.npg-stat-num{font-family:var(--npg-font);font-size:26px;font-weight:700;color:var(--npg-gold-300);}
.npg-stat-label{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.68);}
@media(max-width:700px){
	.npg-stats-track{grid-template-columns:repeat(2,1fr);}
	.npg-stat-item{padding:20px 12px;border-bottom:1px solid rgba(255,255,255,.12);border-right:none;}
	.npg-stat-item:nth-child(2n){border-right:none;}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
}

/* ============================================================
   STANDARD TYPE SCALE — POINT 1
   ------------------------------------------------------------
   One fixed size per role, used site-wide. Templates apply a
   class; no template writes font-size inline any more.

     .npg-eyebrow  section label      12px  / 600 / uppercase
     .npg-h-page   page title         h1 scale
     .npg-h-sec    section topic      h2 scale
     .npg-h-sub    sub-topic          h3 scale
     .npg-h-card   card title         17px
     .npg-lede     intro paragraph    17px, muted
     .npg-copy     body text          17px
     .npg-meta     caption / meta     13px

   Poppins is the only family. Personality comes from weight and
   letter-spacing contrast, not from a second typeface.
   ============================================================ */
body.npg,
body.npg input,
body.npg select,
body.npg textarea,
body.npg button{font-family:var(--npg-font);}

.npg-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:var(--fs-eyebrow);font-weight:600;
  letter-spacing:var(--ls-eyebrow);text-transform:uppercase;
  color:var(--npg-gold-600);margin-bottom:var(--sp-2);
}
.npg-eyebrow::before{content:"";width:28px;height:1px;background:currentColor;flex:none;}
.npg-head-center .npg-eyebrow::before{display:none;}
.npg-dark .npg-eyebrow{color:var(--npg-gold-300);}

.npg-h-page{font-size:var(--fs-h1);line-height:var(--lh-tight);letter-spacing:var(--ls-tight);}
.npg-h-sec{font-size:var(--fs-h2);line-height:var(--lh-heading);letter-spacing:var(--ls-tight);margin:0 0 var(--sp-2);}
.npg-h-sub{font-size:var(--fs-h3);line-height:var(--lh-heading);margin:0 0 var(--sp-1);}
.npg-h-card{font-size:var(--fs-h4);line-height:1.35;margin:0 0 var(--sp-1);}

.npg-lede{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--npg-muted);margin:0;}
.npg-copy{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--npg-ink);margin:0;}
.npg-meta{font-size:var(--fs-tiny);line-height:1.5;color:var(--npg-muted);}
.npg-dark .npg-lede{color:rgba(255,255,255,.68);}

/* Section heading block */
.npg-head{max-width:640px;margin-bottom:var(--sp-5);}
.npg-head-center{margin-left:auto;margin-right:auto;text-align:center;}

/* Layout helpers used by the home template — replaces inline style="" */
.npg-section-center{text-align:center;}
.npg-grid-middle{align-items:center;}
.npg-hero-ctas-center{justify-content:center;}
.npg-img-block{width:100%;height:auto;border-radius:4px;display:block;}

.npg-card-tag{
  font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--npg-gold-600);margin-bottom:var(--sp-1);
}

.npg-list{padding-left:20px;margin:0 0 var(--sp-3);}
.npg-list li{
  font-size:var(--fs-body);line-height:var(--lh-body);
  color:var(--npg-ink);margin-bottom:var(--sp-1);
}
.npg-list li::marker{color:var(--npg-gold-500);}

/* The hero headline follows the same scale instead of a fixed 54px. */
.npg-hero-luxury-copy h1{font-size:var(--fs-h1);line-height:var(--lh-tight);letter-spacing:var(--ls-tight);}
.npg-hero-luxury-copy p{font-size:var(--fs-body);line-height:var(--lh-body);}

/* ============================================================
   POINT 8 — UTILITY CLASSES
   ------------------------------------------------------------
   These replace the inline style="" attributes that were repeated
   across the public templates. Each rule now exists once here
   instead of being retyped in every file.
   ============================================================ */
.npg-center{text-align:center;}
.npg-left{text-align:left;}
.npg-mt-0{margin-top:0;}
.npg-mt-1{margin-top:var(--sp-1);}
.npg-mt-2{margin-top:var(--sp-2);}
.npg-mt-3{margin-top:var(--sp-3);}
.npg-mt-4{margin-top:var(--sp-4);}
.npg-mt-5{margin-top:var(--sp-5);}
.npg-mb-2{margin-bottom:var(--sp-2);}
.npg-mb-3{margin-bottom:var(--sp-3);}
.npg-w-full{width:100%;}
.npg-muted{color:var(--npg-muted);font-size:var(--fs-small);}
.npg-on-dark{color:var(--npg-white);}

.npg-narrow-520{max-width:520px;margin-left:auto;margin-right:auto;}
.npg-narrow-600{max-width:600px;margin-left:auto;margin-right:auto;}
.npg-narrow-700{max-width:700px;margin-left:auto;margin-right:auto;}
.npg-narrow-800{max-width:800px;}
.npg-narrow-900{max-width:900px;}

/* Form controls — was 12 near-identical inline declarations */
.npg-label{
  display:block;font-size:var(--fs-tiny);font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--npg-green-900);margin-bottom:6px;
}
.npg-input,.npg-select,.npg-textarea{
  width:100%;padding:12px 14px;margin-bottom:14px;
  font-family:var(--npg-font);font-size:var(--fs-small);color:var(--npg-ink);
  background:var(--npg-white);border:1px solid var(--npg-line);
  box-shadow:inset 0 1px 3px rgba(6,42,31,.05);
  border-radius:var(--npg-radius);transition:border-color .25s var(--npg-ease),box-shadow .25s var(--npg-ease);
}
.npg-input:focus,.npg-select:focus,.npg-textarea:focus{
  outline:none;border-color:var(--npg-gold-500);
  box-shadow:0 0 0 3px rgba(201,162,39,.15);
}
.npg-img-full{width:100%;height:auto;display:block;border:1px solid var(--npg-line);margin:20px 0;}

/* ============================================================
   POINT 2 — PREMIUM / LUXURY TREATMENT
   Green, White, Gold, Black actually visible on the page.
   ============================================================ */

/* Section shades — alternate so no two neighbours look the same */
.npg-section-alt  {background:var(--npg-ivory);}
.npg-section-wash {background:var(--npg-green-050);}
/* Cards sitting on a tinted section need to separate from it, or the
   whole block reads as one flat colour. A touch of shadow does that. */
.npg-section-alt .npg-card,.npg-section-wash .npg-card{box-shadow:var(--npg-shadow-lg),var(--npg-shadow-inset);}
.npg-section-gold {background:var(--npg-gold-050);}
.npg-section-dark{
  background:
    radial-gradient(ellipse 700px 400px at 85% 0%,rgba(227,201,114,.06),transparent 60%),
    var(--npg-green-900);
  color:rgba(255,255,255,.82);position:relative;
}
.npg-section-black{background:var(--npg-black);color:rgba(255,255,255,.8);}
.npg-section-dark h1,.npg-section-dark h2,.npg-section-dark h3,.npg-section-dark h4,
.npg-section-black h1,.npg-section-black h2,.npg-section-black h3,.npg-section-black h4{color:var(--npg-white);}
.npg-section-dark .npg-lede,.npg-section-black .npg-lede{color:rgba(255,255,255,.66);}
.npg-section-dark .npg-eyebrow,.npg-section-black .npg-eyebrow{color:var(--npg-gold-300);}
.npg-section-dark em,.npg-section-black em{color:var(--npg-gold-300);}

/* Signature device: gold hairline with a lozenge */
.npg-rule{display:flex;align-items:center;gap:12px;margin:var(--sp-3) 0;}
.npg-rule::before,.npg-rule::after{content:"";height:1px;background:var(--npg-line);flex:1;}
.npg-rule i{width:6px;height:6px;background:var(--npg-gold-500);transform:rotate(45deg);flex:none;}
.npg-head-center .npg-rule{max-width:200px;margin-left:auto;margin-right:auto;}

/* Cards — hairline, gold on hover, lift */
.npg-card{
  background:var(--npg-white);border:1px solid var(--npg-line);
  border-radius:var(--npg-radius);padding:22px;
  box-shadow:var(--npg-shadow),var(--npg-shadow-inset);
  transition:transform .35s var(--npg-ease),box-shadow .35s var(--npg-ease),border-color .35s var(--npg-ease);
  display:flex;flex-direction:column;
}
.npg-card:hover{
  transform:translateY(-6px);box-shadow:var(--npg-shadow-lg),var(--npg-shadow-inset);
  border-color:var(--npg-gold-300);
}
.npg-card-flush{padding:0;overflow:hidden;display:flex;flex-direction:column;}
.npg-card-flush .npg-card-body{padding:22px;}

/* Buttons — gold as the premium action */
.npg-btn-gold{background:var(--npg-gold-500);color:var(--npg-green-900);font-weight:600;box-shadow:0 3px 10px rgba(201,162,39,.35);}
.npg-btn-gold:hover{background:var(--npg-gold-300);color:var(--npg-green-900);box-shadow:0 8px 22px rgba(201,162,39,.45);transform:translateY(-1px);}
.npg-section-dark .npg-btn-outline,.npg-section-black .npg-btn-outline{
  border-color:rgba(255,255,255,.3);color:var(--npg-white);
}
.npg-section-dark .npg-btn-outline:hover,.npg-section-black .npg-btn-outline:hover{
  background:var(--npg-white);color:var(--npg-green-900);border-color:var(--npg-white);
}

/* Gold offset frame — the luxury cue on feature images */
.npg-frame{position:relative;display:block;}
.npg-frame > img{position:relative;z-index:2;width:100%;height:auto;display:block;border-radius:3px;}
.npg-frame::after{
  content:"";position:absolute;inset:20px -20px -20px 20px;
  border:1px solid var(--npg-gold-500);border-radius:3px;z-index:1;
}

.npg-badge{
  display:inline-block;background:var(--npg-green-900);color:var(--npg-gold-300);
  font-size:var(--fs-tiny);font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;padding:7px 13px;border-radius:var(--npg-radius);
}

/* ============================================================
   POINT 3 — SECTION LAYOUT VARIANTS
   A different shape per section instead of the same centred grid.
   ============================================================ */

/* A. Split: copy one side, image the other. -rev flips it. */
.npg-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center;}
.npg-split-rev > *:first-child{order:2;}

/* B. Offset gallery: every second tile drops down */
.npg-offset{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(20px,3vw,40px);}
.npg-offset > *:nth-child(even){margin-top:clamp(32px,5vw,72px);}

/* C. Image tiles with a gradient label */
.npg-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.npg-tile{position:relative;overflow:hidden;border-radius:3px;background:var(--npg-green-050);box-shadow:var(--npg-shadow);transition:box-shadow .35s var(--npg-ease),transform .35s var(--npg-ease);}
.npg-tile:hover{box-shadow:var(--npg-shadow-lg);transform:translateY(-4px);}
.npg-tile img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--npg-ease);}
.npg-tile:hover img{transform:scale(1.06);}
.npg-tile-label{
  position:absolute;left:0;right:0;bottom:0;padding:28px 18px 16px;
  background:linear-gradient(to top,rgba(16,16,16,.9),transparent);
  color:var(--npg-white);font-weight:600;font-size:var(--fs-h4);
}
.npg-tile-label small{
  display:block;font-size:var(--fs-tiny);font-weight:400;
  color:var(--npg-gold-300);letter-spacing:.1em;text-transform:uppercase;
}

/* D. Numbered step track — used only where order carries meaning */
.npg-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);position:relative;}
.npg-steps::before{content:"";position:absolute;top:22px;left:6%;right:6%;height:2px;background:#111111;}
.npg-step{position:relative;}
.npg-step-no{
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;
  background:var(--npg-white);border:1px solid var(--npg-gold-500);
  color:var(--npg-gold-600);border-radius:50%;font-weight:600;
  font-size:var(--fs-small);margin-bottom:var(--sp-2);position:relative;z-index:1;
}
.npg-section-dark .npg-step-no{background:var(--npg-green-900);}

/* Standard image slots — fixed ratios so nothing jumps while loading */
.npg-media{display:block;width:100%;object-fit:cover;border-radius:3px;background:var(--npg-green-050);}
.npg-media-wide{aspect-ratio:3/2;}
.npg-media-card{aspect-ratio:4/3;}
.npg-media-tall{aspect-ratio:4/5;}
.npg-media-tile{aspect-ratio:5/4;}

@media(max-width:900px){
  .npg-split,.npg-offset{grid-template-columns:1fr;}
  .npg-split-rev > *:first-child{order:0;}
  .npg-offset > *:nth-child(even){margin-top:0;}
  .npg-tiles,.npg-steps{grid-template-columns:repeat(2,1fr);}
  .npg-steps::before{display:none;}
  .npg-frame::after{inset:14px -14px -14px 14px;}
}
@media(max-width:600px){
  .npg-tiles,.npg-steps{grid-template-columns:1fr;}
  .npg-frame::after{display:none;}
}
.npg-span-all{grid-column:1/-1;}
.npg-my-2{margin:var(--sp-2) 0;}
.npg-mb-4{margin-bottom:var(--sp-4);}
.npg-list-bare{list-style:none;padding:0;margin:0;}
.npg-quote-text{font-style:italic;color:var(--npg-ink);line-height:var(--lh-body);}
/* Placeholder slot — keeps the layout intact before real photos arrive.
   The original version was a near-white pastel wash. With zero real
   photos uploaded yet, that box is what actually shows on every single
   image across the site right now, which is most of why the site reads
   as washed-out rather than premium. This version reads as a deliberate
   branded panel instead of an empty hole. */
.npg-media-empty{
  position:relative;overflow:hidden;
  background:
    repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 1px,transparent 1px 22px),
    linear-gradient(145deg,var(--npg-green-700) 0%,var(--npg-green-900) 70%,var(--npg-black) 100%);
  box-shadow:inset 0 0 0 1px rgba(227,201,114,.18);
}
/* Corner marks — a quiet architectural-drawing cue, on brand for an
   interior studio, that reads as intentional rather than "missing". */
.npg-media-empty::before,
.npg-media-empty::after{
  content:"";position:absolute;width:22px;height:22px;
  border:1.5px solid rgba(227,201,114,.55);opacity:.9;
}
.npg-media-empty::before{top:14px;left:14px;border-right:none;border-bottom:none;}
.npg-media-empty::after{bottom:14px;right:14px;border-left:none;border-top:none;}
.npg-media-empty-mark{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:34px;height:34px;z-index:1;
}
.npg-media-empty-mark svg{width:100%;height:100%;stroke:var(--npg-gold-300);opacity:.75;}
/* Six-step track and pricing tiers */
.npg-steps-6{grid-template-columns:repeat(3,1fr);row-gap:var(--sp-4);}
.npg-steps-6::before{display:none;}
.npg-tier{display:flex;flex-direction:column;}
.npg-tier-featured{border-color:var(--npg-gold-500);box-shadow:0 0 0 1px var(--npg-gold-500),var(--npg-shadow);}
.npg-tier .npg-btn{margin-top:auto;}
.npg-ticks{list-style:none;padding:0;margin:0;}
.npg-ticks li{
  position:relative;padding-left:22px;margin-bottom:9px;
  font-size:var(--fs-small);color:var(--npg-ink);line-height:1.6;
}
.npg-ticks li::before{
  content:"";position:absolute;left:0;top:8px;width:6px;height:6px;
  background:var(--npg-gold-500);transform:rotate(45deg);
}
@media(max-width:900px){.npg-steps-6{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.npg-steps-6{grid-template-columns:1fr;}}
/* FAQ accordion — native <details>, styled */
.npg-faq-item{
  background:var(--npg-white);border:1px solid var(--npg-line);
  border-left:2px solid var(--npg-gold-500);
  padding:16px 20px;margin-bottom:12px;border-radius:var(--npg-radius);
}
.npg-faq-item[open]{box-shadow:var(--npg-shadow);}
.npg-faq-q{
  cursor:pointer;font-weight:600;font-size:var(--fs-h4);
  color:var(--npg-green-900);list-style:none;
}
.npg-faq-q::-webkit-details-marker{display:none;}
.npg-faq-q::after{content:"+";float:right;color:var(--npg-gold-600);font-weight:400;font-size:20px;line-height:1;}
.npg-faq-item[open] .npg-faq-q::after{content:"\2212";}
.npg-folio-link{display:block;overflow:hidden;}
.npg-folio-link img{transition:transform .6s var(--npg-ease);}
.npg-card:hover .npg-folio-link img{transform:scale(1.04);}
.npg-card-flush .npg-h-sub a{color:inherit;}
.npg-card-flush .npg-h-sub a:hover{color:var(--npg-gold-600);}

/* ============================================================
   DISTINCT HERO PER PAGE
   Home uses .npg-hero-luxury (centred, dark green, defined above).
   Each page below gets its own shape and its own weight of colour —
   no two pages open with the same silhouette, and no page is a solid
   block of dark or a flat block of white.
   ============================================================ */

/* ---- About: split, ivory background, framed portrait ---- */
.npg-hero-split{background:var(--npg-ivory);padding:72px 0 80px;}
.npg-hero-split-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
.npg-hero-split .npg-eyebrow{margin-bottom:16px;}
.npg-hero-split h1{margin:0 0 18px;}
.npg-hero-split p{font-size:17px;line-height:1.75;color:var(--npg-muted);max-width:46ch;margin:0 0 26px;}
.npg-hero-figure{position:relative;}
.npg-hero-figure .npg-media{width:100%;aspect-ratio:4/5;border-radius:3px;}
.npg-hero-figure::after{
  content:"";position:absolute;inset:18px -18px -18px 18px;
  border:1px solid var(--npg-gold-500);border-radius:3px;z-index:-1;
}
.npg-hero-stat-inline{display:flex;gap:28px;padding-top:22px;margin-top:22px;border-top:1px solid var(--npg-line);}
.npg-hero-stat-inline div strong{display:block;font-size:24px;font-weight:700;color:var(--npg-green-700);}
.npg-hero-stat-inline div span{font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--npg-muted);}

/* ---- Services: solid deep-green banner + tag strip of service links ---- */
.npg-hero-banner{background:var(--npg-green-900);padding:64px 0 0;}
.npg-hero-banner-in{padding-bottom:44px;max-width:640px;}
.npg-hero-banner .npg-eyebrow{color:var(--npg-gold-300);}
.npg-hero-banner h1{color:#fff;margin:0 0 14px;}
.npg-hero-banner p{color:rgba(255,255,255,.72);font-size:17px;line-height:1.7;max-width:52ch;margin:0;}
.npg-tagstrip{
  display:flex;flex-wrap:wrap;gap:10px;background:var(--npg-black);
  padding:18px clamp(20px,4vw,40px);
}
.npg-tagstrip a{
  font-size:13px;font-weight:500;color:rgba(255,255,255,.78);
  border:1px solid rgba(255,255,255,.18);border-radius:20px;
  padding:8px 16px;transition:all .25s var(--npg-ease);
}
.npg-tagstrip a:hover{border-color:var(--npg-gold-500);color:var(--npg-gold-300);}

/* ---- Portfolio: quiet, mostly white, small centred intro + inline count strip ---- */
.npg-hero-minimal{background:var(--npg-white);padding:76px 0 40px;text-align:center;}
.npg-hero-minimal .npg-eyebrow{justify-content:center;}
.npg-hero-minimal .npg-eyebrow::before{display:none;}
.npg-hero-minimal h1{margin:0 auto 16px;max-width:18ch;}
.npg-hero-minimal p{max-width:56ch;margin:0 auto;color:var(--npg-muted);font-size:17px;line-height:1.75;}
.npg-count-strip{
  display:flex;justify-content:center;gap:clamp(24px,5vw,56px);
  margin-top:36px;padding-top:28px;border-top:1px solid var(--npg-line);
}
.npg-count-strip div{text-align:center;}
.npg-count-strip strong{display:block;font-size:28px;font-weight:700;color:var(--npg-green-700);}
.npg-count-strip span{font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--npg-muted);}

/* ---- Contact: split, warm gold wash (not dark, not plain white) ---- */
.npg-hero-contact{background:var(--npg-gold-050);padding:64px 0;}
.npg-hero-contact-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;}
.npg-hero-contact h1{margin:0 0 14px;}
.npg-hero-contact p{color:var(--npg-muted);font-size:17px;line-height:1.7;max-width:48ch;margin:0;}
.npg-quickcard{
  background:var(--npg-white);border:1px solid var(--npg-line);border-radius:var(--npg-radius);
  padding:28px;box-shadow:var(--npg-shadow);
}
.npg-quickcard-row{
  display:flex;align-items:flex-start;gap:14px;padding:14px 0;border-bottom:1px solid var(--npg-line);
}
.npg-quickcard-row:last-child{border-bottom:0;padding-bottom:0;}
.npg-quickcard-row:first-child{padding-top:0;}
.npg-quickcard-icon{
  width:36px;height:36px;flex:none;border-radius:50%;background:var(--npg-green-050);
  display:flex;align-items:center;justify-content:center;color:var(--npg-green-700);font-size:15px;font-weight:700;
}
.npg-quickcard-row strong{display:block;font-size:14px;color:var(--npg-green-900);}
.npg-quickcard-row span,.npg-quickcard-row a{font-size:14px;color:var(--npg-muted);}

/* ---- Legal pages: small, calm, identical shape across all three ---- */
.npg-hero-legal{background:var(--npg-green-900);padding:52px 0;text-align:center;}
.npg-hero-legal .npg-eyebrow{justify-content:center;color:var(--npg-gold-300);}
.npg-hero-legal .npg-eyebrow::before{display:none;}
.npg-hero-legal h1{color:#fff;margin:0 0 10px;}
.npg-hero-legal p{color:rgba(255,255,255,.68);font-size:14px;margin:0;}

@media(max-width:900px){
  .npg-hero-split-inner,.npg-hero-contact-inner{grid-template-columns:1fr;}
  .npg-hero-figure::after{inset:12px -12px -12px 12px;}
  .npg-hero-stat-inline{gap:20px;flex-wrap:wrap;}
  .npg-count-strip{gap:22px;flex-wrap:wrap;}
}
.npg-quote-card{display:flex;flex-direction:column;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);}
.npg-quote-card .npg-quote-text{color:rgba(255,255,255,.86);}
.npg-quote-card figcaption strong{display:block;color:#fff;font-size:14px;}
.npg-quote-role{color:rgba(255,255,255,.5)!important;}
.npg-mb-0{margin-bottom:0;}

/* ---- Contact page: two-column layout, steps sidebar + form card ---- */
.npg-contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start;}
.npg-contact-aside{position:sticky;top:100px;}
.npg-steps-vert{display:flex;flex-direction:column;gap:26px;}
.npg-steps-vert .npg-step{padding-left:0;}
.npg-contact-card{padding:32px;}
.npg-req{color:var(--npg-gold-600);}
.npg-optional{color:var(--npg-muted);font-weight:400;text-transform:none;letter-spacing:0;font-size:12px;}
.npg-form-note{font-size:12.5px;color:var(--npg-muted);text-align:center;margin-top:14px;}
.npg-form-msg.success{background:var(--npg-green-050);border-left:3px solid var(--npg-green-500);color:var(--npg-green-900);padding:14px 16px;border-radius:var(--npg-radius);margin-bottom:20px;font-size:14px;}
.npg-form-msg.error{background:#FDF3F2;border-left:3px solid #C0392B;color:#8E2B21;padding:14px 16px;border-radius:var(--npg-radius);margin-bottom:20px;font-size:14px;}

@media(max-width:900px){
  .npg-contact-grid{grid-template-columns:1fr;}
  .npg-contact-aside{position:static;}
}

/* ---- Legal pages: table of contents + numbered sections ---- */
.npg-legal-updated{font-size:13px;color:var(--npg-muted);margin-bottom:32px;padding-bottom:20px;border-bottom:1px solid var(--npg-line);}
.npg-legal-grid{display:grid;grid-template-columns:.8fr 1.6fr;gap:48px;align-items:start;}
.npg-legal-toc{position:sticky;top:100px;background:var(--npg-ivory);border:1px solid var(--npg-line);border-radius:var(--npg-radius);padding:22px;}
.npg-legal-toc h4{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--npg-muted);margin-bottom:12px;}
.npg-legal-toc ol{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:9px;}
.npg-legal-toc a{font-size:13.5px;color:var(--npg-ink);}
.npg-legal-toc a:hover{color:var(--npg-gold-600);}
.npg-legal-section{margin-bottom:34px;scroll-margin-top:100px;}
.npg-legal-section h2{font-size:19px;font-weight:700;color:var(--npg-green-900);margin-bottom:10px;display:flex;gap:10px;align-items:baseline;}
.npg-legal-section h2 .npg-legal-no{color:var(--npg-gold-600);font-size:14px;}
.npg-legal-section h3{font-size:15.5px;font-weight:600;color:var(--npg-green-700);margin:16px 0 6px;}
.npg-legal-section p,.npg-legal-section li{font-size:15px;line-height:1.75;color:var(--npg-ink);}
.npg-legal-section ul,.npg-legal-section ol.npg-legal-list{padding-left:20px;margin:8px 0 12px;}
.npg-legal-note{
  background:var(--npg-gold-050);border-left:3px solid var(--npg-gold-500);
  padding:14px 16px;border-radius:var(--npg-radius);font-size:13.5px;color:var(--npg-ink);margin-bottom:32px;
}
@media(max-width:900px){
  .npg-legal-grid{grid-template-columns:1fr;}
  .npg-legal-toc{position:static;}
}

/* ============================================================
   INTERIOR-SPECIFIC HOME SECTIONS
   ============================================================ */

/* ---- Design styles — reuses the .npg-tile pattern already used
   for cities, but sized for six aesthetic categories ---- */
.npg-styles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}

/* ---- Before / After — draggable comparison slider.
   No third-party dependency: plain HTML range input + CSS clip-path,
   works with JS off (falls back to a static 50/50 split). ---- */
.npg-ba{
  position:relative;max-width:920px;margin:0 auto;
  aspect-ratio:16/10;border-radius:3px;overflow:hidden;
  box-shadow:var(--npg-shadow-lg);user-select:none;
}
.npg-ba-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.npg-ba-after{clip-path:inset(0 0 0 50%);}
.npg-ba-label{
  position:absolute;top:16px;font-size:11px;font-weight:700;letter-spacing:1.2px;
  text-transform:uppercase;color:#fff;background:rgba(16,16,16,.55);
  padding:6px 12px;border-radius:20px;z-index:3;pointer-events:none;
}
.npg-ba-label-before{left:16px;}
.npg-ba-label-after{right:16px;}
.npg-ba-handle{
  position:absolute;top:0;bottom:0;left:50%;width:3px;background:var(--npg-gold-500);
  z-index:4;transform:translateX(-50%);pointer-events:none;
}
.npg-ba-handle::before{
  content:"";position:absolute;top:50%;left:50%;width:44px;height:44px;
  transform:translate(-50%,-50%);border-radius:50%;background:var(--npg-gold-500);
  box-shadow:0 4px 14px rgba(0,0,0,.35);
}
.npg-ba-handle::after{
  content:"\2194";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  color:var(--npg-green-900);font-size:18px;font-weight:700;
}
.npg-ba-range{
  position:absolute;inset:0;width:100%;height:100%;margin:0;z-index:5;
  cursor:ew-resize;opacity:0;appearance:none;-webkit-appearance:none;
}
.npg-ba-range::-webkit-slider-thumb{-webkit-appearance:none;width:44px;height:100%;}
.npg-ba-caption{text-align:center;font-size:13px;color:var(--npg-muted);margin-top:14px;}

/* ---- Materials & finishes — horizontal scroll strip of swatches ---- */
/* Full-bleed marquee viewport — breaks out of the container padding so
   the track can scroll edge to edge, same technique used by the old
   stats marquee before it was made static; here the motion is wanted. */
.npg-materials-viewport{width:100%;overflow:hidden;padding:6px 0 18px;}
.npg-materials-track{
  display:flex;width:max-content;
  animation:npgMaterialsScroll 40s linear infinite;
}
.npg-materials-viewport:hover .npg-materials-track,
.npg-materials-viewport:focus-within .npg-materials-track{
  animation-play-state:paused;
}
.npg-materials-set{display:flex;flex-shrink:0;gap:14px;padding-right:14px;}
.npg-material{flex:0 0 auto;width:150px;text-align:center;}
.npg-material-swatch{
  width:100%;aspect-ratio:1;border-radius:3px;overflow:hidden;
  border:1px solid var(--npg-line);margin-bottom:10px;
  box-shadow:var(--npg-shadow);transition:box-shadow .3s var(--npg-ease),transform .3s var(--npg-ease);
}
.npg-material:hover .npg-material-swatch{box-shadow:var(--npg-shadow-lg);transform:translateY(-3px);}
.npg-material-swatch .npg-media{width:100%;height:100%;}
.npg-material span{font-size:13px;font-weight:600;color:var(--npg-green-900);}
.npg-material small{display:block;font-size:11px;color:var(--npg-muted);margin-top:2px;}

@keyframes npgMaterialsScroll{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}
@media (prefers-reduced-motion:reduce){
  .npg-materials-track{animation:none;}
}

/* ---- Visit our studio — city tabs + map embed, no API key required ---- */
.npg-studio-tabs{display:flex;gap:10px;margin-bottom:22px;flex-wrap:wrap;}
.npg-studio-tab{
  padding:10px 20px;border:1px solid var(--npg-line);border-radius:20px;
  background:var(--npg-white);font-size:13.5px;font-weight:600;color:var(--npg-ink);
  cursor:pointer;transition:all .2s var(--npg-ease);
}
.npg-studio-tab.is-active{background:var(--npg-green-700);border-color:var(--npg-green-700);color:#fff;}
.npg-studio-map-wrap{position:relative;border-radius:3px;overflow:hidden;box-shadow:var(--npg-shadow);}
.npg-studio-map{display:none;width:100%;height:380px;border:0;}
.npg-studio-map.is-active{display:block;}

/* ---- WhatsApp floating button — site-wide, real wa.me deep link ---- */
.npg-whatsapp-float{
  position:fixed;right:20px;bottom:20px;z-index:200;
  width:56px;height:56px;border-radius:50%;background:#25D366;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(0,0,0,.28);transition:transform .2s var(--npg-ease);
}
.npg-whatsapp-float:hover{transform:scale(1.07);}
.npg-whatsapp-float svg{width:28px;height:28px;fill:#fff;}
@media(max-width:600px){.npg-whatsapp-float{right:14px;bottom:14px;width:50px;height:50px;}}

@media(max-width:700px){
  .npg-styles-grid{grid-template-columns:repeat(2,1fr);}
  .npg-ba{aspect-ratio:4/5;}
}

/* ============================================================
   MOBILE FIXES — estimate wizard progress bar + form field pairs
   Found during a responsiveness audit: neither had a dedicated
   mobile override, so on narrow screens the 8-label progress bar
   and the two-column field pairs (Name/Email, City/Carpet area)
   were squeezing into unreadably narrow columns instead of stacking.
   ============================================================ */
@media(max-width:700px){
  .npg-field-row{grid-template-columns:1fr;gap:0;}

  .npg-progress{
    overflow-x:auto;justify-content:flex-start;gap:4px;
    -webkit-overflow-scrolling:touch;padding-bottom:4px;
    scrollbar-width:thin;
  }
  .npg-progress-step{flex:0 0 auto;min-width:84px;font-size:10.5px;padding:0 4px 12px;}
}
/* ============================================================
   PASTE AT THE VERY BOTTOM OF style.css
   ============================================================ */

/* ----------------------------------------------------------
   HERO SLIDER
   ---------------------------------------------------------- */
.npg-slider{
  position:relative;
  width:100%;
  overflow:hidden;
  background:var(--npg-green-900);
  height:88vh;
  min-height:520px;
  max-height:860px;
}
.npg-slider-track{
  width:100%;
  height:100%;
}
.npg-slide{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity .8s ease;
  pointer-events:none;
}
.npg-slide.is-active{
  opacity:1;
  pointer-events:auto;
  z-index:2;
}
.npg-slide-bg{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
}
.npg-slide-bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.npg-slide-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
    to right,
    rgba(6,26,18,.88) 0%,
    rgba(6,26,18,.72) 38%,
    rgba(6,26,18,.28) 65%,
    rgba(6,26,18,.0)  100%
  );
  z-index:1;
}
.npg-slide-inner{
  position:relative;
  z-index:3;
  height:100%;
  display:flex;
  align-items:center;
}
.npg-slide-content{
  max-width:560px;
}
.npg-slide-eyebrow{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  font-weight:600;
  letter-spacing:.22em;
  color:var(--npg-gold-300);
  text-transform:uppercase;
  margin-bottom:20px;
  opacity:0;
  transform:translateY(12px);
  transition:opacity .5s ease .2s, transform .5s ease .2s;
}
.npg-slide-eyebrow::before{
  content:"";
  width:24px;height:1px;
  background:var(--npg-gold-300);
  display:inline-block;
  flex-shrink:0;
}
.npg-slide-heading{
  font-size:clamp(32px,3.6vw,58px);
  font-weight:700;
  line-height:1.14;
  letter-spacing:-.02em;
  margin:0 0 20px;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .55s ease .35s, transform .55s ease .35s;
}
.npg-slide-heading span{ display:block; }
.npg-slide-sub{
  font-size:16px;
  line-height:1.72;
  color:rgba(255,255,255,.78);
  margin:0 0 34px;
  max-width:480px;
  opacity:0;
  transform:translateY(12px);
  transition:opacity .5s ease .5s, transform .5s ease .5s;
}
.npg-slide-ctas{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  opacity:0;
  transform:translateY(10px);
  transition:opacity .5s ease .65s, transform .5s ease .65s;
}
.npg-slider-outline{
  display:inline-block;
  padding:14px 32px;
  background:transparent;
  border:1px solid rgba(255,255,255,.55);
  color:#fff;
  border-radius:2px;
  font-size:14px;
  letter-spacing:1px;
  text-transform:uppercase;
  cursor:pointer;
  transition:.25s;
}
.npg-slider-outline:hover{
  background:#fff;
  border-color:#fff;
  color:var(--npg-green-900);
}
/* Animate in when slide becomes active */
.npg-slide.is-active .npg-slide-eyebrow,
.npg-slide.is-active .npg-slide-heading,
.npg-slide.is-active .npg-slide-sub,
.npg-slide.is-active .npg-slide-ctas{
  opacity:1;
  transform:translateY(0);
}
/* Dots */
.npg-slider-dots{
  position:absolute;
  bottom:28px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:10px;
  z-index:10;
}
.npg-dot{
  width:8px;height:8px;
  border-radius:50%;
  background:rgba(255,255,255,.35);
  border:none;
  cursor:pointer;
  padding:0;
  transition:background .3s, transform .3s;
}
.npg-dot.is-active{
  background:var(--npg-gold-500);
  transform:scale(1.35);
}
/* Arrows */
.npg-slider-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:10;
  background:rgba(6,26,18,.45);
  border:1px solid rgba(201,162,39,.3);
  color:#fff;
  width:48px;height:48px;
  border-radius:2px;
  font-size:18px;
  cursor:pointer;
  transition:background .25s, border-color .25s;
  display:flex;align-items:center;justify-content:center;
}
.npg-slider-arrow:hover{
  background:var(--npg-gold-500);
  border-color:var(--npg-gold-500);
  color:var(--npg-green-900);
}
.npg-arrow-prev{ left:24px; }
.npg-arrow-next{ right:24px; }
/* Progress bar */
.npg-slider-progress{
  position:absolute;
  bottom:0;left:0;right:0;
  height:3px;
  background:rgba(255,255,255,.12);
  z-index:10;
}
.npg-slider-progress-bar{
  height:100%;
  width:0%;
  background:var(--npg-gold-500);
}
.npg-slider-progress-bar.is-running{
  width:100%;
  transition:width 6s linear;
}
/* Responsive */
@media(max-width:768px){
  .npg-slider{ height:100vw; max-height:560px; min-height:400px; }
  .npg-slide-overlay{
    background:linear-gradient(to bottom,rgba(6,26,18,.55) 0%,rgba(6,26,18,.82) 60%,rgba(6,26,18,.92) 100%);
  }
  .npg-slide-inner{ align-items:flex-end; padding-bottom:64px; }
  .npg-slide-content{ max-width:100%; }
  .npg-slide-heading{ font-size:28px; }
  .npg-arrow-prev{ left:12px; }
  .npg-arrow-next{ right:12px; }
  .npg-slider-arrow{ width:40px;height:40px;font-size:16px; }
}
@media(max-width:480px){
  .npg-slide-sub{ font-size:14px; }
  .npg-slide-ctas{ flex-direction:column; gap:10px; }
  .npg-slide-ctas .npg-btn,.npg-slide-ctas .npg-slider-outline{ text-align:center; }
}
@media(prefers-reduced-motion:reduce){
  .npg-slide{ transition:none; }
  .npg-slide-eyebrow,.npg-slide-heading,.npg-slide-sub,.npg-slide-ctas{ transition:none;opacity:1;transform:none; }
  .npg-slider-progress-bar{ transition:none; }
}


/* ----------------------------------------------------------
   SECTION 4 — 5-step linear track
   ---------------------------------------------------------- */
.npg-steps-home{
  grid-template-columns:repeat(5,1fr);
}
.npg-steps-home::before{
  display:block;
  top:22px;
  left:5%;right:5%;
}

#how-we-work .npg-step-no {
  position: relative;
  z-index: 2;
  background: #ffffff;
}
@media(max-width:900px){
  .npg-steps-home{ grid-template-columns:repeat(3,1fr); }
  .npg-steps-home::before{ display:none; }
}
@media(max-width:560px){
  .npg-steps-home{ grid-template-columns:1fr; }
}


/* ----------------------------------------------------------
   SECTION 5 — luxury comparison table
   ---------------------------------------------------------- */
.npg-luxury-table-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border:1px solid rgba(201,162,39,.35);
  border-radius:2px;
}
.npg-luxury-table{
  width:100%;
  border-collapse:collapse;
  min-width:600px;
  background:rgba(6,42,31,.55);
}
.npg-lt-col-feature{ width:30%; }
.npg-lt-col-npg    { width:40%; }
.npg-lt-col-other  { width:30%; }
.npg-luxury-table thead tr{ border-bottom:1px solid rgba(201,162,39,.5); }
.npg-luxury-table thead th{
  padding:22px 28px;
  text-align:left;
  font-size:12px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  color:rgba(255,255,255,.45);
  border-right:1px solid rgba(201,162,39,.18);
}
.npg-luxury-table thead th:last-child{ border-right:none; }
.npg-lt-brand{
  display:block;font-size:15px;font-weight:700;
  color:var(--npg-gold-300);letter-spacing:.01em;
  text-transform:none;margin-bottom:5px;
}
.npg-lt-badge{
  display:inline-block;
  border:1px solid rgba(201,162,39,.5);
  color:var(--npg-gold-300);
  font-size:10px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  padding:3px 10px;border-radius:1px;
}
.npg-lt-other-label{
  display:block;font-size:14px;font-weight:500;
  color:rgba(255,255,255,.4);
  text-transform:none;letter-spacing:0;
}
.npg-lt-row{ border-bottom:1px solid rgba(255,255,255,.07); transition:background .2s; }
.npg-lt-row:last-child{ border-bottom:none; }
.npg-lt-row:hover{ background:rgba(201,162,39,.06); }
.npg-luxury-table tbody td{
  padding:17px 28px;
  font-size:14px;line-height:1.55;
  vertical-align:middle;
  border-right:1px solid rgba(201,162,39,.15);
}
.npg-luxury-table tbody td:last-child{ border-right:none; }
.npg-lt-feature{ color:rgba(255,255,255,.75);font-size:13px;font-weight:500; }
.npg-lt-yes{ color:rgba(255,255,255,.9);font-size:13px; }
.npg-lt-tick{
  display:inline-block;width:16px;height:16px;
  border:1.5px solid var(--npg-gold-500);border-radius:50%;
  position:relative;margin-right:10px;vertical-align:middle;flex-shrink:0;
}
.npg-lt-tick::after{
  content:"";position:absolute;left:3px;top:1px;
  width:6px;height:9px;
  border:1.5px solid var(--npg-gold-500);
  border-top:none;border-left:none;
  transform:rotate(40deg);
}
.npg-lt-no{ color:rgba(255,255,255,.38);font-size:13px; }
.npg-lt-cross{
  display:inline-block;width:14px;height:14px;
  position:relative;margin-right:10px;vertical-align:middle;flex-shrink:0;
}
.npg-lt-cross::before,.npg-lt-cross::after{
  content:"";position:absolute;top:6px;left:0;
  width:14px;height:1.5px;background:rgba(255,255,255,.3);
}
.npg-lt-cross::before{ transform:rotate(45deg); }
.npg-lt-cross::after { transform:rotate(-45deg); }
@media(max-width:640px){
  .npg-luxury-table thead th,.npg-luxury-table tbody td{ padding:13px 14px;font-size:12px; }
}


/* ----------------------------------------------------------
   UTILITY
   ---------------------------------------------------------- */
.npg-mt-4{ margin-top:var(--sp-5); }/* ============================================================
   PASTE AT THE VERY BOTTOM OF style.css
   ============================================================ */

/* ----------------------------------------------------------
   HERO SLIDER
   ---------------------------------------------------------- */
.npg-slider{
  position:relative;
  width:100%;
  overflow:hidden;
  background:var(--npg-green-900);
  height:88vh;
  min-height:520px;
  max-height:860px;
}
.npg-slider-track{
  width:100%;
  height:100%;
}
.npg-slide{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity .8s ease;
  pointer-events:none;
}
.npg-slide.is-active{
  opacity:1;
  pointer-events:auto;
  z-index:2;
}
.npg-slide-bg{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
}
.npg-slide-bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.npg-slide-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
    to right,
    rgba(6,26,18,.88) 0%,
    rgba(6,26,18,.72) 38%,
    rgba(6,26,18,.28) 65%,
    rgba(6,26,18,.0)  100%
  );
  z-index:1;
}
.npg-slide-inner{
  position:relative;
  z-index:3;
  height:100%;
  display:flex;
  align-items:center;
}
.npg-slide-content{
  max-width:560px;
}
.npg-slide-eyebrow{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  font-weight:600;
  letter-spacing:.22em;
  color:var(--npg-gold-300);
  text-transform:uppercase;
  margin-bottom:20px;
  opacity:0;
  transform:translateY(12px);
  transition:opacity .5s ease .2s, transform .5s ease .2s;
}
.npg-slide-eyebrow::before{
  content:"";
  width:24px;height:1px;
  background:var(--npg-gold-300);
  display:inline-block;
  flex-shrink:0;
}
.npg-slide-heading{
  font-size:clamp(32px,3.6vw,58px);
  font-weight:700;
  line-height:1.14;
  letter-spacing:-.02em;
  margin:0 0 20px;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .55s ease .35s, transform .55s ease .35s;
}
.npg-slide-heading span{ display:block; }
.npg-slide-sub{
  font-size:16px;
  line-height:1.72;
  color:rgba(255,255,255,.78);
  margin:0 0 34px;
  max-width:480px;
  opacity:0;
  transform:translateY(12px);
  transition:opacity .5s ease .5s, transform .5s ease .5s;
}
.npg-slide-ctas{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  opacity:0;
  transform:translateY(10px);
  transition:opacity .5s ease .65s, transform .5s ease .65s;
}
.npg-slider-outline{
  display:inline-block;
  padding:14px 32px;
  background:transparent;
  border:1px solid rgba(255,255,255,.55);
  color:#fff;
  border-radius:2px;
  font-size:14px;
  letter-spacing:1px;
  text-transform:uppercase;
  cursor:pointer;
  transition:.25s;
}
.npg-slider-outline:hover{
  background:#fff;
  border-color:#fff;
  color:var(--npg-green-900);
}
/* Animate in when slide becomes active */
.npg-slide.is-active .npg-slide-eyebrow,
.npg-slide.is-active .npg-slide-heading,
.npg-slide.is-active .npg-slide-sub,
.npg-slide.is-active .npg-slide-ctas{
  opacity:1;
  transform:translateY(0);
}
/* Dots */
.npg-slider-dots{
  position:absolute;
  bottom:28px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:10px;
  z-index:10;
}
.npg-dot{
  width:8px;height:8px;
  border-radius:50%;
  background:rgba(255,255,255,.35);
  border:none;
  cursor:pointer;
  padding:0;
  transition:background .3s, transform .3s;
}
.npg-dot.is-active{
  background:var(--npg-gold-500);
  transform:scale(1.35);
}
/* Arrows */
.npg-slider-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:10;
  background:rgba(6,26,18,.45);
  border:1px solid rgba(201,162,39,.3);
  color:#fff;
  width:48px;height:48px;
  border-radius:2px;
  font-size:18px;
  cursor:pointer;
  transition:background .25s, border-color .25s;
  display:flex;align-items:center;justify-content:center;
}
.npg-slider-arrow:hover{
  background:var(--npg-gold-500);
  border-color:var(--npg-gold-500);
  color:var(--npg-green-900);
}
.npg-arrow-prev{ left:24px; }
.npg-arrow-next{ right:24px; }
/* Progress bar */
.npg-slider-progress{
  position:absolute;
  bottom:0;left:0;right:0;
  height:3px;
  background:rgba(255,255,255,.12);
  z-index:10;
}
.npg-slider-progress-bar{
  height:100%;
  width:0%;
  background:var(--npg-gold-500);
}
.npg-slider-progress-bar.is-running{
  width:100%;
  transition:width 6s linear;
}
/* Responsive */
@media(max-width:768px){
  .npg-slider{ height:100vw; max-height:560px; min-height:400px; }
  .npg-slide-overlay{
    background:linear-gradient(to bottom,rgba(6,26,18,.55) 0%,rgba(6,26,18,.82) 60%,rgba(6,26,18,.92) 100%);
  }
  .npg-slide-inner{ align-items:flex-end; padding-bottom:64px; }
  .npg-slide-content{ max-width:100%; }
  .npg-slide-heading{ font-size:28px; }
  .npg-arrow-prev{ left:12px; }
  .npg-arrow-next{ right:12px; }
  .npg-slider-arrow{ width:40px;height:40px;font-size:16px; }
}
@media(max-width:480px){
  .npg-slide-sub{ font-size:14px; }
  .npg-slide-ctas{ flex-direction:column; gap:10px; }
  .npg-slide-ctas .npg-btn,.npg-slide-ctas .npg-slider-outline{ text-align:center; }
}
@media(prefers-reduced-motion:reduce){
  .npg-slide{ transition:none; }
  .npg-slide-eyebrow,.npg-slide-heading,.npg-slide-sub,.npg-slide-ctas{ transition:none;opacity:1;transform:none; }
  .npg-slider-progress-bar{ transition:none; }
}


/* ----------------------------------------------------------
   SECTION 4 — 5-step linear track
   ---------------------------------------------------------- */
.npg-steps-home{
  grid-template-columns:repeat(5,1fr);
}
.npg-steps-home::before{
  display:block;
  top:22px;
  left:5%;right:5%;
}

#how-we-work .npg-step-no {
  position: relative;
  z-index: 2;
  background: #ffffff;
}
@media(max-width:900px){
  .npg-steps-home{ grid-template-columns:repeat(3,1fr); }
  .npg-steps-home::before{ display:none; }
}
@media(max-width:560px){
  .npg-steps-home{ grid-template-columns:1fr; }
}


/* ----------------------------------------------------------
   SECTION 5 — luxury comparison table
   ---------------------------------------------------------- */
.npg-luxury-table-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border:1px solid rgba(201,162,39,.35);
  border-radius:2px;
}
.npg-luxury-table{
  width:100%;
  border-collapse:collapse;
  min-width:600px;
  background:rgba(6,42,31,.55);
}
.npg-lt-col-feature{ width:30%; }
.npg-lt-col-npg    { width:40%; }
.npg-lt-col-other  { width:30%; }
.npg-luxury-table thead tr{ border-bottom:1px solid rgba(201,162,39,.5); }
.npg-luxury-table thead th{
  padding:22px 28px;
  text-align:left;
  font-size:12px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  color:rgba(255,255,255,.45);
  border-right:1px solid rgba(201,162,39,.18);
}
.npg-luxury-table thead th:last-child{ border-right:none; }
.npg-lt-brand{
  display:block;font-size:15px;font-weight:700;
  color:var(--npg-gold-300);letter-spacing:.01em;
  text-transform:none;margin-bottom:5px;
}
.npg-lt-badge{
  display:inline-block;
  border:1px solid rgba(201,162,39,.5);
  color:var(--npg-gold-300);
  font-size:10px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  padding:3px 10px;border-radius:1px;
}
.npg-lt-other-label{
  display:block;font-size:14px;font-weight:500;
  color:rgba(255,255,255,.4);
  text-transform:none;letter-spacing:0;
}
.npg-lt-row{ border-bottom:1px solid rgba(255,255,255,.07); transition:background .2s; }
.npg-lt-row:last-child{ border-bottom:none; }
.npg-lt-row:hover{ background:rgba(201,162,39,.06); }
.npg-luxury-table tbody td{
  padding:17px 28px;
  font-size:14px;line-height:1.55;
  vertical-align:middle;
  border-right:1px solid rgba(201,162,39,.15);
}
.npg-luxury-table tbody td:last-child{ border-right:none; }
.npg-lt-feature{ color:rgba(255,255,255,.75);font-size:13px;font-weight:500; }
.npg-lt-yes{ color:rgba(255,255,255,.9);font-size:13px; }
.npg-lt-tick{
  display:inline-block;width:16px;height:16px;
  border:1.5px solid var(--npg-gold-500);border-radius:50%;
  position:relative;margin-right:10px;vertical-align:middle;flex-shrink:0;
}
.npg-lt-tick::after{
  content:"";position:absolute;left:3px;top:1px;
  width:6px;height:9px;
  border:1.5px solid var(--npg-gold-500);
  border-top:none;border-left:none;
  transform:rotate(40deg);
}
.npg-lt-no{ color:rgba(255,255,255,.38);font-size:13px; }
.npg-lt-cross{
  display:inline-block;width:14px;height:14px;
  position:relative;margin-right:10px;vertical-align:middle;flex-shrink:0;
}
.npg-lt-cross::before,.npg-lt-cross::after{
  content:"";position:absolute;top:6px;left:0;
  width:14px;height:1.5px;background:rgba(255,255,255,.3);
}
.npg-lt-cross::before{ transform:rotate(45deg); }
.npg-lt-cross::after { transform:rotate(-45deg); }
@media(max-width:640px){
  .npg-luxury-table thead th,.npg-luxury-table tbody td{ padding:13px 14px;font-size:12px; }
}


/* ----------------------------------------------------------
   UTILITY
   ---------------------------------------------------------- */
.npg-mt-4{ margin-top:var(--sp-5); }


/* ============================================================
   DASHBOARD — New clean styles
   ============================================================ */

/* Page head */
.npg-dash-page-head{
	display:flex;align-items:center;gap:16px;
	margin-bottom:28px;
}
.npg-dash-page-head h1{
	font-size:22px;font-weight:700;
	color:var(--npg-green-900);margin:0;
}
.npg-dash-count{
	font-size:13px;color:#888;
	background:#f4f4f4;padding:3px 10px;
	border-radius:20px;
}
.npg-dash-back{
	font-size:13px;color:var(--npg-green-700);
	text-decoration:none;white-space:nowrap;
}

/* Filters */
.npg-dash-filters{ margin-bottom:16px; }
.npg-dash-filter-form{
	display:flex;gap:10px;flex-wrap:wrap;align-items:center;
}
.npg-dash-input,.npg-dash-select{
	padding:8px 12px;
	border:1px solid #ddd;border-radius:4px;
	font-size:13px;background:#fff;
	color:var(--npg-ink);
}
.npg-dash-input{ min-width:220px; }
.npg-dash-btn{
	padding:8px 18px;
	background:var(--npg-green-700);color:#fff;
	border:none;border-radius:4px;
	font-size:13px;font-weight:600;
	cursor:pointer;text-decoration:none;
	display:inline-block;
}
.npg-dash-btn:hover{ background:var(--npg-green-900); }
.npg-dash-btn-ghost{
	padding:8px 14px;
	background:transparent;color:#888;
	border:1px solid #ddd;border-radius:4px;
	font-size:13px;cursor:pointer;
	text-decoration:none;display:inline-block;
}
.npg-btn-whatsapp{
	background:#25d366 !important;
}

/* Status tabs */
.npg-dash-tabs{
	display:flex;gap:4px;
	margin-bottom:20px;
	border-bottom:1px solid #eee;
	padding-bottom:0;
}
.npg-dash-tab{
	padding:8px 16px;
	font-size:13px;font-weight:500;
	color:#888;text-decoration:none;
	border-bottom:2px solid transparent;
	margin-bottom:-1px;
	transition:.2s;
	display:flex;align-items:center;gap:6px;
}
.npg-dash-tab.active{
	color:var(--npg-green-700);
	border-bottom-color:var(--npg-green-700);
}
.npg-dash-tab-count{
	background:#f0f0f0;
	padding:1px 7px;border-radius:20px;
	font-size:11px;font-weight:600;
}
.npg-dash-tab.active .npg-dash-tab-count{
	background:var(--npg-green-050);
	color:var(--npg-green-700);
}

/* Table */
.npg-dash-table-wrap{
	overflow-x:auto;
	border:1px solid #eee;border-radius:6px;
}
.npg-dash-table{
	width:100%;border-collapse:collapse;
	font-size:13px;min-width:700px;
}
.npg-dash-table thead tr{
	background:#f8f9fa;
}
.npg-dash-table th{
	padding:12px 16px;text-align:left;
	font-weight:600;color:#555;
	font-size:12px;letter-spacing:.3px;
	text-transform:uppercase;
	border-bottom:1px solid #eee;
}
.npg-dash-table td{
	padding:13px 16px;
	border-bottom:1px solid #f2f2f2;
	vertical-align:middle;
}
.npg-dash-table tr:last-child td{ border-bottom:none; }
.npg-dash-table tr:hover td{ background:#fafafa; }

.npg-dash-td-id{ color:#aaa;font-size:12px; }
.npg-dash-td-name strong{ color:var(--npg-ink);font-weight:600; }
.npg-dash-td-date{ color:#888;font-size:12px;white-space:nowrap; }
.npg-dash-td-actions{ white-space:nowrap; }

.npg-dash-empty{
	text-align:center;padding:40px;
	color:#aaa;font-size:14px;
}
.npg-dash-empty-sm{
	color:#aaa;font-size:13px;margin:12px 0 0;
}

/* Status pill */
.npg-dash-status-pill{
	display:inline-block;
	padding:3px 10px;border-radius:20px;
	font-size:11px;font-weight:600;
	letter-spacing:.3px;text-transform:uppercase;
}

/* Small button */
.npg-dash-btn-sm{
	padding:5px 12px;
	background:var(--npg-green-050);
	color:var(--npg-green-700);
	border:1px solid var(--npg-green-200);
	border-radius:4px;font-size:12px;
	font-weight:600;text-decoration:none;
	cursor:pointer;
}
.npg-dash-btn-sm:hover{
	background:var(--npg-green-700);color:#fff;
}

/* Alert */
.npg-dash-alert{
	padding:12px 18px;border-radius:4px;
	margin-bottom:20px;font-size:14px;
}
.npg-dash-alert-success{
	background:#e8f5e9;color:#2e7d52;
	border:1px solid #c8e6c9;
}
.npg-dash-alert-error{
	background:#fdecea;color:#c0392b;
	border:1px solid #f5c6c2;
}

/* Dashboard card */
.npg-dash-card{
	background:#fff;border:1px solid #eee;
	border-radius:6px;padding:24px;
	margin-bottom:20px;
}
.npg-dash-card-head{
	display:flex;align-items:center;
	justify-content:space-between;
	margin-bottom:16px;
}
.npg-dash-card h2{
	font-size:16px;font-weight:700;
	color:var(--npg-green-900);margin:0;
}
.npg-dash-card h3{
	font-size:14px;font-weight:700;
	color:var(--npg-ink);margin:0 0 16px;
}

/* Lead detail grid */
.npg-lead-detail-grid{
	display:grid;
	grid-template-columns:1fr 380px;
	gap:24px;align-items:start;
}
@media(max-width:900px){
	.npg-lead-detail-grid{ grid-template-columns:1fr; }
}

/* Lead info grid */
.npg-lead-info-grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:16px;
}
.npg-lead-info-item{
	display:flex;flex-direction:column;gap:3px;
}
.npg-lead-info-label{
	font-size:11px;font-weight:600;
	text-transform:uppercase;letter-spacing:.4px;
	color:#aaa;
}
.npg-lead-info-value{
	font-size:14px;color:var(--npg-ink);
}
.npg-lead-info-value a{
	color:var(--npg-green-700);text-decoration:none;
}

/* Lead message */
.npg-lead-message{
	margin-top:16px;padding-top:16px;
	border-top:1px solid #f2f2f2;
}
.npg-lead-message p{
	font-size:14px;color:var(--npg-ink);
	line-height:1.6;margin:6px 0 0;
}

/* Quick actions */
.npg-lead-quick-actions{
	display:flex;gap:10px;flex-wrap:wrap;
	margin-top:20px;padding-top:20px;
	border-top:1px solid #f2f2f2;
}

/* Status radio group */
.npg-status-radio-group{
	display:grid;grid-template-columns:1fr 1fr;gap:8px;
}
.npg-status-radio{
	display:block;padding:8px 14px;
	border:1px solid #ddd;border-radius:4px;
	font-size:13px;font-weight:500;
	cursor:pointer;transition:.2s;
	color:#555;
}
.npg-status-radio input[type="radio"]{ display:none; }
.npg-status-radio.checked,.npg-status-radio:hover{
	font-weight:600;
}

/* Notes */
.npg-note-form{ margin-bottom:20px; }
.npg-dash-textarea{
	width:100%;padding:10px 12px;
	border:1px solid #ddd;border-radius:4px;
	font-size:13px;resize:vertical;
	font-family:inherit;margin-bottom:8px;
	box-sizing:border-box;
}
.npg-notes-list{ display:flex;flex-direction:column;gap:12px; }
.npg-note-item{
	padding:12px;background:#f9f9f9;
	border-radius:4px;border-left:3px solid var(--npg-green-700);
}
.npg-note-text{ font-size:13px;color:var(--npg-ink);margin:0 0 4px; }
.npg-note-meta{ font-size:11px;color:#aaa; }

/* Photos grid */
.npg-photos-grid{
	display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
}
.npg-photo-thumb{
	display:block;border-radius:4px;overflow:hidden;
	aspect-ratio:1;border:1px solid #eee;
}
.npg-photo-thumb img{
	width:100%;height:100%;object-fit:cover;display:block;
	transition:transform .2s;
}
.npg-photo-thumb:hover img{ transform:scale(1.04); }

/* Sidebar brand updated */
.npg-dash-brand{
	padding:24px 20px 20px;
	border-bottom:1px solid rgba(255,255,255,.1);
	margin-bottom:8px;
}
.npg-dash-brand-name{
	display:block;font-size:14px;
	font-weight:700;color:#fff;
	line-height:1.3;
}
.npg-dash-brand-sub{
	display:block;font-size:11px;
	color:rgba(255,255,255,.45);
	letter-spacing:.5px;text-transform:uppercase;
	margin-top:3px;
}

/* Nav link with icon */
.npg-dash-nav-link{
	display:flex;align-items:center;
	gap:10px;padding:9px 20px;
	color:rgba(255,255,255,.7);
	text-decoration:none;font-size:13px;
	transition:.2s;
}
.npg-dash-nav-link:hover,.npg-dash-nav-link.active{
	color:#fff;background:rgba(255,255,255,.1);
}
.npg-dash-nav-icon{
	font-size:14px;opacity:.8;flex-shrink:0;
}

/* Sidebar footer */
.npg-dash-sidebar-footer{
	padding:16px 20px;
	border-top:1px solid rgba(255,255,255,.1);
	display:flex;flex-direction:column;gap:8px;
}
.npg-dash-footer-link{
	font-size:12px;color:rgba(255,255,255,.5);
	text-decoration:none;
}
.npg-dash-footer-link:hover{ color:#fff; }
.npg-dash-logout-link{ color:rgba(255,100,100,.7); }
.npg-dash-logout-link:hover{ color:#ff6b6b; }


/* ============================================================
   LIBRARY PAGE CSS
   ============================================================ */

.npg-lib-layout{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:24px;
    align-items:start;
}
@media(max-width:900px){
    .npg-lib-layout{ grid-template-columns:1fr; }
}

/* Sidebar room list */
.npg-lib-room-list{
    display:flex;flex-direction:column;gap:4px;
    margin-bottom:20px;
}
.npg-lib-room-item{
    display:flex;align-items:center;gap:10px;
    padding:8px 10px;border-radius:4px;
    text-decoration:none;color:var(--npg-ink);
    font-size:13px;font-weight:500;
    transition:.15s;
}
.npg-lib-room-item:hover{ background:#f5f5f5; }
.npg-lib-room-item.active{
    background:var(--npg-green-050);
    color:var(--npg-green-700);
    font-weight:600;
}
.npg-lib-room-item img{
    width:36px;height:36px;
    object-fit:cover;border-radius:4px;
    flex-shrink:0;
}
.npg-lib-room-no-img{
    width:36px;height:36px;
    background:#f0f0f0;border-radius:4px;
    flex-shrink:0;
}

/* Add form in sidebar */
.npg-lib-add-form{
    padding-top:16px;
    border-top:1px solid #eee;
}
.npg-lib-add-form h4{
    font-size:13px;font-weight:600;
    color:var(--npg-green-700);
    margin:0 0 12px;
}
.npg-lib-add-form .npg-dash-input,
.npg-lib-add-form .npg-dash-select{
    width:100%;margin-bottom:8px;
}
.npg-lib-add-form .npg-dash-btn{
    width:100%;justify-content:center;
}

/* Rates grid */
.npg-lib-rates{
    display:grid;grid-template-columns:1fr 1fr 1fr;
    gap:8px;margin-bottom:12px;
}
.npg-lib-rates label{
    display:flex;flex-direction:column;gap:4px;
    font-size:12px;font-weight:600;color:#666;
}
.npg-lib-rates .npg-dash-input{
    width:100%;
}
@media(max-width:600px){
    .npg-lib-rates{ grid-template-columns:1fr; }
}

/* Sections inside detail */
.npg-lib-section{
    margin-bottom:24px;
    padding-bottom:24px;
    border-bottom:1px solid #f2f2f2;
}
.npg-lib-section:last-child{
    border-bottom:none;margin-bottom:0;padding-bottom:0;
}
.npg-lib-section h4{
    font-size:13px;font-weight:700;
    color:var(--npg-ink);margin:0 0 12px;
}
.npg-lib-hint{
    font-size:12px;color:#aaa;margin:-8px 0 12px;
}

/* Image upload */
.npg-lib-img-form{
    display:flex;align-items:center;gap:12px;
    flex-wrap:wrap;
}
.npg-lib-thumb{
    width:80px;height:80px;
    object-fit:cover;border-radius:4px;
    border:1px solid #eee;
}
.npg-lib-no-img{
    width:80px;height:80px;
    background:#f5f5f5;border-radius:4px;
    border:1px dashed #ddd;
    display:flex;align-items:center;justify-content:center;
    font-size:11px;color:#aaa;
}
.npg-lib-upload-btn{
    cursor:pointer;
}

/* Subtypes grid */
.npg-lib-subtypes-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
    gap:12px;
    margin-bottom:16px;
}
.npg-lib-subtype-card{
    border:1px solid #eee;border-radius:6px;
    padding:12px;text-align:center;
}
.npg-lib-subtype-card .npg-lib-img-form{
    flex-direction:column;align-items:center;
}
.npg-lib-subtype-name{
    font-size:12px;font-weight:600;
    margin:8px 0 6px;color:var(--npg-ink);
}
.npg-lib-delete-sm{
    font-size:11px;color:#c0392b;
    background:none;border:none;
    cursor:pointer;padding:0;
    text-decoration:underline;
}

/* Add subtype form */
.npg-lib-add-subtype-form{
    display:flex;gap:8px;align-items:center;
    margin-top:12px;
}
.npg-lib-add-subtype-form .npg-dash-input{
    flex:1;
}

/* Assigned rooms */
.npg-lib-assigned-rooms{
    display:flex;flex-direction:column;
    gap:8px;margin-bottom:16px;
}
.npg-lib-assigned-room{
    display:flex;align-items:center;gap:10px;
    padding:8px 12px;background:#f9f9f9;
    border-radius:4px;border:1px solid #eee;
}
.npg-lib-assigned-room img{
    width:32px;height:32px;
    object-fit:cover;border-radius:3px;
    flex-shrink:0;
}
.npg-lib-assigned-room span{
    flex:1;font-size:13px;font-weight:500;
}

/* Assign form */
.npg-lib-assign-form{
    display:flex;gap:8px;align-items:center;
    margin-top:8px;
}
.npg-lib-assign-form .npg-dash-select{
    flex:1;
}

/* Rates form */
.npg-lib-rates-form .npg-lib-rates{
    margin-bottom:12px;
}

/* Empty state */
.npg-lib-empty-state{
    text-align:center;
    padding:48px 24px;
    color:#aaa;font-size:14px;
}

/* Danger button */
.npg-dash-btn-danger{
    padding:6px 14px;
    background:#fdecea;color:#c0392b;
    border:1px solid #f5c6c2;
    border-radius:4px;font-size:12px;
    font-weight:600;cursor:pointer;
}
.npg-dash-btn-danger:hover{
    background:#c0392b;color:#fff;
}
/* ============================================================
   WIZARD — paste at bottom of style.css
   Premium, minimal, dark green + gold
   ============================================================ */

.npg-wiz-section{ background:var(--npg-ivory); }

.npg-wiz-eyebrow{
  font-size:var(--fs-eyebrow);font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--npg-gold-600);margin-bottom:10px;
}
.npg-wiz-intro{
  font-size:var(--fs-small);color:var(--npg-muted);
  max-width:480px;margin:0 auto;
}
.npg-mb-3{ margin-bottom:var(--sp-3); }

/* ── Wizard shell ── */
.npg-wiz{
  background:#fff;
  border-radius:4px;
  box-shadow:0 2px 24px rgba(6,42,31,.10);
  overflow:hidden;
}

/* ── Progress bar ── */
.npg-wiz-progress{
  display:flex;align-items:center;
  padding:24px 32px 20px;
  background:#fff;
  border-bottom:1px solid var(--npg-line);
  gap:0;
}
.npg-wiz-prog-step{
  display:flex;flex-direction:column;
  align-items:center;gap:6px;
  flex-shrink:0;
}
.npg-wiz-prog-dot{
  width:32px;height:32px;
  border-radius:50%;
  border:2px solid var(--npg-line);
  background:#fff;
  display:flex;align-items:center;justify-content:center;
  transition:.3s;position:relative;
}
.npg-wiz-prog-num{
  font-size:13px;font-weight:700;
  color:#bbb;transition:.3s;
}
.npg-wiz-prog-check{
  display:none;width:14px;height:14px;
  color:#fff;
}
.npg-wiz-prog-label{
  font-size:11px;font-weight:600;
  color:#ccc;letter-spacing:.3px;
  text-transform:uppercase;
  transition:.3s;white-space:nowrap;
}
.npg-wiz-prog-line{
  flex:1;height:1px;
  background:var(--npg-line);
  margin:0 6px;
  margin-bottom:18px;
  transition:.3s;
}

/* Active step */
.npg-wiz-prog-step.is-active .npg-wiz-prog-dot{
  border-color:var(--npg-green-700);
  background:var(--npg-green-700);
}
.npg-wiz-prog-step.is-active .npg-wiz-prog-num{ color:#fff; }
.npg-wiz-prog-step.is-active .npg-wiz-prog-label{ color:var(--npg-green-700); }

/* Done step */
.npg-wiz-prog-step.is-done .npg-wiz-prog-dot{
  border-color:var(--npg-green-700);
  background:var(--npg-green-700);
}
.npg-wiz-prog-step.is-done .npg-wiz-prog-num{ display:none; }
.npg-wiz-prog-step.is-done .npg-wiz-prog-check{ display:block; }
.npg-wiz-prog-step.is-done .npg-wiz-prog-label{ color:var(--npg-green-700); }
.npg-wiz-prog-step.is-done ~ .npg-wiz-prog-line{
  background:var(--npg-green-700);
}

/* Mobile progress — hide labels */
@media(max-width:600px){
  .npg-wiz-progress{ padding:16px 16px 12px; gap:0; }
  .npg-wiz-prog-label{ display:none; }
  .npg-wiz-prog-dot{ width:26px;height:26px; }
  .npg-wiz-prog-num{ font-size:11px; }
}

/* ── Step body ── */
.npg-wiz-step{ padding:32px 32px 28px; }
@media(max-width:600px){ .npg-wiz-step{ padding:20px 16px; } }

.npg-wiz-step-head{ margin-bottom:24px; }
.npg-wiz-step-label{
  font-size:11px;font-weight:700;
  color:var(--npg-gold-600);
  letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:6px;
}
.npg-wiz-step-head h3{
  font-size:22px;font-weight:700;
  color:var(--npg-green-900);
  margin:0 0 6px;
}
.npg-wiz-step-sub{
  font-size:14px;color:var(--npg-muted);margin:0;
}

/* ── Project type cards ── */
.npg-wiz-cards{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:12px;
  margin-bottom:20px;
}
.npg-wiz-card{
  border:1.5px solid var(--npg-line);
  border-radius:4px;
  overflow:hidden;
  cursor:pointer;
  transition:.2s;
  background:#fff;
  position:relative;
}
.npg-wiz-card:hover{
  border-color:var(--npg-green-500);
  box-shadow:0 4px 16px rgba(6,42,31,.08);
}
.npg-wiz-card.selected{
  border-color:var(--npg-green-700);
  box-shadow:0 0 0 3px rgba(11,61,46,.12);
}
.npg-wiz-card-img{
  aspect-ratio:4/3;overflow:hidden;
  background:var(--npg-green-050);
}
.npg-wiz-card-img img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .3s;
}
.npg-wiz-card:hover .npg-wiz-card-img img{ transform:scale(1.04); }
.npg-wiz-card-no-img{
  aspect-ratio:4/3;
  background:var(--npg-green-050);
  display:flex;align-items:center;justify-content:center;
  color:var(--npg-green-300);font-size:28px;
}
.npg-wiz-card-name{
  padding:10px 12px;
  font-size:13px;font-weight:600;
  color:var(--npg-ink);
}
.npg-wiz-card-check{
  position:absolute;top:8px;right:8px;
  width:22px;height:22px;border-radius:50%;
  background:var(--npg-green-700);
  display:none;align-items:center;justify-content:center;
}
.npg-wiz-card-check svg{ width:12px;color:#fff; }
.npg-wiz-card.selected .npg-wiz-card-check{ display:flex; }

/* ── Sub-type section ── */
.npg-wiz-sub{ margin-top:20px; }
.npg-wiz-sub-label{
  font-size:13px;font-weight:700;
  color:var(--npg-ink);margin-bottom:10px;
  padding-left:2px;
}

/* ── Pills (single + multi select) ── */
.npg-wiz-pills-row{
  display:flex;gap:8px;flex-wrap:wrap;
}
.npg-wiz-2col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
@media(max-width:480px){ .npg-wiz-2col{ grid-template-columns:1fr; } }

.npg-wiz-pill{
  padding:9px 18px;
  border:1.5px solid var(--npg-line);
  border-radius:2px;
  background:#fff;
  font-size:13px;font-weight:500;
  color:var(--npg-ink);
  cursor:pointer;
  transition:.2s;
  text-align:left;
}
.npg-wiz-pill:hover{
  border-color:var(--npg-green-500);
  color:var(--npg-green-700);
}
.npg-wiz-pill.selected{
  border-color:var(--npg-green-700);
  background:var(--npg-green-050);
  color:var(--npg-green-700);
  font-weight:600;
}

/* ── Rooms grid ── */
.npg-wiz-rooms-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
  gap:10px;
  margin-bottom:20px;
}
.npg-wiz-room-card{
  border:1.5px solid var(--npg-line);
  border-radius:4px;overflow:hidden;
  cursor:pointer;transition:.2s;background:#fff;
  position:relative;
}
.npg-wiz-room-card:hover{ border-color:var(--npg-green-500); }
.npg-wiz-room-card.selected{
  border-color:var(--npg-green-700);
  background:var(--npg-green-050);
}
.npg-wiz-room-card.selected .npg-wiz-card-check{ display:flex; }
.npg-wiz-room-img{
  aspect-ratio:3/2;overflow:hidden;background:var(--npg-green-050);
}
.npg-wiz-room-img img{ width:100%;height:100%;object-fit:cover;display:block; }
.npg-wiz-room-no-img{
  aspect-ratio:3/2;background:var(--npg-green-050);
  display:flex;align-items:center;justify-content:center;
  color:var(--npg-green-300);font-size:22px;
}
.npg-wiz-room-name{
  padding:8px 10px;font-size:12px;font-weight:600;
  color:var(--npg-ink);
}
/* Room subtype picker — shown below room card when selected */
.npg-wiz-room-subtype{
  padding:0 10px 8px;display:none;
}
.npg-wiz-room-card.selected .npg-wiz-room-subtype{ display:block; }
.npg-wiz-room-subtype select{
  width:100%;padding:5px 8px;
  border:1px solid var(--npg-line);
  border-radius:2px;font-size:12px;
  background:#fff;color:var(--npg-ink);
}

/* ── Area input ── */
.npg-wiz-area-row{
  background:var(--npg-green-050);
  border-radius:4px;padding:16px 18px;
  margin-bottom:24px;
}
.npg-wiz-area-label{
  font-size:13px;font-weight:700;
  color:var(--npg-ink);display:block;margin-bottom:10px;
}
.npg-wiz-area-input-wrap{
  display:flex;gap:10px;align-items:center;
}
.npg-wiz-area-input{
  width:140px;padding:10px 14px;
  border:1.5px solid var(--npg-line);
  border-radius:2px;font-size:16px;font-weight:600;
  color:var(--npg-ink);background:#fff;
}
.npg-wiz-area-input:focus{
  outline:none;border-color:var(--npg-green-700);
}
.npg-wiz-area-toggle{
  display:flex;border:1.5px solid var(--npg-line);
  border-radius:2px;overflow:hidden;
}
.npg-wiz-unit{
  padding:8px 14px;border:none;
  background:#fff;font-size:13px;font-weight:600;
  color:#aaa;cursor:pointer;transition:.2s;
}
.npg-wiz-unit.active{
  background:var(--npg-green-700);color:#fff;
}

/* ── Questions (step 3) ── */
.npg-wiz-qs{ display:flex;flex-direction:column;gap:24px; }
.npg-wiz-q{ display:flex;flex-direction:column;gap:8px; }
.npg-wiz-q-label{
  font-size:14px;font-weight:700;
  color:var(--npg-ink);
}

/* ── Upload zone (minimal) ── */
.npg-wiz-upload-zone{
  border:1.5px dashed var(--npg-line);
  border-radius:4px;background:#fafafa;
  overflow:hidden;
}
.npg-wiz-upload-inner{
  padding:18px 20px;
  display:flex;align-items:center;gap:12px;
  cursor:pointer;transition:.2s;
  color:var(--npg-muted);
}
.npg-wiz-upload-inner:hover{
  background:var(--npg-green-050);
  border-color:var(--npg-green-500);
  color:var(--npg-green-700);
}
.npg-wiz-upload-inner svg{ flex-shrink:0;opacity:.6; }
.npg-wiz-upload-inner span{ font-size:13px;font-weight:500; }
.npg-wiz-upload-inner small{ font-size:11px;color:#aaa;margin-left:auto; }
.npg-wiz-upload-previews{
  display:flex;gap:8px;flex-wrap:wrap;
  padding:0 12px 12px;
}
.npg-wiz-upload-previews:empty{ display:none; }
.npg-wiz-preview-thumb{
  width:52px;height:52px;border-radius:3px;
  object-fit:cover;border:1px solid var(--npg-line);
}
.npg-wiz-preview-file{
  width:52px;height:52px;border-radius:3px;
  background:var(--npg-green-050);border:1px solid var(--npg-line);
  display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:700;color:var(--npg-green-700);
  text-transform:uppercase;
}

/* ── Contact fields (step 5) ── */
.npg-wiz-contact-fields{
  display:flex;flex-direction:column;gap:16px;
  max-width:420px;
}
.npg-wiz-field{ display:flex;flex-direction:column;gap:5px; }
.npg-wiz-field label{
  font-size:13px;font-weight:700;color:var(--npg-ink);
}
.npg-wiz-field input{
  padding:11px 14px;
  border:1.5px solid var(--npg-line);
  border-radius:2px;font-size:15px;
  color:var(--npg-ink);background:#fff;
  transition:.2s;
}
.npg-wiz-field input:focus{
  outline:none;border-color:var(--npg-green-700);
}
.npg-wiz-field input.has-error{ border-color:#c0392b; }

/* ── Textarea ── */
.npg-wiz-textarea{
  width:100%;padding:11px 14px;
  border:1.5px solid var(--npg-line);
  border-radius:2px;font-size:14px;
  color:var(--npg-ink);background:#fff;
  font-family:inherit;resize:vertical;min-height:88px;
  transition:.2s;box-sizing:border-box;
}
.npg-wiz-textarea:focus{
  outline:none;border-color:var(--npg-green-700);
}

/* ── Review card ── */
.npg-wiz-review{
  background:var(--npg-green-050);
  border-radius:4px;padding:20px 24px;
  margin-bottom:20px;
}
.npg-wiz-review-row{
  display:flex;gap:12px;
  padding:10px 0;
  border-bottom:1px solid var(--npg-line);
  font-size:14px;
}
.npg-wiz-review-row:last-child{ border-bottom:none; }
.npg-wiz-review-label{
  width:140px;flex-shrink:0;
  color:var(--npg-muted);font-weight:500;
}
.npg-wiz-review-val{
  color:var(--npg-ink);font-weight:600;flex:1;
}

/* ── Nav row ── */
.npg-wiz-nav{
  display:flex;justify-content:space-between;
  align-items:center;padding-top:20px;
  border-top:1px solid var(--npg-line);
  margin-top:24px;
}
.npg-wiz-back-btn{
  background:none;border:none;
  font-size:13px;font-weight:600;
  color:var(--npg-muted);cursor:pointer;
  padding:0;transition:.2s;
}
.npg-wiz-back-btn:hover{ color:var(--npg-ink); }

/* ── Thank you ── */
.npg-wiz-thankyou{
  text-align:center;padding:48px 32px;
}
.npg-wiz-ty-icon{
  width:56px;height:56px;border-radius:50%;
  background:var(--npg-green-700);color:#fff;
  font-size:22px;display:flex;align-items:center;justify-content:center;
  margin:0 auto 16px;
}
.npg-wiz-thankyou h3{
  font-size:22px;font-weight:700;
  color:var(--npg-green-900);margin:0 0 8px;
}
.npg-wiz-thankyou p{
  font-size:15px;color:var(--npg-ink);margin:0 0 6px;
}
.npg-wiz-ty-ref{
  font-size:12px;font-weight:700;
  color:var(--npg-gold-600);
  letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:6px;
}
.npg-wiz-ty-sub{
  font-size:14px;color:var(--npg-muted) !important;
  margin-bottom:24px !important;
}
.npg-wiz-ty-actions{
  display:flex;gap:14px;justify-content:center;flex-wrap:wrap;
}
.npg-wiz-back-link{
  font-size:14px;color:var(--npg-muted);
  display:flex;align-items:center;
}

/* ── Helpers ── */
.npg-wiz-optional{ font-weight:400;color:#aaa;font-size:12px; }
.npg-wiz-req{ color:#c0392b; }
.npg-wiz-loading{ color:#aaa;font-size:13px;padding:12px 0; }
.npg-wiz-msg-error{
  background:#fdecea;border:1px solid #f5c6c2;
  border-radius:4px;padding:12px 16px;
  font-size:13px;color:#c0392b;margin-bottom:12px;
}
.npg-wiz-currency-label{
  font-weight:400;color:var(--npg-gold-600);font-size:13px;
}
.npg-narrow-900{ max-width:900px; }
/* ============================================================
   LIBRARY PAGE v2 — paste at bottom of style.css
   ============================================================ */

/* ── Tab nav ── */
.npg-lib2-tabs{
    display:flex;gap:0;
    border-bottom:2px solid #eee;
    margin-bottom:0;
}
.npg-lib2-tab{
    padding:12px 22px;
    font-size:13px;font-weight:600;
    color:#888;text-decoration:none;
    border-bottom:3px solid transparent;
    margin-bottom:-2px;
    display:flex;align-items:center;gap:8px;
    transition:.2s;white-space:nowrap;
}
.npg-lib2-tab:hover{ color:#333; }
.npg-lib2-tab.active{ font-weight:700; }
.npg-lib2-tab-count{
    font-size:11px;font-weight:700;
    background:#eee;color:#666;
    padding:2px 8px;border-radius:20px;
    transition:.2s;
}
.npg-lib2-tab-indicator{
    height:3px;margin-bottom:24px;
    transition:background .2s;
}

/* ── Project Types grid (Tab 1) ── */
.npg-lib2-pt-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:16px;
    margin-bottom:16px;
}
@media(max-width:1000px){ .npg-lib2-pt-grid{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:640px) { .npg-lib2-pt-grid{ grid-template-columns:repeat(2,1fr); } }

.npg-lib2-pt-card{
    border:1px solid #eee;border-radius:8px;
    overflow:hidden;background:#fff;
    box-shadow:0 1px 4px rgba(0,0,0,.06);
    transition:box-shadow .2s;
}
.npg-lib2-pt-card:hover{ box-shadow:0 4px 16px rgba(0,0,0,.1); }
.npg-lib2-pt-img-wrap{
    aspect-ratio:4/3;overflow:hidden;
    background:#f5f5f5;
}
.npg-lib2-pt-img-wrap img{
    width:100%;height:100%;object-fit:cover;display:block;
}
.npg-lib2-pt-name{
    font-size:13px;font-weight:700;
    color:var(--npg-ink);
    padding:10px 12px 6px;
}
.npg-lib2-pt-form{ padding:0 12px 12px; }
.npg-lib2-note{
    font-size:12px;color:#aaa;
    padding:8px 0;
}

/* ── Two-panel layout (Tab 2,3,4) ── */
.npg-lib2-layout{
    display:grid;
    grid-template-columns:260px 1fr;
    gap:20px;
    align-items:start;
}
@media(max-width:860px){
    .npg-lib2-layout{ grid-template-columns:1fr; }
}

/* ── Left panel ── */
.npg-lib2-left{
    background:#fff;border:1px solid #eee;
    border-radius:8px;overflow:hidden;
}
.npg-lib2-left-head{
    padding:14px 16px;
    font-size:12px;font-weight:700;
    color:#555;text-transform:uppercase;
    letter-spacing:.5px;
    border-left:3px solid #eee;
    background:#fafafa;
    border-bottom:1px solid #eee;
}
.npg-lib2-list{ padding:8px 0; }
.npg-lib2-list-item{
    display:flex;align-items:center;gap:10px;
    padding:9px 14px;
    text-decoration:none;
    border-left:3px solid transparent;
    transition:.15s;cursor:pointer;
}
.npg-lib2-list-item:hover{ background:#f9f9f9; }
.npg-lib2-list-item.active{ font-weight:600; }
.npg-lib2-list-img{
    width:36px;height:36px;flex-shrink:0;
    border-radius:4px;overflow:hidden;
}
.npg-lib2-list-img img{
    width:100%;height:100%;object-fit:cover;
}
.npg-lib2-list-no-img{
    width:36px;height:36px;
    background:#f0f0f0;border-radius:4px;
    border:1px dashed #ddd;
}
.npg-lib2-list-name{
    font-size:13px;color:var(--npg-ink);flex:1;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.npg-lib2-list-type{
    font-size:11px;color:#aaa;
}
.npg-lib2-add-section{
    padding:14px 14px;
    border-top:2px solid #eee;
    background:#fafafa;
}
.npg-lib2-add-label{
    font-size:12px;font-weight:700;
    margin-bottom:10px;
}
.npg-lib2-add-form{
    display:flex;flex-direction:column;gap:8px;
}
.npg-lib2-add-form .npg-dash-input,
.npg-lib2-add-form .npg-dash-select{
    width:100%;font-size:12px;
}
.npg-lib2-add-btn{
    padding:8px 14px;
    color:#fff;border:none;border-radius:4px;
    font-size:12px;font-weight:600;
    cursor:pointer;transition:.15s;
    text-align:center;
}
.npg-lib2-add-btn:hover{ opacity:.88; }

/* ── Right panel ── */
.npg-lib2-right{
    background:#fff;border:1px solid #eee;
    border-radius:8px;min-height:320px;
}
.npg-lib2-empty-state{
    display:flex;flex-direction:column;
    align-items:center;justify-content:center;
    min-height:280px;text-align:center;
    color:#bbb;padding:32px;
}
.npg-lib2-empty-icon{ font-size:36px;margin-bottom:12px; }
.npg-lib2-empty-state p{ font-size:13px;line-height:1.6; }
.npg-lib2-empty-sm{ font-size:12px;color:#aaa;margin:0 0 12px; }

.npg-lib2-right-head{
    display:flex;align-items:center;
    justify-content:space-between;
    padding:18px 24px;
    border-bottom:1px solid #eee;
}
.npg-lib2-right-head h2{
    font-size:18px;font-weight:700;
    color:var(--npg-ink);margin:0;
}

/* ── Sections inside right panel ── */
.npg-lib2-section{
    padding:20px 24px;
    border-bottom:1px solid #f2f2f2;
    border-left:3px solid #eee;
    margin-left:0;
}
.npg-lib2-section:last-child{ border-bottom:none; }
.npg-lib2-section-title{
    font-size:12px;font-weight:700;
    text-transform:uppercase;letter-spacing:.5px;
    margin-bottom:12px;
    display:flex;align-items:center;gap:8px;
}
.npg-lib2-count-badge{
    background:#f0f0f0;color:#666;
    font-size:11px;font-weight:700;
    padding:2px 8px;border-radius:20px;
    text-transform:none;letter-spacing:0;
}
.npg-lib2-hint{
    font-size:12px;color:#aaa;
    margin:-4px 0 12px;line-height:1.5;
}

/* ── Image upload row ── */
.npg-lib2-img-row{
    display:flex;align-items:center;gap:16px;
    flex-wrap:wrap;
}
.npg-lib2-thumb{
    width:90px;height:70px;
    object-fit:cover;border-radius:4px;
    border:1px solid #eee;display:block;
}
.npg-lib2-no-img{
    width:90px;height:70px;
    background:#f5f5f5;border-radius:4px;
    border:1px dashed #ddd;
    display:flex;align-items:center;justify-content:center;
    font-size:10px;color:#bbb;
}
.npg-lib2-upload-btn{
    display:inline-block;
    padding:7px 14px;
    background:#f5f5f5;color:#555;
    border:1px solid #ddd;border-radius:4px;
    font-size:12px;font-weight:600;
    cursor:pointer;transition:.15s;
}
.npg-lib2-upload-btn:hover{ background:#eee; }
.npg-lib2-upload-btn-sm{
    display:inline-block;
    padding:4px 10px;
    background:#f5f5f5;color:#555;
    border:1px solid #ddd;border-radius:3px;
    font-size:11px;font-weight:600;
    cursor:pointer;transition:.15s;
}
.npg-lib2-upload-btn-sm:hover{ background:#eee; }

/* ── Rates form ── */
.npg-lib2-rates-form{ display:flex;flex-direction:column;gap:16px; }
.npg-lib2-rate-group{
    background:#fafafa;border-radius:6px;
    padding:14px;border:1px solid #eee;
}
.npg-lib2-rate-group-label{
    font-size:12px;font-weight:700;
    color:#555;margin-bottom:10px;
    display:flex;align-items:center;gap:6px;
}
.npg-lib2-rate-dot{
    width:10px;height:10px;
    border-radius:50%;display:inline-block;
    flex-shrink:0;
}
.npg-lib2-rate-row{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}
@media(max-width:640px){ .npg-lib2-rate-row{ grid-template-columns:1fr; } }
.npg-lib2-rate-field{
    display:flex;flex-direction:column;gap:4px;
    font-size:12px;font-weight:600;color:#666;
}
.npg-lib2-rate-field .npg-dash-input{
    width:100%;font-size:13px;
}
.npg-lib2-save-btn{
    padding:9px 20px;
    color:#fff;border:none;border-radius:4px;
    font-size:13px;font-weight:600;
    cursor:pointer;align-self:flex-start;
    transition:.15s;
}
.npg-lib2-save-btn:hover{ opacity:.88; }

/* ── Assigned rooms grid ── */
.npg-lib2-assigned-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
    gap:10px;margin-bottom:14px;
}
.npg-lib2-assigned-card{
    border:1px solid #eee;border-radius:6px;
    overflow:hidden;background:#fafafa;
    text-align:center;
}
.npg-lib2-assigned-img{
    aspect-ratio:4/3;overflow:hidden;
    background:#f0f0f0;
}
.npg-lib2-assigned-img img{
    width:100%;height:100%;object-fit:cover;
}
.npg-lib2-assigned-img .npg-lib2-list-no-img{
    width:100%;height:100%;border-radius:0;border:none;
}
.npg-lib2-assigned-name{
    font-size:12px;font-weight:600;
    padding:6px 8px 4px;color:var(--npg-ink);
}
.npg-lib2-remove-btn{
    display:block;width:100%;
    padding:5px;
    background:none;border:none;
    border-top:1px solid #eee;
    font-size:11px;color:#c0392b;
    cursor:pointer;transition:.15s;
}
.npg-lib2-remove-btn:hover{ background:#fdecea; }

/* ── Assign form ── */
.npg-lib2-assign-form{
    display:flex;gap:8px;align-items:center;flex-wrap:wrap;
    margin-top:4px;
}
.npg-lib2-assign-form .npg-dash-select{ flex:1;min-width:180px; }

/* ── Subtypes grid ── */
.npg-lib2-subtypes-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
    gap:10px;margin-bottom:14px;
}
.npg-lib2-subtype-card{
    border:1px solid #eee;border-radius:6px;
    overflow:hidden;background:#fafafa;
    text-align:center;
}
.npg-lib2-subtype-img{
    aspect-ratio:4/3;overflow:hidden;background:#f0f0f0;
}
.npg-lib2-subtype-img img{
    width:100%;height:100%;object-fit:cover;
}
.npg-lib2-subtype-img .npg-lib2-no-img{
    width:100%;height:100%;border-radius:0;border:none;
}
.npg-lib2-subtype-name{
    font-size:12px;font-weight:600;
    padding:6px 8px 4px;color:var(--npg-ink);
}
.npg-lib2-subtype-actions{
    display:flex;border-top:1px solid #eee;
}
.npg-lib2-subtype-actions form{ flex:1; }
.npg-lib2-subtype-actions form:first-child{
    border-right:1px solid #eee;
}

/* ── Danger button ── */
.npg-lib2-danger-btn{
    padding:6px 14px;
    background:#fdecea;color:#c0392b;
    border:1px solid #f5c6c2;border-radius:4px;
    font-size:12px;font-weight:600;cursor:pointer;
    transition:.15s;
}
.npg-lib2-danger-btn:hover{ background:#c0392b;color:#fff; }
/* ============================================================
   WIZARD — paste at bottom of style.css
   Premium, minimal, dark green + gold
   ============================================================ */

.npg-wiz-section{ background:var(--npg-ivory); }

.npg-wiz-eyebrow{
  font-size:var(--fs-eyebrow);font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--npg-gold-600);margin-bottom:10px;
}
.npg-wiz-intro{
  font-size:var(--fs-small);color:var(--npg-muted);
  max-width:480px;margin:0 auto;
}
.npg-mb-3{ margin-bottom:var(--sp-3); }

/* ── Wizard shell ── */
.npg-wiz{
  background:#fff;
  border-radius:4px;
  box-shadow:0 2px 24px rgba(6,42,31,.10);
  overflow:hidden;
}

/* ── Progress bar ── */
.npg-wiz-progress{
  display:flex;align-items:center;
  padding:24px 32px 20px;
  background:#fff;
  border-bottom:1px solid var(--npg-line);
  gap:0;
}
.npg-wiz-prog-step{
  display:flex;flex-direction:column;
  align-items:center;gap:6px;
  flex-shrink:0;
}
.npg-wiz-prog-dot{
  width:32px;height:32px;
  border-radius:50%;
  border:2px solid var(--npg-line);
  background:#fff;
  display:flex;align-items:center;justify-content:center;
  transition:.3s;position:relative;
}
.npg-wiz-prog-num{
  font-size:13px;font-weight:700;
  color:#bbb;transition:.3s;
}
.npg-wiz-prog-check{
  display:none;width:14px;height:14px;
  color:#fff;
}
.npg-wiz-prog-label{
  font-size:11px;font-weight:600;
  color:#ccc;letter-spacing:.3px;
  text-transform:uppercase;
  transition:.3s;white-space:nowrap;
}
.npg-wiz-prog-line{
  flex:1;height:1px;
  background:var(--npg-line);
  margin:0 6px;
  margin-bottom:18px;
  transition:.3s;
}

/* Active step */
.npg-wiz-prog-step.is-active .npg-wiz-prog-dot{
  border-color:var(--npg-green-700);
  background:var(--npg-green-700);
}
.npg-wiz-prog-step.is-active .npg-wiz-prog-num{ color:#fff; }
.npg-wiz-prog-step.is-active .npg-wiz-prog-label{ color:var(--npg-green-700); }

/* Done step */
.npg-wiz-prog-step.is-done .npg-wiz-prog-dot{
  border-color:var(--npg-green-700);
  background:var(--npg-green-700);
}
.npg-wiz-prog-step.is-done .npg-wiz-prog-num{ display:none; }
.npg-wiz-prog-step.is-done .npg-wiz-prog-check{ display:block; }
.npg-wiz-prog-step.is-done .npg-wiz-prog-label{ color:var(--npg-green-700); }
.npg-wiz-prog-step.is-done ~ .npg-wiz-prog-line{
  background:var(--npg-green-700);
}

/* Mobile progress — hide labels */
@media(max-width:600px){
  .npg-wiz-progress{ padding:16px 16px 12px; gap:0; }
  .npg-wiz-prog-label{ display:none; }
  .npg-wiz-prog-dot{ width:26px;height:26px; }
  .npg-wiz-prog-num{ font-size:11px; }
}

/* ── Step body ── */
.npg-wiz-step{ padding:32px 32px 28px; }
@media(max-width:600px){ .npg-wiz-step{ padding:20px 16px; } }

.npg-wiz-step-head{ margin-bottom:24px; }
.npg-wiz-step-label{
  font-size:11px;font-weight:700;
  color:var(--npg-gold-600);
  letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:6px;
}
.npg-wiz-step-head h3{
  font-size:22px;font-weight:700;
  color:var(--npg-green-900);
  margin:0 0 6px;
}
.npg-wiz-step-sub{
  font-size:14px;color:var(--npg-muted);margin:0;
}

/* ── Project type cards ── */
.npg-wiz-cards{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:12px;
  margin-bottom:20px;
}
.npg-wiz-card{
  border:1.5px solid var(--npg-line);
  border-radius:4px;
  overflow:hidden;
  cursor:pointer;
  transition:.2s;
  background:#fff;
  position:relative;
}
.npg-wiz-card:hover{
  border-color:var(--npg-green-500);
  box-shadow:0 4px 16px rgba(6,42,31,.08);
}
.npg-wiz-card.selected{
  border-color:var(--npg-green-700);
  box-shadow:0 0 0 3px rgba(11,61,46,.12);
}
.npg-wiz-card-img{
  aspect-ratio:4/3;overflow:hidden;
  background:var(--npg-green-050);
}
.npg-wiz-card-img img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .3s;
}
.npg-wiz-card:hover .npg-wiz-card-img img{ transform:scale(1.04); }
.npg-wiz-card-no-img{
  aspect-ratio:4/3;
  background:var(--npg-green-050);
  display:flex;align-items:center;justify-content:center;
  color:var(--npg-green-300);font-size:28px;
}
.npg-wiz-card-name{
  padding:10px 12px;
  font-size:13px;font-weight:600;
  color:var(--npg-ink);
}
.npg-wiz-card-check{
  position:absolute;top:8px;right:8px;
  width:22px;height:22px;border-radius:50%;
  background:var(--npg-green-700);
  display:none;align-items:center;justify-content:center;
}
.npg-wiz-card-check svg{ width:12px;color:#fff; }
.npg-wiz-card.selected .npg-wiz-card-check{ display:flex; }

/* ── Sub-type section ── */
.npg-wiz-sub{ margin-top:20px; }
.npg-wiz-sub-label{
  font-size:13px;font-weight:700;
  color:var(--npg-ink);margin-bottom:10px;
  padding-left:2px;
}

/* ── Pills (single + multi select) ── */
.npg-wiz-pills-row{
  display:flex;gap:8px;flex-wrap:wrap;
}
.npg-wiz-2col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
@media(max-width:480px){ .npg-wiz-2col{ grid-template-columns:1fr; } }

.npg-wiz-pill{
  padding:9px 18px;
  border:1.5px solid var(--npg-line);
  border-radius:2px;
  background:#fff;
  font-size:13px;font-weight:500;
  color:var(--npg-ink);
  cursor:pointer;
  transition:.2s;
  text-align:left;
}
.npg-wiz-pill:hover{
  border-color:var(--npg-green-500);
  color:var(--npg-green-700);
}
.npg-wiz-pill.selected{
  border-color:var(--npg-green-700);
  background:var(--npg-green-050);
  color:var(--npg-green-700);
  font-weight:600;
}

/* ── Rooms grid ── */
.npg-wiz-rooms-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
  gap:10px;
  margin-bottom:20px;
}
.npg-wiz-room-card{
  border:1.5px solid var(--npg-line);
  border-radius:4px;overflow:hidden;
  cursor:pointer;transition:.2s;background:#fff;
  position:relative;
}
.npg-wiz-room-card:hover{ border-color:var(--npg-green-500); }
.npg-wiz-room-card.selected{
  border-color:var(--npg-green-700);
  background:var(--npg-green-050);
}
.npg-wiz-room-card.selected .npg-wiz-card-check{ display:flex; }
.npg-wiz-room-img{
  aspect-ratio:3/2;overflow:hidden;background:var(--npg-green-050);
}
.npg-wiz-room-img img{ width:100%;height:100%;object-fit:cover;display:block; }
.npg-wiz-room-no-img{
  aspect-ratio:3/2;background:var(--npg-green-050);
  display:flex;align-items:center;justify-content:center;
  color:var(--npg-green-300);font-size:22px;
}
.npg-wiz-room-name{
  padding:8px 10px;font-size:12px;font-weight:600;
  color:var(--npg-ink);
}
/* Room subtype picker — shown below room card when selected */
.npg-wiz-room-subtype{
  padding:0 10px 8px;display:none;
}
.npg-wiz-room-card.selected .npg-wiz-room-subtype{ display:block; }
.npg-wiz-room-subtype select{
  width:100%;padding:5px 8px;
  border:1px solid var(--npg-line);
  border-radius:2px;font-size:12px;
  background:#fff;color:var(--npg-ink);
}

/* ── Area input ── */
.npg-wiz-area-row{
  background:var(--npg-green-050);
  border-radius:4px;padding:16px 18px;
  margin-bottom:24px;
}
.npg-wiz-area-label{
  font-size:13px;font-weight:700;
  color:var(--npg-ink);display:block;margin-bottom:10px;
}
.npg-wiz-area-input-wrap{
  display:flex;gap:10px;align-items:center;
}
.npg-wiz-area-input{
  width:140px;padding:10px 14px;
  border:1.5px solid var(--npg-line);
  border-radius:2px;font-size:16px;font-weight:600;
  color:var(--npg-ink);background:#fff;
}
.npg-wiz-area-input:focus{
  outline:none;border-color:var(--npg-green-700);
}
.npg-wiz-area-toggle{
  display:flex;border:1.5px solid var(--npg-line);
  border-radius:2px;overflow:hidden;
}
.npg-wiz-unit{
  padding:8px 14px;border:none;
  background:#fff;font-size:13px;font-weight:600;
  color:#aaa;cursor:pointer;transition:.2s;
}
.npg-wiz-unit.active{
  background:var(--npg-green-700);color:#fff;
}

/* ── Questions (step 3) ── */
.npg-wiz-qs{ display:flex;flex-direction:column;gap:24px; }
.npg-wiz-q{ display:flex;flex-direction:column;gap:8px; }
.npg-wiz-q-label{
  font-size:14px;font-weight:700;
  color:var(--npg-ink);
}

/* ── Upload zone (minimal) ── */
.npg-wiz-upload-zone{
  border:1.5px dashed var(--npg-line);
  border-radius:4px;background:#fafafa;
  overflow:hidden;
}
.npg-wiz-upload-inner{
  padding:18px 20px;
  display:flex;align-items:center;gap:12px;
  cursor:pointer;transition:.2s;
  color:var(--npg-muted);
}
.npg-wiz-upload-inner:hover{
  background:var(--npg-green-050);
  border-color:var(--npg-green-500);
  color:var(--npg-green-700);
}
.npg-wiz-upload-inner svg{ flex-shrink:0;opacity:.6; }
.npg-wiz-upload-inner span{ font-size:13px;font-weight:500; }
.npg-wiz-upload-inner small{ font-size:11px;color:#aaa;margin-left:auto; }
.npg-wiz-upload-previews{
  display:flex;gap:8px;flex-wrap:wrap;
  padding:0 12px 12px;
}
.npg-wiz-upload-previews:empty{ display:none; }
.npg-wiz-preview-thumb{
  width:52px;height:52px;border-radius:3px;
  object-fit:cover;border:1px solid var(--npg-line);
}
.npg-wiz-preview-file{
  width:52px;height:52px;border-radius:3px;
  background:var(--npg-green-050);border:1px solid var(--npg-line);
  display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:700;color:var(--npg-green-700);
  text-transform:uppercase;
}

/* ── Contact fields (step 5) ── */
.npg-wiz-contact-fields{
  display:flex;flex-direction:column;gap:16px;
  max-width:420px;
}
.npg-wiz-field{ display:flex;flex-direction:column;gap:5px; }
.npg-wiz-field label{
  font-size:13px;font-weight:700;color:var(--npg-ink);
}
.npg-wiz-field input{
  padding:11px 14px;
  border:1.5px solid var(--npg-line);
  border-radius:2px;font-size:15px;
  color:var(--npg-ink);background:#fff;
  transition:.2s;
}
.npg-wiz-field input:focus{
  outline:none;border-color:var(--npg-green-700);
}
.npg-wiz-field input.has-error{ border-color:#c0392b; }

/* ── Textarea ── */
.npg-wiz-textarea{
  width:100%;padding:11px 14px;
  border:1.5px solid var(--npg-line);
  border-radius:2px;font-size:14px;
  color:var(--npg-ink);background:#fff;
  font-family:inherit;resize:vertical;min-height:88px;
  transition:.2s;box-sizing:border-box;
}
.npg-wiz-textarea:focus{
  outline:none;border-color:var(--npg-green-700);
}

/* ── Review card ── */
.npg-wiz-review{
  background:var(--npg-green-050);
  border-radius:4px;padding:20px 24px;
  margin-bottom:20px;
}
.npg-wiz-review-row{
  display:flex;gap:12px;
  padding:10px 0;
  border-bottom:1px solid var(--npg-line);
  font-size:14px;
}
.npg-wiz-review-row:last-child{ border-bottom:none; }
.npg-wiz-review-label{
  width:140px;flex-shrink:0;
  color:var(--npg-muted);font-weight:500;
}
.npg-wiz-review-val{
  color:var(--npg-ink);font-weight:600;flex:1;
}

/* ── Nav row ── */
.npg-wiz-nav{
  display:flex;justify-content:space-between;
  align-items:center;padding-top:20px;
  border-top:1px solid var(--npg-line);
  margin-top:24px;
}
.npg-wiz-back-btn{
  background:none;border:none;
  font-size:13px;font-weight:600;
  color:var(--npg-muted);cursor:pointer;
  padding:0;transition:.2s;
}
.npg-wiz-back-btn:hover{ color:var(--npg-ink); }

/* ── Thank you ── */
.npg-wiz-thankyou{
  text-align:center;padding:48px 32px;
}
.npg-wiz-ty-icon{
  width:56px;height:56px;border-radius:50%;
  background:var(--npg-green-700);color:#fff;
  font-size:22px;display:flex;align-items:center;justify-content:center;
  margin:0 auto 16px;
}
.npg-wiz-thankyou h3{
  font-size:22px;font-weight:700;
  color:var(--npg-green-900);margin:0 0 8px;
}
.npg-wiz-thankyou p{
  font-size:15px;color:var(--npg-ink);margin:0 0 6px;
}
.npg-wiz-ty-ref{
  font-size:12px;font-weight:700;
  color:var(--npg-gold-600);
  letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:6px;
}
.npg-wiz-ty-sub{
  font-size:14px;color:var(--npg-muted) !important;
  margin-bottom:24px !important;
}
.npg-wiz-ty-actions{
  display:flex;gap:14px;justify-content:center;flex-wrap:wrap;
}
.npg-wiz-back-link{
  font-size:14px;color:var(--npg-muted);
  display:flex;align-items:center;
}

/* ── Helpers ── */
.npg-wiz-optional{ font-weight:400;color:#aaa;font-size:12px; }
.npg-wiz-req{ color:#c0392b; }
.npg-wiz-loading{ color:#aaa;font-size:13px;padding:12px 0; }
.npg-wiz-msg-error{
  background:#fdecea;border:1px solid #f5c6c2;
  border-radius:4px;padding:12px 16px;
  font-size:13px;color:#c0392b;margin-bottom:12px;
}
.npg-wiz-currency-label{
  font-weight:400;color:var(--npg-gold-600);font-size:13px;
}
.npg-narrow-900{ max-width:900px; }

/* Error message */
.npg-wiz-err{
  color:#c0392b;font-size:13px;font-weight:500;
  background:#fdecea;border:1px solid #f5c6c2;
  border-radius:3px;padding:10px 14px;
  margin-top:12px;
}
.npg-wiz-no-rooms{
  font-size:13px;color:#aaa;padding:12px 0;
}

/* ── Lead detail — rooms display ── */
.npg-lead-rooms-section{
	margin-bottom:4px;
}
.npg-lead-rooms-list{
	display:flex;flex-wrap:wrap;gap:8px;
	margin-top:8px;
}
.npg-lead-room-tag{
	background:var(--npg-green-050);
	border:1px solid var(--npg-green-200,#c8ddd0);
	border-radius:4px;
	padding:6px 12px;
	font-size:13px;
	color:var(--npg-green-700);
}
.npg-lead-room-tag strong{
	font-weight:700;
	color:var(--npg-green-900);
}
.npg-lead-room-sub{
	color:var(--npg-green-700);
	font-weight:500;
}
.npg-lead-room-area{
	color:#888;
	font-size:12px;
}

/* ============================================================
   HOME PAGE — Updated styles (Blue CTA + Why Grid + Estimate)
   ============================================================ */

/* ── Blue button ── */
.npg-btn-blue {
	background: #1D4ED8;
	color: #fff;
	border: none;
}
.npg-btn-blue:hover {
	background: #1E40AF;
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 4px 14px rgba(29,78,216,.30);
}
.npg-btn-full {
	display: block;
	text-align: center;
	width: 100%;
}

/* ── Stats compact — 30% shorter ── */
.npg-stats-compact .npg-stat-item {
	padding: 14px 16px !important;
}
.npg-stats-compact .npg-stat-num {
	font-size: 20px !important;
}
.npg-stats-compact .npg-stat-label {
	font-size: 10px !important;
}

/* ── Blue section (Why Clients Stay) ── */
.npg-section-blue {
	background: #1D4ED8;
}
.npg-section-blue h2,
.npg-section-blue h3,
.npg-section-blue .npg-eyebrow,
.npg-section-blue .npg-section-head-lede {
	color: #fff;
}
.npg-section-blue h2 em {
	color: rgba(255,255,255,.7);
}

/* ── Why grid ── */
.npg-why-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background: rgba(255,255,255,.15);
	border: 1px solid rgba(255,255,255,.15);
	border-radius: 4px;
	overflow: hidden;
}
@media(max-width: 860px) {
	.npg-why-grid { grid-template-columns: repeat(2,1fr); }
}
@media(max-width: 540px) {
	.npg-why-grid { grid-template-columns: 1fr; }
}

.npg-why-card {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 20px 22px;
	background: rgba(255,255,255,.08);
	transition: background .2s;
}
.npg-why-card:hover {
	background: rgba(255,255,255,.15);
}
.npg-why-tick {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: rgba(255,255,255,.2);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-top: 2px;
}
.npg-why-body {}
.npg-why-title {
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	margin-bottom: 4px;
}
.npg-why-desc {
	font-size: 12px;
	color: rgba(255,255,255,.65);
	line-height: 1.5;
}

/* ── Estimate CTA section ── */
.npg-estimate-cta-grid {
	display: grid;
	grid-template-columns: 1fr 360px;
	gap: 64px;
	align-items: center;
}
@media(max-width: 860px) {
	.npg-estimate-cta-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}
}

.npg-estimate-steps {
	display: flex;
	flex-direction: column;
	gap: 18px;
	margin-top: 28px;
}
.npg-estimate-step {
	display: flex;
	align-items: flex-start;
	gap: 14px;
}
.npg-estimate-step-no {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--npg-gold-500);
	color: var(--npg-green-900);
	font-size: 13px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin-top: 2px;
}
.npg-estimate-step strong {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: var(--npg-ink);
	margin-bottom: 2px;
}
.npg-estimate-step span {
	font-size: 13px;
	color: var(--npg-muted, #888);
}

.npg-estimate-cta-box {
	background: #111;
	border-radius: 4px;
	padding: 40px 36px;
	text-align: center;
}
.npg-estimate-cta-box h3 {
	color: #fff;
	font-size: 20px;
	margin-bottom: 8px;
}
.npg-estimate-cta-box p {
	color: rgba(255,255,255,.5);
	font-size: 13px;
	margin-bottom: 24px;
}
.npg-estimate-timer {
	margin-top: 14px;
	font-size: 12px;
	color: rgba(255,255,255,.35);
}

/* Fix estimate section heading em color */
.npg-estimate-cta-left h2 em,
.npg-estimate-cta-left .npg-h-sec em {
	color: var(--npg-green-700);
}

/* ── What We Do — larger heading + minimal cards ── */
#what-we-design h2 {
	font-size: clamp(32px, 4vw, 52px);
}

/* Card body left aligned */
.npg-card-body-left {
	text-align: left !important;
}

/* Minimal card — no copy, compact padding */
.npg-card-minimal .npg-card-body {
	padding: 16px 18px 20px;
}
.npg-card-minimal .npg-card-tag {
	margin-bottom: 6px;
}
.npg-card-minimal .npg-h-card {
	font-size: 15px;
	font-weight: 700;
	margin-bottom: 0;
}

/* How It Works — using default section styles */

/* npg-how-divider removed */

/* ── CTA button text white ── */
.npg-btn-white-text {
	color: #fff !important;
}

/* ── Takes less than 3 minutes — white ── */
.npg-estimate-timer-white {
	color: rgba(255,255,255,.5) !important;
}

/* ── Before/After lede — black ── */
#before-after .npg-lede {
	color: #111111 !important;
}

/* ── Why Clients Stay table — grey → white ── */
.npg-lt-no {
	color: rgba(255,255,255,.5) !important;
}
.npg-lt-feature {
	color: rgba(255,255,255,.85) !important;
}

/* ── Get Estimate section steps text — white/dark ── */
.npg-estimate-step strong {
	color: #111111;
}
.npg-estimate-step span {
	color: #666;
}

#how-we-work { background: #ffffff; }



/* ── What We Do cards — shorter image ── */
#what-we-design .npg-card-flush .npg-media {
  aspect-ratio: unset !important;
  height: 180px !important;
  max-height: 180px !important;
}
#what-we-design .npg-card-flush .npg-media img {
  width: 100% !important;
  height: 180px !important;
  object-fit: cover !important;
  display: block !important;
}

/* ============================================================
   ABOUT PAGE
   ============================================================ */

/* Hero */
.npg-about-hero-left { display:flex; flex-direction:column; justify-content:center; gap:20px; }
.npg-about-stats { display:flex; gap:40px; margin-top:8px; }
.npg-about-stat { display:flex; flex-direction:column; gap:4px; }
.npg-about-stat strong { font-size:32px; font-weight:700; color:var(--npg-green-900); line-height:1; }
.npg-about-stat span { font-size:12px; font-weight:500; color:var(--npg-muted); text-transform:uppercase; letter-spacing:.08em; }

/* Story grid */
.npg-about-story-grid { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start; }
@media(max-width:860px){ .npg-about-story-grid{ grid-template-columns:1fr; gap:24px; } }

/* Mission & Vision */
.npg-about-mv-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
@media(max-width:700px){ .npg-about-mv-grid{ grid-template-columns:1fr; } }
.npg-about-mv-card {
	padding:40px 36px;
	border:1px solid var(--npg-line);
	border-radius:4px;
	background:#fff;
}
.npg-about-mv-card--alt {
	background:var(--npg-green-900);
}
.npg-about-mv-card--alt .npg-h-card,
.npg-about-mv-card--alt .npg-copy {
	color:#fff;
}
.npg-about-mv-card--alt .npg-copy { color:rgba(255,255,255,.75); }
.npg-about-mv-icon { font-size:24px; color:var(--npg-gold-500); margin-bottom:16px; }

/* Values */
.npg-about-values-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
@media(max-width:700px){ .npg-about-values-grid{ grid-template-columns:1fr; } }
.npg-about-value-card {
	padding:36px;
	border:1px solid var(--npg-line);
	border-radius:4px;
	background:#fff;
	border-top:3px solid var(--npg-gold-500);
}
.npg-about-value-icon { font-size:20px; color:var(--npg-gold-500); margin-bottom:14px; }

/* Testimonials */
.npg-about-testimonials-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
@media(max-width:860px){ .npg-about-testimonials-grid{ grid-template-columns:1fr; } }
.npg-about-testimonial { border-top:2px solid var(--npg-gold-500); padding-top:20px; }
.npg-about-quote-mark { font-size:48px; line-height:1; color:var(--npg-gold-500); font-family:Georgia,serif; display:block; margin-bottom:10px; }
.npg-about-quote-text { font-size:14px; color:var(--npg-grey); line-height:1.75; font-style:italic; }
.npg-about-quote-author { margin-top:18px; }
.npg-about-quote-author strong { display:block; font-size:13px; font-weight:700; color:var(--npg-ink); }
.npg-about-quote-author span { font-size:12px; color:var(--npg-muted); }

/* Locations */
.npg-about-locations-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid var(--npg-line); border-radius:4px; overflow:hidden; }
@media(max-width:700px){ .npg-about-locations-grid{ grid-template-columns:1fr; } }
.npg-about-location { padding:36px 32px; border-right:1px solid var(--npg-line); background:#fff; }
.npg-about-location:last-child { border-right:none; }
.npg-about-location-region { font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--npg-gold-600); margin-bottom:8px; }
.npg-about-location-city { font-size:22px; font-weight:700; color:var(--npg-ink); margin-bottom:6px; }
.npg-about-location-addr { font-size:13px; color:var(--npg-muted); line-height:1.6; }

/* ============================================================
   SERVICES PAGE
   ============================================================ */

/* Hero */
.npg-svc-hero {
	position: relative;
	min-height: 520px;
	display: flex;
	align-items: center;
	background: var(--npg-green-900);
	overflow: hidden;
}
.npg-svc-hero-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,.72);
	z-index: 1;
}
.npg-svc-hero-inner {
	position: relative;
	z-index: 2;
	text-align: center;
	padding: 80px 0 60px;
}
.npg-svc-hero-inner .npg-eyebrow { color: var(--npg-gold-300); }
.npg-svc-hero-inner .npg-h-page { color: #fff; margin-bottom: 8px; }
.npg-svc-hero-inner .npg-h-page em { color: var(--npg-gold-300); font-style: normal; }
.npg-svc-hero-sub { color: rgba(255,255,255,.6); font-size: 15px; margin-bottom: 48px; }

/* Hero cards */
.npg-svc-hero-cards {
	display: flex;
	gap: 16px;
	justify-content: center;
	flex-wrap: wrap;
}
.npg-svc-hero-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 20px 24px;
	border: 1px solid rgba(255,255,255,.15);
	border-radius: 4px;
	background: rgba(255,255,255,.06);
	text-decoration: none;
	transition: .2s;
	min-width: 140px;
}
.npg-svc-hero-card:hover {
	background: rgba(255,255,255,.12);
	border-color: var(--npg-gold-500);
}
.npg-svc-hero-num {
	font-size: 11px;
	font-weight: 700;
	color: var(--npg-gold-300);
	letter-spacing: .1em;
}
.npg-svc-hero-name {
	font-size: 13px;
	font-weight: 600;
	color: #fff;
	text-align: center;
}

/* Service rows */
.npg-svc-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	border-bottom: 1px solid var(--npg-line);
	padding: 48px 0;
}
.npg-svc-row:first-child { padding-top: 0; }
.npg-svc-row:last-child { border-bottom: none; }
.npg-svc-row--flip { direction: rtl; }
.npg-svc-row--flip > * { direction: ltr; }
@media(max-width:860px) {
	.npg-svc-row { grid-template-columns: 1fr; direction: ltr; }
	.npg-svc-row--flip { direction: ltr; }
}

.npg-svc-img {
	padding-right: 48px;
	display: flex;
	align-items: center;
}
.npg-svc-row--flip .npg-svc-img {
	padding-right: 0;
	padding-left: 48px;
}
@media(max-width:860px) {
	.npg-svc-img { padding: 0 0 24px 0 !important; }
}
.npg-svc-img .npg-media { border-radius: 4px; overflow: hidden; }
.npg-svc-img .npg-media-card { aspect-ratio: 4/3; }

.npg-svc-body { display: flex; flex-direction: column; justify-content: center; gap: 12px; }
.npg-svc-num {
	font-size: 48px;
	font-weight: 800;
	color: var(--npg-line);
	line-height: 1;
	letter-spacing: -.02em;
}
.npg-svc-body .npg-h-sec { font-size: 24px; margin: 0; }

/* Trust points */
.npg-svc-points {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 16px;
	margin-top: 4px;
}
.npg-svc-point {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 13px;
	color: var(--npg-grey);
}
.npg-svc-tick {
	color: var(--npg-gold-600);
	font-weight: 700;
	flex-shrink: 0;
	margin-top: 1px;
}

/* ============================================================
   PORTFOLIO PAGE
   ============================================================ */

/* Hero */
.npg-port-hero {
	position: relative;
	min-height: 460px;
	display: flex;
	align-items: center;
	background: var(--npg-green-900);
	overflow: hidden;
}
.npg-port-hero--cat { min-height: 320px; }
.npg-port-hero-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,.72);
	z-index: 1;
}
.npg-port-hero-inner {
	position: relative;
	z-index: 2;
	text-align: center;
	padding: 80px 0 60px;
}
.npg-port-hero-inner .npg-eyebrow { color: var(--npg-gold-300); }
.npg-port-hero-inner .npg-h-page { color: #fff; }
.npg-port-hero-inner .npg-h-page em { color: var(--npg-gold-300); font-style: normal; }
.npg-port-hero-sub { color: rgba(255,255,255,.6); font-size: 15px; margin: 12px 0 0; }
.npg-port-count { font-size: 13px; color: rgba(255,255,255,.4); margin-top: 12px; }
.npg-port-back {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: rgba(255,255,255,.5);
	text-decoration: none;
	margin-bottom: 20px;
	transition: color .2s;
}
.npg-port-back:hover { color: #fff; }

/* Filter tabs */
.npg-port-filters {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 32px;
}
.npg-port-filter {
	padding: 8px 20px;
	border: 1.5px solid rgba(255,255,255,.2);
	border-radius: 2px;
	background: transparent;
	color: rgba(255,255,255,.7);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .06em;
	cursor: pointer;
	font-family: inherit;
	transition: .2s;
}
.npg-port-filter:hover {
	border-color: var(--npg-gold-500);
	color: var(--npg-gold-300);
}
.npg-port-filter.active {
	border-color: var(--npg-gold-500);
	background: var(--npg-gold-500);
	color: var(--npg-green-900);
}

/* Masonry grid */
.npg-port-masonry {
	columns: 3;
	column-gap: 12px;
}
@media(max-width:900px) { .npg-port-masonry { columns: 2; } }
@media(max-width:540px) { .npg-port-masonry { columns: 1; } }

.npg-port-item {
	break-inside: avoid;
	margin-bottom: 12px;
}

/* Thumb */
.npg-port-thumb {
	position: relative;
	overflow: hidden;
	border-radius: 2px;
	cursor: pointer;
	display: block;
}
.npg-port-thumb img {
	width: 100%;
	display: block;
	transition: transform .4s ease;
}
.npg-port-thumb:hover img { transform: scale(1.04); }

/* Overlay */
.npg-port-overlay {
	position: absolute;
	inset: 0;
	background: rgba(6,26,19,0);
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	padding: 16px;
	transition: background .3s;
}
.npg-port-thumb:hover .npg-port-overlay { background: rgba(6,26,19,.65); }
.npg-port-overlay-inner { opacity: 0; transition: opacity .3s; }
.npg-port-thumb:hover .npg-port-overlay-inner { opacity: 1; }
.npg-port-overlay-title {
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	margin-bottom: 2px;
}
.npg-port-overlay-loc {
	font-size: 11px;
	color: rgba(255,255,255,.7);
}
.npg-port-zoom {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--npg-gold-500);
	color: var(--npg-green-900);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 700;
	opacity: 0;
	transition: opacity .3s;
	flex-shrink: 0;
}
.npg-port-thumb:hover .npg-port-zoom { opacity: 1; }

/* Category section head */
.npg-port-cat-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}

/* Category strip (4 images) */
.npg-port-strip {
	display: grid;
	grid-template-columns: repeat(4,1fr);
	gap: 10px;
}
@media(max-width:700px) { .npg-port-strip { grid-template-columns: repeat(2,1fr); } }
.npg-port-strip .npg-port-thumb img { aspect-ratio: 4/3; object-fit: cover; }

/* Lightbox */
.npg-lightbox {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s;
}
.npg-lightbox.active {
	opacity: 1;
	pointer-events: all;
}
.npg-lightbox-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,.92);
	cursor: pointer;
}
.npg-lightbox-inner {
	position: relative;
	z-index: 2;
	max-width: 90vw;
	max-height: 90vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}
.npg-lightbox-img-wrap {
	max-width: 90vw;
	max-height: 80vh;
	overflow: hidden;
	border-radius: 2px;
}
.npg-lightbox-img-wrap img {
	max-width: 90vw;
	max-height: 80vh;
	object-fit: contain;
	display: block;
}
.npg-lightbox-caption { text-align: center; }
.npg-lb-title {
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	margin-bottom: 4px;
}
.npg-lb-meta { font-size: 12px; color: rgba(255,255,255,.5); }

.npg-lightbox-close,
.npg-lightbox-prev,
.npg-lightbox-next {
	position: fixed;
	background: rgba(255,255,255,.1);
	border: none;
	color: #fff;
	cursor: pointer;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .2s;
	z-index: 3;
	font-family: inherit;
}
.npg-lightbox-close { top: 20px; right: 20px; width: 40px; height: 40px; font-size: 18px; }
.npg-lightbox-prev  { left: 20px; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; font-size: 28px; }
.npg-lightbox-next  { right: 20px; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; font-size: 28px; }
.npg-lightbox-close:hover,
.npg-lightbox-prev:hover,
.npg-lightbox-next:hover { background: var(--npg-gold-500); color: var(--npg-green-900); }

/* ============================================================
   CONTACT PAGE
   ============================================================ */

/* Hero */
.npg-contact-hero {
	position: relative;
	min-height: 380px;
	display: flex;
	align-items: center;
	background: var(--npg-green-900);
	overflow: hidden;
}
.npg-contact-hero-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,.72);
	z-index: 1;
}
.npg-contact-hero-inner {
	position: relative;
	z-index: 2;
	padding: 80px 0;
}
.npg-contact-hero-inner .npg-eyebrow { color: var(--npg-gold-300); }
.npg-contact-hero-inner .npg-h-page { color: #fff; }
.npg-contact-hero-inner .npg-h-page em { color: var(--npg-gold-300); font-style: normal; }
.npg-contact-hero-sub { color: rgba(255,255,255,.6); font-size: 15px; margin-top: 10px; }

/* Contact methods */
.npg-contact-methods-grid {
	display: grid;
	grid-template-columns: repeat(3,1fr);
	gap: 1px;
	background: var(--npg-line);
	border: 1px solid var(--npg-line);
	border-radius: 4px;
	overflow: hidden;
}
@media(max-width:700px){ .npg-contact-methods-grid{ grid-template-columns:1fr; } }
.npg-contact-method {
	background: #fff;
	padding: 36px 32px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.npg-contact-method-icon {
	font-size: 24px;
	margin-bottom: 8px;
}
.npg-contact-method-label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--npg-gold-600);
}
.npg-contact-method-value {
	font-size: 16px;
	font-weight: 700;
	color: var(--npg-ink);
	text-decoration: none;
}
.npg-contact-method-value:hover { color: var(--npg-gold-600); }
.npg-contact-method-note {
	font-size: 12px;
	color: var(--npg-muted);
	margin: 0;
}

/* Form grid */
.npg-contact-form-grid {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: 64px;
	align-items: start;
}
@media(max-width:860px){ .npg-contact-form-grid{ grid-template-columns:1fr; gap:40px; } }

/* Left steps */
.npg-contact-steps { display:flex; flex-direction:column; gap:24px; margin-top:28px; }
.npg-contact-step { display:flex; gap:16px; align-items:flex-start; }
.npg-contact-step-no {
	width: 36px; height: 36px;
	border-radius: 50%;
	border: 1.5px solid var(--npg-gold-500);
	color: var(--npg-gold-600);
	font-size: 12px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.npg-contact-step strong { display:block; font-size:14px; font-weight:700; color:var(--npg-ink); margin-bottom:4px; }
.npg-contact-step p { font-size:13px; color:var(--npg-muted); margin:0; line-height:1.6; }
.npg-contact-alt { margin-top:32px; padding-top:24px; border-top:1px solid var(--npg-line); }
.npg-contact-alt p { font-size:13px; color:var(--npg-muted); margin-bottom:12px; }

/* Form card */
.npg-contact-form-card {
	background: #fff;
	border: 1px solid var(--npg-line);
	border-radius: 4px;
	padding: 40px 36px;
	box-shadow: 0 2px 20px rgba(0,0,0,.06);
}
.npg-contact-form-card h3 {
	font-size: 20px;
	font-weight: 700;
	color: var(--npg-ink);
	margin-bottom: 24px;
}

/* Form fields */
.npg-contact-form { display:flex; flex-direction:column; gap:16px; }
.npg-contact-field-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media(max-width:560px){ .npg-contact-field-row{ grid-template-columns:1fr; } }
.npg-contact-field { display:flex; flex-direction:column; gap:6px; }
.npg-contact-field label { font-size:13px; font-weight:700; color:var(--npg-ink); }
.npg-contact-field input,
.npg-contact-field textarea,
.npg-contact-select {
	padding: 11px 14px;
	border: 1.5px solid var(--npg-line);
	border-radius: 3px;
	font-size: 14px;
	font-family: inherit;
	color: var(--npg-ink);
	background: #fff;
	transition: border-color .2s;
	width: 100%;
}
.npg-contact-field input:focus,
.npg-contact-field textarea:focus,
.npg-contact-select:focus {
	outline: none;
	border-color: var(--npg-green-700);
}
.npg-contact-field textarea { resize: vertical; min-height: 100px; }
.npg-req { color: #c0392b; }
.npg-opt { font-weight:400; color:#aaa; font-size:12px; }
.npg-contact-submit { width:100%; margin-top:8px; }
.npg-contact-note { font-size:12px; color:var(--npg-muted); text-align:center; margin:4px 0 0; }
.npg-contact-success {
	background: #e8f5e9;
	border: 1px solid #a5d6a7;
	color: #2e7d32;
	padding: 12px 16px;
	border-radius: 3px;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 16px;
}
.npg-contact-error {
	background: #fdecea;
	border: 1px solid #f5c6c2;
	color: #c0392b;
	padding: 12px 16px;
	border-radius: 3px;
	font-size: 14px;
	margin-bottom: 16px;
}

/* Dashboard source tabs */
.npg-dash-page-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 20px;
}
.npg-dash-source-tabs {
	display: flex;
	gap: 4px;
	background: #f0f0f0;
	border-radius: 4px;
	padding: 3px;
}
.npg-dash-source-tab {
	padding: 6px 14px;
	border-radius: 3px;
	font-size: 12px;
	font-weight: 600;
	color: var(--npg-muted);
	text-decoration: none;
	transition: .2s;
}
.npg-dash-source-tab.active {
	background: #fff;
	color: var(--npg-green-900);
	box-shadow: 0 1px 3px rgba(0,0,0,.1);
}

/* ── What We Do — card as link ── */
a.npg-card-link {
	text-decoration: none;
	display: block;
	color: inherit;
}
a.npg-card-link:hover {
	border-color: var(--npg-gold-500);
}
a.npg-card-link .npg-h-card { color: var(--npg-ink); }

/* ── About Hero — fix layout ── */
.npg-hero-split {
	padding: 40px 0 48px !important;
}
.npg-hero-split-inner {
	grid-template-columns: 1fr 1fr !important;
	gap: 40px !important;
	align-items: center !important;
}
.npg-about-hero-left {
	justify-content: flex-start !important;
	padding-top: 0 !important;
}
.npg-hero-figure .npg-media {
	aspect-ratio: 3/4 !important;
	max-height: 480px !important;
	overflow: hidden !important;
}
.npg-hero-figure .npg-media img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: center top !important;
}

/* ── Client payment page — files ── */
.npg-pay-files {
	margin: 24px 0;
	padding: 20px;
	border: 1px solid var(--npg-line);
	border-radius: 4px;
	background: #fafafa;
	text-align: left;
}
.npg-pay-files--locked {
	background: #f8f8f8;
	border-style: dashed;
}
.npg-pay-files-title {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--npg-muted);
	margin-bottom: 12px;
	display: flex;
	align-items: center;
	gap: 8px;
}
.npg-pay-lock { font-size: 14px; }
.npg-pay-locked-note {
	font-size: 13px;
	color: #999;
	margin: 0;
}
.npg-pay-file {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 14px;
	background: #fff;
	border: 1px solid var(--npg-line);
	border-radius: 3px;
	margin-bottom: 8px;
	text-decoration: none;
	transition: border-color .2s;
}
.npg-pay-file:last-child { margin-bottom: 0; }
.npg-pay-file:hover { border-color: var(--npg-gold-500); }
.npg-pay-file-name {
	flex: 1;
	font-size: 14px;
	color: var(--npg-ink);
	font-weight: 500;
	word-break: break-all;
}
.npg-pay-file-dl {
	font-size: 12px;
	font-weight: 700;
	color: var(--npg-gold-600);
	white-space: nowrap;
}

/* ── Portfolio hero — split layout with 2x2 grid ── */
.npg-port-hero {
	background: #F4F2EE !important;
	min-height: auto !important;
	padding: 64px 0 !important;
	display: block !important;
}
.npg-port-hero-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	align-items: center;
}
@media(max-width:860px) {
	.npg-port-hero-split { grid-template-columns: 1fr; gap: 32px; }
	.npg-port-hero { padding: 48px 0 !important; }
}
.npg-port-hero-text .npg-eyebrow { color: var(--npg-gold-600); }
.npg-port-hero-text .npg-h-page { color: var(--npg-green-900); margin: 12px 0 14px; }
.npg-port-hero-text .npg-h-page em { color: var(--npg-gold-600); font-style: normal; }
.npg-port-hero-text .npg-port-hero-sub {
	color: var(--npg-muted);
	font-size: 15px;
	margin: 0;
	max-width: 42ch;
}

/* 2x2 image grid */
.npg-port-hero-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
.npg-port-hero-tile {
	aspect-ratio: 4/3;
	overflow: hidden;
	border-radius: 3px;
	background: #e8e5de;
}
.npg-port-hero-tile img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .5s ease;
}
.npg-port-hero-tile:hover img { transform: scale(1.05); }