/* ============================================================
   NetworkPlus — bespoke sections (strictly monochrome, INC brand)
   Picks up theme.json presets; falls back to literal values.
   ============================================================ */
:root{
  --np-ink:   var(--wp--preset--color--ink, #0a0a0a);
  --np-ink-2: var(--wp--preset--color--ink-2, #3d3d3d);
  --np-ink-3: var(--wp--preset--color--ink-3, #6f6f6f);
  --np-line:  var(--wp--preset--color--line, #e2e2de);
  --np-line-2:var(--wp--preset--color--line-2, #cfcfca);
  --np-bg-2:  var(--wp--preset--color--bg-2, #f2f2f0);
  --np-bg:    var(--wp--preset--color--base, #ffffff);
  --np-inv:   #0a0a0a;
  --np-on-inv:#ffffff;
  --np-map-grade: grayscale(1) contrast(1.05);
  --np-din: var(--wp--preset--font-family--din, "DIN Pro","DIN",-apple-system,BlinkMacSystemFont,"Segoe UI Semibold","Arial Narrow",sans-serif);
}

.np-din{font-family:var(--np-din)}
.np-kicker{font-family:var(--np-din);font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;font-weight:700;color:var(--np-ink-3)}

/* Signature lockup: NetworkPlus | inc  (local-church signature rule) */
.np-sig{display:inline-flex;align-items:center;gap:14px;font-family:var(--np-din)}
.np-sig .np{font-weight:800;font-size:1.24rem;letter-spacing:-.01em;line-height:1}
.np-sig .rule{width:1px;height:30px;background:var(--np-line-2)}
.np-sig .inc{display:flex;flex-direction:column;line-height:.82;font-weight:800;font-size:1.04rem}
.np-sig .inc small{font-size:.34rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--np-ink-2);margin-top:3px;line-height:1.25}

/* Hero */
.np-hero{position:relative;padding:118px 0 92px;border-bottom:1px solid var(--np-line);overflow:hidden}
.np-hero .eyebrow{display:inline-block;font-family:var(--np-din);font-size:.74rem;letter-spacing:.26em;text-transform:uppercase;font-weight:700;color:var(--np-ink-3);margin-bottom:30px}
.np-hero h1{font-family:var(--np-din);font-size:clamp(2.9rem,8.4vw,6.6rem);line-height:.92;font-weight:800;letter-spacing:-.025em;text-transform:uppercase;max-width:15ch}
.np-hero h1 .thin{font-weight:300}
.np-hero .lede{margin-top:30px;max-width:56ch;font-size:1.2rem;color:var(--np-ink-2)}
.np-bfm{position:absolute;right:-2%;bottom:-7%;font-family:var(--np-din);font-weight:800;text-transform:uppercase;letter-spacing:-.03em;font-size:clamp(4rem,15vw,13rem);line-height:.8;color:var(--np-ink);opacity:.04;pointer-events:none;text-align:right;z-index:0}
.np-hero > .wrap{position:relative;z-index:1}

.np-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--np-line);border:1px solid var(--np-line);margin-top:70px}
.np-stat{background:var(--np-bg);padding:26px 24px}
.np-stat .n{font-family:var(--np-din);font-size:2.6rem;font-weight:800;letter-spacing:-.02em;line-height:1}
.np-stat .l{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--np-ink-3);margin-top:10px;font-weight:600}
@media(max-width:760px){.np-stats{grid-template-columns:repeat(2,1fr)}}

/* Values: BOLD / ACTION / DEPENDABLE */
.np-values{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--np-line);border-top:1px solid var(--np-line);border-bottom:1px solid var(--np-line)}
.np-value{background:var(--np-bg-2);padding:54px 34px}
.np-value .w{font-family:var(--np-din);font-size:1.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
.np-value p{margin-top:10px;color:var(--np-ink-2);font-size:.96rem;max-width:30ch}
.np-value .num{font-family:var(--np-din);font-size:.72rem;font-weight:700;color:var(--np-ink-3);letter-spacing:.2em;margin-bottom:18px}
@media(max-width:760px){.np-values{grid-template-columns:1fr}}

/* Section header */
.np-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:52px;flex-wrap:wrap;border-bottom:2px solid var(--np-ink);padding-bottom:22px}
.np-sec-head h2{font-family:var(--np-din);font-size:clamp(2rem,5vw,3.4rem);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;line-height:.98;margin-top:14px}
.np-sec-head p{max-width:40ch;color:var(--np-ink-2)}

/* Locations: map + cards */
.np-loc-grid{display:grid;grid-template-columns:1.02fr 1fr;gap:38px;align-items:start}
@media(max-width:980px){.np-loc-grid{grid-template-columns:1fr}}
.np-map{height:580px;border:1px solid var(--np-line-2);position:sticky;top:96px;background:var(--np-bg-2)}
.np-map .leaflet-tile{filter:var(--np-map-grade)}
.np-map.leaflet-container{background:var(--np-bg-2);font-family:inherit}
@media(max-width:980px){.np-map{position:relative;top:0;height:400px}}
.np-cards{display:flex;flex-direction:column}
.np-card{background:var(--np-bg);border:1px solid var(--np-line);border-top:none;padding:24px 26px;cursor:pointer;transition:.2s;position:relative}
.np-card:first-child{border-top:1px solid var(--np-line)}
.np-card::after{content:"";position:absolute;left:0;top:0;bottom:0;width:0;background:var(--np-inv);transition:width .2s}
.np-card:hover,.np-card.active{background:var(--np-bg-2)}
.np-card.active::after{width:4px}
.np-card .top{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.np-card h3{font-family:var(--np-din);font-size:1.34rem;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;margin:0}
.np-card .where{font-family:var(--np-din);font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--np-ink-3);white-space:nowrap}
.np-card .pastors{font-size:.94rem;color:var(--np-ink-2);margin-top:4px}
.np-card .meta{margin-top:16px;display:grid;gap:8px;font-size:.92rem}
.np-card .meta div{display:flex;gap:11px;align-items:flex-start;color:var(--np-ink-2)}
.np-card .meta .ic{width:15px;height:15px;flex:none;margin-top:4px;stroke:var(--np-ink);fill:none;stroke-width:1.7}
.np-card .meta a{color:var(--np-ink);text-decoration:none;border-bottom:1px solid var(--np-line-2)}
.np-card .meta a:hover{border-color:var(--np-ink)}
.np-card .links{margin-top:18px;display:flex;gap:8px;flex-wrap:wrap}
.np-chip{font-family:var(--np-din);font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;padding:7px 13px;border:1px solid var(--np-line-2);color:var(--np-ink-2)}
.np-chip:hover{background:var(--np-inv);color:var(--np-on-inv);border-color:var(--np-inv)}
.np-map .leaflet-popup-content-wrapper{background:var(--np-bg);color:var(--np-ink);border-radius:2px}
.np-map .leaflet-popup-content{font-family:inherit;margin:13px 15px;font-size:.9rem}
.np-map .leaflet-popup-content b{font-family:var(--np-din);text-transform:uppercase}
.np-map .leaflet-popup-tip{background:var(--np-bg)}
.np-map .leaflet-control-attribution{font-size:9px;filter:grayscale(1)}

/* Portal (inverted block) */
.np-portal{background:var(--np-inv);color:var(--np-on-inv)}
.np-portal .np-kicker,.np-portal .np-sec-head p{color:color-mix(in srgb,var(--np-on-inv) 64%,transparent)}
.np-portal .np-sec-head{border-color:var(--np-on-inv)}
.np-portal .np-sec-head h2{color:var(--np-on-inv)}
.np-portal-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:start}
@media(max-width:860px){.np-portal-grid{grid-template-columns:1fr}}
.np-roles{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:color-mix(in srgb,var(--np-on-inv) 18%,transparent);border:1px solid color-mix(in srgb,var(--np-on-inv) 18%,transparent);margin-top:30px}
.np-role{background:var(--np-inv);padding:20px 22px}
.np-role .r{font-family:var(--np-din);font-weight:800;text-transform:uppercase;font-size:.92rem;letter-spacing:.04em}
.np-role .d{font-size:.84rem;color:color-mix(in srgb,var(--np-on-inv) 60%,transparent);margin-top:5px}
.np-signin{background:var(--np-on-inv);color:var(--np-inv);padding:38px}
.np-signin .lock{font-family:var(--np-din);font-size:.7rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--np-ink-3);display:flex;gap:9px;align-items:center;margin-bottom:16px}
.np-signin h3{font-family:var(--np-din);font-size:1.7rem;font-weight:800;text-transform:uppercase;margin:0}
.np-field{margin-top:18px}
.np-field label{display:block;font-family:var(--np-din);font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--np-ink-3);margin-bottom:7px}
.np-field input,.np-field select{width:100%;padding:13px 15px;border:1.5px solid var(--np-line-2);background:var(--np-bg);color:var(--np-ink);font:inherit}
.np-field input:focus,.np-field select:focus{outline:none;border-color:var(--np-ink)}
.np-note{font-size:.78rem;color:var(--np-ink-3);margin-top:18px;text-align:center;line-height:1.5}

/* Theme toggle button */

.np-btn{display:inline-flex;align-items:center;gap:10px;padding:15px 30px;text-decoration:none;font-family:var(--np-din);font-weight:700;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;transition:.22s;border:1.5px solid var(--np-inv);cursor:pointer;background:var(--np-inv);color:var(--np-on-inv)}
.np-btn:hover{background:transparent;color:var(--np-ink)}
.np-btn.ghost{background:transparent;color:var(--np-ink)}
.np-btn.ghost:hover{background:var(--np-inv);color:var(--np-on-inv)}

.np-wrap{max-width:1200px;margin:0 auto;padding:0 30px}
.np-reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.np-reveal.in{opacity:1;transform:none}

/* ============================================================
   Leader Portal — tabbed workspace shell
   ============================================================ */
.np-portal-app{min-height:50vh}
.np-cp-userbar{border-bottom:1px solid var(--np-line);background:var(--np-bg)}
.np-cp-userbar-in{display:flex;align-items:center;justify-content:space-between;height:56px}
.np-cp-kicker{font-family:var(--np-din);font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--np-ink-3)}
.np-cp-user{display:flex;align-items:center;gap:14px;font-size:.9rem;color:var(--np-ink-2)}
.np-cp-nav{border-bottom:1px solid var(--np-line);background:var(--np-bg)}
.np-cp-nav-in{display:flex;gap:2px;overflow-x:auto}
.np-cp-tab{padding:16px 18px;font-family:var(--np-din);font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--np-ink-3);text-decoration:none;border-bottom:2px solid transparent;white-space:nowrap}
.np-cp-tab:hover{color:var(--np-ink)}
.np-cp-tab.is-active{color:var(--np-ink);border-bottom-color:var(--np-ink)}
.np-cp-main{padding:40px 0 60px;background:var(--np-bg-2)}
.np-cp-panel{background:var(--np-bg);border:1px solid var(--np-line);padding:30px;margin-bottom:24px}

.np-cp-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px}
@media(max-width:760px){.np-cp-actions{grid-template-columns:1fr 1fr}}
.np-cp-action{display:flex;flex-direction:column;gap:4px;padding:20px;border:1px solid var(--np-line-2);text-decoration:none;color:var(--np-ink);transition:.18s}
.np-cp-action:hover{background:var(--np-inv);color:var(--np-on-inv);border-color:var(--np-inv)}
.np-cp-action .t{font-family:var(--np-din);font-weight:800;text-transform:uppercase;letter-spacing:.02em;font-size:1.02rem}
.np-cp-action .s{font-size:.84rem;opacity:.8}

.np-cp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--np-line);border:1px solid var(--np-line)}
@media(max-width:600px){.np-cp-stats{grid-template-columns:1fr}}
.np-cp-stat{background:var(--np-bg-2);padding:22px}
.np-cp-stat .n{display:block;font-family:var(--np-din);font-size:2.2rem;font-weight:800;line-height:1}
.np-cp-stat .l{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--np-ink-3);margin-top:8px}

.np-cp-table{width:100%;border-collapse:collapse;font-size:.92rem}
.np-cp-table th{text-align:left;padding:12px;border-bottom:2px solid var(--np-ink)}
.np-cp-table td{padding:12px;border-bottom:1px solid var(--np-line)}
.np-cp-table a{color:var(--np-ink);text-decoration:none;border-bottom:1px solid var(--np-line-2)}

/* Church detail view */
.np-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--np-line);border:1px solid var(--np-line)}
@media(max-width:680px){.np-detail-grid{grid-template-columns:1fr}}
.np-detail-item{background:var(--np-bg);padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.np-detail-item .k{font-family:var(--np-din);font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--np-ink-3)}
.np-detail-item .v{font-size:.98rem;color:var(--np-ink)}
.np-detail-item .v a{color:var(--np-ink)}

/* Charts + insights */
.np-chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:760px){.np-chart-grid{grid-template-columns:1fr}}
.np-chart-card{border:1px solid var(--np-line);padding:16px;background:var(--np-bg)}
.np-chart-card h4{font-family:var(--np-din);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;margin:0 0 12px;color:var(--np-ink-2)}
.np-insight-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:760px){.np-insight-grid{grid-template-columns:1fr}}
.np-insight{border:1px solid var(--np-line);padding:18px}
.np-insight h4{font-family:var(--np-din);font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--np-ink-3);margin:0 0 10px}
.np-insight ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.np-insight li{font-size:.92rem;color:var(--np-ink-2);border-bottom:1px solid var(--np-line);padding-bottom:8px}
.np-insight li:last-child{border-bottom:0}
.np-insight .up{color:var(--np-ink);font-weight:700}
.np-watch{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.np-watch li{font-size:.94rem;color:var(--np-ink-2);padding-left:14px;border-left:3px solid var(--np-ink)}
.np-media{border:1px solid var(--np-line);padding:16px;display:flex;flex-direction:column;gap:5px}
.np-media .src{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--np-ink-3)}
.np-media .note{font-size:.86rem;color:var(--np-ink-2)}

/* Inline record buttons (delete/toggle in management tables) */
.np-linkbtn{background:none;border:0;padding:0;margin:0;font:inherit;font-size:.84rem;color:var(--np-ink-3);text-decoration:underline;cursor:pointer}
.np-linkbtn:hover{color:var(--np-ink)}
.np-profile-form textarea{width:100%;padding:10px 12px;border:1px solid var(--np-line-2,#cfcfca);font:inherit;background:var(--np-bg)}

/* Meeting buttons block */
.np-meet{border:1px solid var(--np-line);padding:22px;margin-top:20px}
.np-meet-row{display:flex;gap:12px;flex-wrap:wrap}

/* Engagement flags (Log tab) */
.np-flag{display:inline-block;font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;font-weight:700;padding:3px 8px;border:1px solid var(--np-line-2);color:var(--np-ink-2);margin:1px 2px 1px 0;white-space:nowrap}
.np-flag.warn{border-color:var(--np-ink);color:var(--np-bg);background:var(--np-ink)}
.np-flag.ok{color:var(--np-ink-3);border-color:var(--np-line)}

/* Tool send: church picker + option checkboxes (checkbox beside label) */
.np-pick-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;border:1px solid var(--np-line-2);padding:10px}
@media(max-width:600px){.np-pick-grid{grid-template-columns:1fr}}
.np-pick{display:flex;align-items:center;gap:9px;padding:7px 8px;font-weight:400;text-transform:none;letter-spacing:0;cursor:pointer}
.np-pick:hover{background:var(--np-bg-2)}
.np-pick input{margin:0;flex:0 0 auto}
.np-pick span{flex:1}

/* Follow-up reminders + coaching questions (leader dashboard) */
.np-followups{display:flex;flex-direction:column;gap:1px;background:var(--np-line)}
.np-followup{display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--np-bg);padding:14px 16px}
.np-followup-main{display:flex;flex-direction:column;gap:3px}
.np-followup-main a{border:0}
.np-followup-main span{color:var(--np-ink-3);font-size:.9rem;line-height:1.45}
.np-coach{border:1px solid var(--np-line);padding:16px 18px;margin-bottom:12px}
.np-coach-head{margin-bottom:8px}
.np-coach-head a{border:0}
.np-coach ul{margin:0;padding-left:18px}
.np-coach li{margin:7px 0;line-height:1.55}

/* Life Wheel */
.np-lw-q{padding:12px 0;border-bottom:1px solid var(--np-line)}
.np-lw-qtext{display:block;margin-bottom:8px;line-height:1.5}
.np-lw-scale{display:flex;gap:4px;flex-wrap:wrap}
.np-lw-dot{position:relative;cursor:pointer}
.np-lw-dot input{position:absolute;opacity:0;width:0;height:0}
.np-lw-dot span{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid var(--np-line-2);font-size:.85rem;transition:all .12s}
.np-lw-dot:hover span{border-color:var(--np-ink)}
.np-lw-dot input:checked+span{background:var(--np-ink);color:var(--np-bg);border-color:var(--np-ink)}
@media(max-width:520px){.np-lw-dot span{width:28px;height:28px;font-size:.78rem}}
.np-lw-result{display:flex;gap:28px;flex-wrap:wrap;align-items:flex-start;margin-top:18px}
.np-lw-chart{flex:0 0 auto}
.np-lw-scores{flex:1;min-width:260px}

/* Tool library (Send a tool) */
.np-tool-list{display:flex;flex-direction:column;gap:1px;background:var(--np-line);border:1px solid var(--np-line)}
.np-tool-row{background:var(--np-bg);padding:14px 16px;display:grid;grid-template-columns:1fr auto;gap:12px 16px;align-items:center}
.np-tool-info{display:flex;flex-direction:column;gap:3px;min-width:0}
.np-tool-info span{color:var(--np-ink-3);font-size:.88rem;line-height:1.45}
.np-tool-send{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.np-tool-aud{padding:7px 10px;border:1px solid var(--np-line-2);background:var(--np-bg);font:inherit;font-size:.86rem}
.np-tool-pick{grid-column:1 / -1}
@media(max-width:600px){.np-tool-row{grid-template-columns:1fr}.np-tool-send{justify-content:flex-start}}

/* Resource library (portal Resources tab) */
.np-lib-list{display:flex;flex-direction:column;gap:1px;background:var(--np-line);border:1px solid var(--np-line)}
.np-lib-item{background:var(--np-bg);padding:14px 16px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.np-lib-info{display:flex;flex-direction:column;gap:3px;min-width:0}
.np-lib-info span{color:var(--np-ink-3);font-size:.88rem;line-height:1.45}

/* Resource library — in-portal add/manage */
.np-lib-add{border:1px solid var(--np-line);padding:12px 16px;margin-bottom:14px}
.np-lib-add summary{cursor:pointer;font-weight:600;font-family:var(--np-din,inherit);text-transform:uppercase;letter-spacing:.04em;font-size:.85rem}
.np-lib-add textarea{width:100%;padding:10px 12px;border:1px solid var(--np-line-2,#cfcfca);font:inherit;background:var(--np-bg)}

/* ============================================================
   Mobile fit / overflow safety
   ============================================================ */
/* Never let the portal push the page wider than the screen */
.np-portal-app{overflow-x:hidden}
/* Media never exceeds its container */
.np-portal-app img,.np-portal-app canvas,.np-portal-app svg{max-width:100%}
/* Radar chart sizes to its column, capped, stays square */
.np-lw-chart{flex:0 0 auto;width:100%;max-width:380px;position:relative}
.np-lw-chart canvas{width:100%!important;height:auto!important}

@media(max-width:760px){
  .np-wrap{padding:0 16px}
  /* Wide data tables scroll on their own instead of stretching the page */
  .np-cp-table{display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  /* Email preview frame fits the screen */
  .np-cp-panel table[role="presentation"]{width:100%!important}
}
@media(max-width:600px){
  .np-cp-main{padding:24px 0 48px}
  .np-cp-panel{padding:18px 16px}
  /* Stack the per-tool send row controls cleanly */
  .np-tool-send{width:100%}
  .np-followup{flex-direction:column;align-items:flex-start;gap:8px}
}

/* Church figures: 5 across on desktop, fewer on smaller screens */
.np-cp-stats-5{grid-template-columns:repeat(5,1fr)}
@media(max-width:760px){.np-cp-stats-5{grid-template-columns:repeat(3,1fr)}}
@media(max-width:480px){.np-cp-stats-5{grid-template-columns:repeat(2,1fr)}}
