:root {
    --pgri-white: #ffffff;
    --pgri-cream: #fffaf5;
    --pgri-sand: #f8f1ea;
    --pgri-slate: #2f2a26;
    --pgri-slate-2: #3a302a;
    --pgri-muted: #6f625a;
    --pgri-terra: #c96b4b;
    --pgri-terra-dark: #a95136;
    --pgri-olive: #8a9a5b;
    --pgri-olive-dark: #5f6f33;
    --pgri-line: rgba(47, 42, 38, .10);
    --pgri-shadow: 0 18px 38px rgba(47, 42, 38, .10);
    --pgri-shadow-soft: 0 10px 24px rgba(47, 42, 38, .08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body, button, input, select, textarea { font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }

body.civic-public-body, body.public-body {
    background: linear-gradient(180deg, #fffdfb 0%, #f8f1ea 100%);
    color: var(--pgri-slate);
}

.container { max-width: 1500px; }

.civic-public-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255, 255, 255, .92);
    border-bottom: 1px solid rgba(47, 42, 38, .10);
    box-shadow: 0 4px 18px rgba(47, 42, 38, .04);
    backdrop-filter: blur(14px);
}

.civic-nav-row { min-height: 76px; align-items: center; }
.civic-brand { gap: .8rem; text-decoration: none; }
.civic-brand .brand-logo { width: 48px; height: 48px; border-radius: 16px; object-fit: cover; box-shadow: 0 10px 22px rgba(201, 107, 75, .18); }
.civic-brand strong { color: var(--pgri-slate); font-size: 1.55rem; letter-spacing: -.03em; }
.civic-brand strong::first-letter { color: var(--pgri-terra); }
.civic-brand small { color: var(--pgri-muted); font-size: .78rem; }
.civic-public-nav { gap: 1.7rem; align-items: center; }
.civic-public-nav a:not(.btn) { color: var(--pgri-slate); font-weight: 800; text-decoration: none; position: relative; padding: 1.75rem 0; }
.civic-public-nav a:not(.btn):hover { color: var(--pgri-terra); }
.civic-public-nav a:not(.btn):first-child { color: var(--pgri-terra); }
.civic-public-nav a:not(.btn):first-child::after { content:""; position:absolute; left:0; right:0; bottom:0; height:4px; border-radius: 99px 99px 0 0; background: var(--pgri-terra); }
.civic-public-nav .btn { border-radius: 12px; padding: .85rem 1.2rem; font-weight: 800; }

.btn, .exact-primary-btn, .exact-link-btn { transition: .2s ease; }
.btn:hover, .exact-primary-btn:hover, .exact-link-btn:hover { transform: translateY(-1px); }
.btn-primary, .exact-primary-btn {
    background: linear-gradient(135deg, var(--pgri-terra), var(--pgri-terra-dark));
    border: 0;
    color: #fff !important;
    box-shadow: 0 12px 24px rgba(201, 107, 75, .25);
}
.btn-light { background: #fff; color: var(--pgri-slate); border: 1px solid var(--pgri-line); }
.btn-dark { background: var(--pgri-slate); color: #fff; border: 0; }

.civic-public-wrap { padding-top: 0; padding-bottom: 0; }
.public-wrap-portal { max-width: 1500px; }

.exact-home {
    display: grid;
    gap: 1rem;
    padding: 0 0 2.2rem;
}

.exact-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
    min-height: 430px;
    overflow: hidden;
    background:
        radial-gradient(circle at 58% 12%, rgba(138,154,91,.18), transparent 24%),
        linear-gradient(90deg, rgba(255,250,245,1) 0%, rgba(255,250,245,.94) 43%, rgba(255,250,245,.28) 64%, rgba(255,250,245,0) 82%);
    border-bottom: 1px solid rgba(47,42,38,.08);
}

.exact-hero::before {
    content: "";
    position: absolute;
    left: -10%; top: -18%;
    width: 58%; height: 138%;
    background: radial-gradient(circle, rgba(255,255,255,.92), rgba(255,255,255,.55) 40%, transparent 70%);
    pointer-events: none;
    z-index: 2;
}

.exact-hero-text {
    position: relative;
    z-index: 5;
    padding: 3.25rem 0 2rem 0;
    max-width: 720px;
}

.exact-kicker {
    display: inline-flex;
    width: fit-content;
    padding: .55rem .9rem;
    border-radius: 999px;
    background: rgba(138,154,91,.20);
    color: var(--pgri-olive-dark);
    font-weight: 900;
    font-size: .78rem;
    letter-spacing: .04em;
    margin-bottom: 1.1rem;
}

.exact-hero h1 {
    margin: 0;
    color: var(--pgri-slate);
    font-size: clamp(2.5rem, 4.55vw, 4.9rem);
    line-height: 1.04;
    letter-spacing: -.055em;
    font-weight: 900;
}
.exact-hero h1 em { font-style: normal; color: var(--pgri-terra); }
.exact-hero p { max-width: 710px; margin: 1.1rem 0 0; color: #6f625a; font-size: 1.06rem; line-height: 1.68; }

.exact-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.05rem; margin-top: 1.4rem; }
.exact-primary-btn { display: inline-flex; align-items: center; justify-content: center; gap: .62rem; min-height: 48px; padding: .92rem 1.3rem; border-radius: 11px; font-weight: 900; text-decoration: none; }
.exact-link-btn { display:inline-flex; gap:.5rem; align-items:center; color: var(--pgri-terra); font-weight: 900; text-decoration: none; padding: .85rem .95rem; }

.exact-hero-art { position: absolute; inset: 0 0 0 auto; width: 64%; z-index: 1; }
.exact-hero-art::after { content:""; position:absolute; inset:0; background: linear-gradient(90deg, rgba(255,250,245,.98) 0%, rgba(255,250,245,.66) 25%, transparent 55%); }
.exact-hero-art img { width: 100%; height: 100%; object-fit: cover; display:block; }
.exact-place-card { position:absolute; right: 2rem; bottom: 1.35rem; z-index: 3; padding: .9rem 1.05rem; border-radius: 18px; background: rgba(255,250,245,.9); border: 1px solid rgba(47,42,38,.10); box-shadow: var(--pgri-shadow-soft); backdrop-filter: blur(10px); }
.exact-place-card strong, .exact-place-card span { display:block; }
.exact-place-card strong { color: var(--pgri-slate); font-size: 1rem; }
.exact-place-card span { color: var(--pgri-muted); font-size:.82rem; }

.exact-services {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.35rem;
    margin-top: -1.6rem;
    position: relative;
    z-index: 8;
}
.exact-service-card {
    display: grid;
    grid-template-columns: 112px 1fr;
    gap: 1.05rem;
    align-items: center;
    min-height: 148px;
    background: rgba(255,255,255,.95);
    border: 1px solid rgba(47,42,38,.09);
    border-radius: 16px;
    box-shadow: var(--pgri-shadow);
    padding: 1rem 1.1rem;
}
.exact-service-card img { width: 98px; height: 98px; object-fit: contain; border-radius: 22px; background: #fbf6ef; }
.exact-service-card h3 { margin:0 0 .4rem; color: var(--pgri-slate); font-size: 1.08rem; letter-spacing: -.02em; }
.exact-service-card p { margin:0; color: #6f625a; line-height:1.45; font-size:.92rem; }
.exact-service-card a { display:inline-flex; gap:.4rem; margin-top:.72rem; color: var(--pgri-terra); font-size:.86rem; font-weight:900; text-decoration:none; }

.exact-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    background: rgba(255,255,255,.95);
    border: 1px solid rgba(47,42,38,.08);
    border-radius: 16px;
    box-shadow: var(--pgri-shadow-soft);
    overflow:hidden;
}
.exact-stats article { display:flex; align-items:center; gap:1rem; padding:1.1rem 1.3rem; border-right:1px solid rgba(47,42,38,.08); }
.exact-stats article:last-child { border-right:0; }
.exact-stat-icon { display:inline-flex; align-items:center; justify-content:center; width:62px; height:62px; flex:0 0 62px; border-radius:50%; background:#f0eadf; color: var(--pgri-olive-dark); font-weight: 900; font-size:1.5rem; }
.exact-stat-icon.rp { background: rgba(201,107,75,.14); color: var(--pgri-terra); font-size:1.05rem; }
.exact-stats small { display:block; color:#6f625a; font-weight:700; margin-bottom:.14rem; }
.exact-stats strong { display:block; color: var(--pgri-terra); font-size:1.45rem; line-height:1.1; letter-spacing:-.03em; }
.exact-stats article:nth-child(1) strong, .exact-stats article:nth-child(3) strong { color: var(--pgri-olive-dark); }
.exact-stats p { margin:.08rem 0 0; color:#6f625a; font-size:.9rem; }

.exact-activities { display:grid; gap:.7rem; }
.exact-section-title { display:flex; justify-content:space-between; align-items:center; padding:0 .25rem; }
.exact-section-title h2 { margin:0; color: var(--pgri-slate); font-size:1.45rem; letter-spacing:-.03em; }
.exact-section-title a { color: var(--pgri-terra); font-weight:900; text-decoration:none; font-size:.9rem; }
.exact-activity-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:1.35rem; }
.exact-activity-card { display:grid; grid-template-columns: 1.12fr .82fr; min-height: 150px; overflow:hidden; background:#fff; border:1px solid rgba(47,42,38,.08); border-radius:15px; box-shadow: var(--pgri-shadow-soft); }
.exact-activity-card img { width:100%; height:100%; min-height:150px; object-fit:cover; display:block; }
.exact-activity-card div { padding:1rem 1rem; display:grid; align-content:center; gap:.38rem; }
.exact-activity-card h3 { margin:0; color:var(--pgri-slate); font-size:1rem; }
.exact-activity-card p { margin:0; color:#6f625a; line-height:1.45; font-size:.9rem; }
.exact-badge { display:inline-flex; width:fit-content; padding:.42rem .7rem; border-radius:999px; background:rgba(138,154,91,.18); color:var(--pgri-olive-dark); font-weight:900; font-size:.78rem; }

.exact-process { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:1.35rem; }
.exact-process article { background:rgba(255,255,255,.92); border:1px solid rgba(47,42,38,.08); border-radius:18px; box-shadow:var(--pgri-shadow-soft); padding:1.25rem; }
.exact-process span { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:14px; background:linear-gradient(135deg,var(--pgri-terra),var(--pgri-olive)); color:#fff; font-weight:900; margin-bottom:.8rem; }
.exact-process h3 { margin:0 0 .45rem; color:var(--pgri-slate); }
.exact-process p { margin:0; color:var(--pgri-muted); line-height:1.6; }

.exact-cta { display:flex; justify-content:space-between; align-items:center; gap:1.25rem; padding:1.45rem 1.6rem; border-radius:18px; background:linear-gradient(135deg,#2b2622,#3a302a); color:#fff; box-shadow:var(--pgri-shadow-soft); }
.exact-cta span { color:#ffd5c5; font-weight:900; font-size:.86rem; text-transform:uppercase; letter-spacing:.04em; }
.exact-cta h2 { margin:.35rem 0; color:#fff; letter-spacing:-.03em; }
.exact-cta p { margin:0; color:rgba(255,247,239,.78); }

.civic-footer { margin-top: 0; padding: 1.55rem 0 1rem; background: linear-gradient(180deg,#241f1b,#2f2a26); color:rgba(255,255,255,.82); }
.civic-footer-grid { display:grid; grid-template-columns:1.45fr .8fr .8fr 1.15fr; gap:1.6rem; }
.footer-brand-row { display:flex; align-items:center; gap:.8rem; margin-bottom:.75rem; }
.footer-brand-row .brand-logo { width:48px; height:48px; border-radius:15px; object-fit:cover; }
.civic-footer h4, .civic-footer strong, .civic-footer a { color:#fff; }
.civic-footer p, .civic-footer small, .civic-footer li { color:rgba(255,255,255,.70); line-height:1.6; }
.civic-footer ul { list-style:none; padding:0; margin:0; display:grid; gap:.45rem; }
.civic-footer a { text-decoration:none; }
.civic-footer-bottom { border-top:1px solid rgba(255,255,255,.10); margin-top:1rem; padding-top:.9rem; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }

/* Auth and dashboard theme */
body.app-shell-authenticated { background: var(--pgri-sand); color:var(--pgri-slate); }
.app-shell { padding:1rem; gap:1rem; }
.sidebar { background:linear-gradient(180deg,#2b2622,#3a302a); border-radius:28px; color:rgba(47,42,38,.86); box-shadow:0 18px 32px rgba(47,42,38,.22); }
.sidebar .brand-logo { width:48px; height:48px; border-radius:15px; object-fit:cover; }
.sidebar .brand strong,.sidebar .brand small,.sidebar .section-label,.sidebar-user strong,.sidebar-user small,.sidebar-panel p,.sidebar-metrics span,.sidebar-metrics strong { color:rgba(255,255,255,.88); }
.sidebar-panel,.sidebar-group { background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.07); border-radius:20px; }
.nav-link { border-radius:13px; color:rgba(255,255,255,.84); font-weight:800; }
.nav-link:hover,.nav-link.active { background:rgba(255,255,255,.11); color:#fff; }
.avatar,.sidebar-user .avatar { background:linear-gradient(135deg,var(--pgri-terra),var(--pgri-olive)); color:#fff; }
.topbar { border-radius:24px; background:rgba(47,42,38,.86); border:1px solid rgba(47,42,38,.08); box-shadow:var(--pgri-shadow-soft); }
.workspace-label { color:var(--pgri-terra); font-weight:900; }
.page-title { color:var(--pgri-slate); }
.page-subtitle,.utility-chip { color:var(--pgri-muted); }
.card,.section-card,.auth-card,.panel,.stat-card,.summary-card,.data-card,.strip-card { background:rgba(255,255,255,.9); border:1px solid rgba(47,42,38,.08); border-radius:20px; box-shadow:var(--pgri-shadow-soft); }
input:not([type="hidden"]),select,textarea { border-radius:13px; border:1px solid rgba(47,42,38,.14); background:#fff; }
input:not([type="hidden"]):focus,select:focus,textarea:focus { outline:none; border-color:rgba(201,107,75,.55); box-shadow:0 0 0 4px rgba(201,107,75,.12); }
.auth-wrapper.auth-centered { min-height:calc(100vh - 210px); display:grid; place-items:center; }
.auth-card-centered { max-width:520px; width:100%; padding:2rem; border-radius:28px; }
.auth-head-centered .brand-logo-large { width:76px; height:76px; border-radius:20px; object-fit:cover; margin:0 auto 1rem; }
.auth-head-centered h2 { color:var(--pgri-slate); font-size:2rem; letter-spacing:-.04em; }
.auth-head-centered p,.form-helper-row small,.auth-security-note span { color:var(--pgri-muted); line-height:1.65; }
.auth-security-note { margin-top:1.15rem; padding:1rem; border-radius:18px; background:rgba(248,241,234,.78); }

table thead th { background:#f5ede4; color:var(--pgri-slate); }
table th, table td { border-bottom:1px solid rgba(47,42,38,.08); padding:.9rem 1rem; }
table tbody tr:hover { background:rgba(201,107,75,.045); }

@media (max-width: 1260px) {
    .exact-services { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .exact-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .exact-activity-grid, .exact-process { grid-template-columns:1fr; }
    .exact-activity-card { grid-template-columns: .8fr 1fr; }
    .civic-footer-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 900px) {
    .civic-nav-row { min-height:auto; padding:1rem 0; align-items:flex-start; gap:1rem; }
    .civic-brand { width:100%; }
    .civic-public-nav { width:100%; justify-content:flex-start; gap:.9rem; flex-wrap:wrap; }
    .civic-public-nav a:not(.btn) { padding:.35rem 0; }
    .civic-public-nav a:not(.btn):first-child::after { display:none; }
    .exact-hero { grid-template-columns:1fr; min-height:auto; padding-bottom:0; }
    .exact-hero-text { padding:2rem 0 1rem; max-width:none; }
    .exact-hero-art { position:relative; width:100%; min-height:290px; border-radius:24px; overflow:hidden; }
    .exact-hero-art::after { background:linear-gradient(180deg,transparent 45%,rgba(255,250,245,.5)); }
    .exact-services { grid-template-columns:1fr; margin-top:0; }
    .exact-stats { grid-template-columns:1fr; }
    .exact-stats article { border-right:0; border-bottom:1px solid rgba(47,42,38,.08); }
    .exact-activity-card { grid-template-columns:1fr; }
    .exact-activity-card img { height:210px; }
    .exact-cta { flex-direction:column; align-items:flex-start; }
    .civic-footer-grid { grid-template-columns:1fr; }
}

@media (max-width: 620px) {
    .exact-hero h1 { font-size:2.25rem; }
    .exact-service-card { grid-template-columns:86px 1fr; padding:.9rem; }
    .exact-service-card img { width:78px; height:78px; }
    .exact-stats article { padding:1rem; }
    .exact-stat-icon { width:52px; height:52px; flex-basis:52px; }
    .exact-section-title { align-items:flex-start; flex-direction:column; }
}

:root {
    --bg: #f8f1ea !important;
    --bg-2: #f3eadf !important;
    --surface: #ffffff !important;
    --surface-alt: #fffaf5 !important;
    --surface-dark: #2f2a26 !important;
    --surface-dark-2: #3a302a !important;
    --text: #2f2a26 !important;
    --text-soft: #6f625a !important;
    --muted: #6f625a !important;
    --line: #eaded1 !important;
    --line-strong: #d8c8b8 !important;
    --primary: #c96b4b !important;
    --primary-2: #a95136 !important;
    --teal: #8a9a5b !important;
    --info: #c96b4b !important;
    --brand-slate: #2f2a26 !important;
    --brand-olive: #8a9a5b !important;
    --brand-green: #8a9a5b !important;
    --brand-amber: #c9a227 !important;
    --ink: #2f2a26 !important;
    --paper: #ffffff !important;
    --gradient-primary: linear-gradient(135deg, #c96b4b 0%, #a95136 58%, #8a9a5b 100%) !important;
    --gradient-soft: radial-gradient(circle at 12% 18%, rgba(138,154,91,.16), transparent 28%), radial-gradient(circle at 88% 12%, rgba(201,107,75,.14), transparent 30%), linear-gradient(180deg, #fffaf5 0%, #f8f1ea 100%) !important;
}

a,
.text-link,
.public-nav a:hover,
.civic-public-nav a:hover,
.workspace-label,
.metric-change,
.highlight-value,
.stat-value,
.card-link,
.link,
.pagination a,
.breadcrumb a { color: #c96b4b !important; }

.btn-primary,
button.btn-primary,
input[type="submit"],
.primary-action,
.action-primary,
.badge-primary,
.counter,
.nav-link .counter {
    background: linear-gradient(135deg, #c96b4b, #a95136) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.btn-dark,
.sidebar,
.public-footer,
.civic-footer,
.exact-cta,
.surface-dark,
.hero-dark,
.panel-dark {
    background: linear-gradient(135deg, #241f1b, #2f2a26) !important;
    color: #ffffff !important;
}

body,
.app-body,
.public-body,
.dashboard-shell,
.main-column,
.page-content {
    background-color: #f8f1ea !important;
}

.card,
.panel,
.section-card,
.auth-card,
.table-card,
.summary-card,
.stat-card,
.data-card,
.strip-card,
.portal-feature-card,
.portal-role-card,
.portal-flow-card {
    border-color: rgba(47,42,38,.08) !important;
    box-shadow: 0 12px 28px rgba(47,42,38,.08) !important;
}

.status-paid,
.badge-success,
.success,
.pill-success { background: rgba(138,154,91,.16) !important; color: #5f6f33 !important; border-color: rgba(138,154,91,.22) !important; }
.status-pending,
.badge-warning,
.warning { background: rgba(201,162,39,.16) !important; color: #8a6d18 !important; border-color: rgba(201,162,39,.24) !important; }
.status-unpaid,
.badge-danger,
.danger { background: rgba(201,107,75,.15) !important; color: #a95136 !important; border-color: rgba(201,107,75,.24) !important; }
.status-info,
.badge-info,
.info { background: rgba(201,107,75,.13) !important; color: #a95136 !important; border-color: rgba(201,107,75,.22) !important; }

input:not([type="hidden"]):focus,
select:focus,
textarea:focus {
    border-color: rgba(201,107,75,.58) !important;
    box-shadow: 0 0 0 4px rgba(201,107,75,.13) !important;
}

.progress-bar,
.chart-bar,
.bar-fill,
.invoice-progress span {
    background: linear-gradient(90deg, #c96b4b, #8a9a5b) !important;
}

.sidebar .nav-link:hover,
.sidebar .nav-link.active,
.nav-link:hover,
.nav-link.active {
    background: rgba(201,107,75,.18) !important;
    color: #ffffff !important;
}

svg [fill="#c96b4b"], svg [stroke="#c96b4b"] { color: #c96b4b; }

/* === FINAL AKHIR 100% TERRACOTTA SLATE POLISH === */
:root{
  --pgri-white:#ffffff!important;
  --pgri-sand:#f8f1ea!important;
  --pgri-cream:#fffaf5!important;
  --pgri-cream-2:#f5ede4!important;
  --pgri-slate:#2f2a26!important;
  --pgri-slate-2:#3b332d!important;
  --pgri-slate-3:#4b5a5f!important;
  --pgri-terra:#c96b4b!important;
  --pgri-terra-2:#a95136!important;
  --pgri-terra-soft:#e5a18a!important;
  --pgri-olive:#8a9a5b!important;
  --pgri-line:#eaded1!important;
  --pgri-shadow:0 18px 42px rgba(47,42,38,.10)!important;
  --pgri-shadow-soft:0 10px 24px rgba(47,42,38,.08)!important;
  --primary-soft:rgba(201,107,75,.10)!important;
  --teal-soft:rgba(138,154,91,.14)!important;
  --info-soft:rgba(201,107,75,.12)!important;
  --shadow-sm:0 8px 18px rgba(47,42,38,.06)!important;
  --shadow:0 18px 42px rgba(47,42,38,.10)!important;
  --shadow-lg:0 28px 64px rgba(47,42,38,.13)!important;
}
html,body{background:#f8f1ea!important;color:#2f2a26!important;}
body.civic-public-body,
body.public-body{
  background:radial-gradient(circle at 8% 8%,rgba(201,107,75,.10),transparent 26%),radial-gradient(circle at 92% 0%,rgba(138,154,91,.12),transparent 27%),linear-gradient(180deg,#fffaf5 0%,#f8f1ea 100%)!important;
}
.public-header,
.public-header.is-scrolled,
.civic-public-header{
  background:rgba(255,250,245,.94)!important;
  background-color:rgba(255,250,245,.94)!important;
  color:#2f2a26!important;
  border-bottom:1px solid rgba(47,42,38,.08)!important;
  box-shadow:0 8px 20px rgba(47,42,38,.06)!important;
  backdrop-filter:blur(18px)!important;
}
.civic-nav-row{min-height:86px!important;}
.civic-brand,.brand-meta,.public-header .brand{color:#2f2a26!important;text-decoration:none!important;text-shadow:none!important;}
.civic-brand span,.brand-meta span{display:grid!important;gap:.15rem!important;}
.civic-brand strong,.brand-meta strong,.public-header .brand strong{
  color:#2f2a26!important;
  text-shadow:none!important;
  letter-spacing:-.04em!important;
  font-weight:900!important;
}
.civic-brand strong::first-letter{color:#c96b4b!important;}
.civic-brand small,.brand-meta small,.public-header .brand small{
  color:#4b5a5f!important;
  text-shadow:none!important;
  font-weight:700!important;
}
.civic-brand .brand-logo,.public-header .brand-logo{
  width:54px!important;height:54px!important;border-radius:18px!important;object-fit:cover!important;
  background:#fffaf5!important;padding:4px!important;border:1px solid rgba(47,42,38,.10)!important;box-shadow:0 12px 24px rgba(47,42,38,.12)!important;
}
.civic-public-nav a:not(.btn),.public-nav a:not(.btn){
  color:#2f2a26!important;text-shadow:none!important;font-weight:800!important;
}
.civic-public-nav a:not(.btn):hover,.public-nav a:not(.btn):hover,.civic-public-nav a:not(.btn):focus{
  color:#c96b4b!important;
}
.civic-public-nav a:not(.btn)::after{background:linear-gradient(90deg,#c96b4b,rgba(201,107,75,0))!important;}
.btn-primary,.public-nav .btn-primary,.civic-public-nav .btn-primary{
  background:linear-gradient(135deg,#c96b4b 0%,#a95136 100%)!important;
  color:#fff!important;border:0!important;box-shadow:0 14px 28px rgba(201,107,75,.24)!important;
}
.btn-light{background:rgba(47,42,38,.86)!important;border:1px solid rgba(47,42,38,.10)!important;color:#2f2a26!important;box-shadow:none!important;}
.btn-dark{background:linear-gradient(135deg,#2f2a26,#241f1b)!important;color:#fff!important;border:0!important;}
.public-wrap,.public-wrap-portal,.civic-public-wrap{background:transparent!important;}
.exact-hero,.civic-hero{
  background:#fffaf5!important;border:1px solid rgba(47,42,38,.08)!important;box-shadow:0 18px 42px rgba(47,42,38,.10)!important;
}
.exact-hero h1,.civic-hero h1,.exact-section-title h2,.civic-section-head h2{color:#2f2a26!important;text-shadow:none!important;}
.exact-hero h1 span,.civic-hero h1 span,.eyebrow{color:#c96b4b!important;}
.exact-hero p,.civic-hero p,.lead,.muted,.subtle-value{color:#6f625a!important;}
.card,.panel,.section-card,.auth-card,.exact-service-card,.exact-stats,.exact-activity-card,.exact-process article,.summary-card,.stat-card,.data-card,.strip-card,.portal-feature-card,.portal-role-card,.portal-flow-card{
  background:rgba(255,255,255,.92)!important;border:1px solid rgba(47,42,38,.08)!important;box-shadow:0 12px 28px rgba(47,42,38,.08)!important;color:#2f2a26!important;
}
.exact-service-card:hover,.card:hover{box-shadow:0 18px 36px rgba(47,42,38,.11)!important;}
.exact-stat-icon,.service-icon,.feature-emoji,.stat-icon{
  background:linear-gradient(145deg,rgba(201,107,75,.18),rgba(138,154,91,.18))!important;color:#2f2a26!important;
}
.exact-cta,.civic-footer,.public-footer{
  background:linear-gradient(135deg,#241f1b 0%,#2f2a26 52%,#3b332d 100%)!important;color:rgba(47,42,38,.86)!important;
}
.civic-footer a,.public-footer a{color:#e5a18a!important;text-decoration:none!important;}
.civic-footer a:hover,.public-footer a:hover{color:#ffffff!important;}
.civic-footer h4,.civic-footer strong,.public-footer h4,.public-footer strong{color:#ffffff!important;}
.civic-footer p,.civic-footer small,.civic-footer li,.public-footer p,.public-footer small,.public-footer li{color:rgba(255,255,255,.76)!important;}
.civic-footer-bottom small:last-child{word-spacing:normal!important;}
.sidebar{background:linear-gradient(180deg,#241f1b 0%,#2f2a26 58%,#3b332d 100%)!important;box-shadow:0 18px 34px rgba(47,42,38,.22)!important;}
.topbar{background:rgba(255,250,245,.90)!important;border-color:rgba(47,42,38,.08)!important;color:#2f2a26!important;}
.page-content,.main-column,.app-body,.app-shell-authenticated{background:#f8f1ea!important;}
.nav-link.active,.nav-link:hover,.sidebar .nav-link.active,.sidebar .nav-link:hover{background:rgba(201,107,75,.18)!important;color:#fff!important;}
input:not([type="hidden"]):focus,select:focus,textarea:focus{border-color:rgba(201,107,75,.58)!important;box-shadow:0 0 0 4px rgba(201,107,75,.13)!important;}
table thead th{background:#f5ede4!important;color:#2f2a26!important;}
table tbody tr:hover{background:rgba(201,107,75,.045)!important;}
.badge-info,.alert-info,.chip-info,.status-info{background:rgba(201,107,75,.13)!important;color:#a95136!important;border-color:rgba(201,107,75,.22)!important;}
.badge-success,.alert-success,.chip-success{background:rgba(138,154,91,.16)!important;color:#5f6f33!important;border-color:rgba(138,154,91,.22)!important;}
.badge-warning,.alert-warning,.chip-warning{background:rgba(201,162,39,.16)!important;color:#8a6d18!important;border-color:rgba(201,162,39,.24)!important;}
.badge-danger,.alert-danger,.chip-danger{background:rgba(201,107,75,.15)!important;color:#a95136!important;border-color:rgba(201,107,75,.24)!important;}
*{scrollbar-color:#c96b4b #f5ede4;}

/* =========================================================
   FINAL CLEAN PASS - Warm Terracotta Slate locked
   ========================================================= */
:root {
    --pgri-white: #ffffff !important;
    --pgri-cream: #fffaf5 !important;
    --pgri-sand: #f8f1ea !important;
    --pgri-slate: #2f2a26 !important;
    --pgri-slate-2: #3b332d !important;
    --pgri-slate-3: #4b5a5f !important;
    --pgri-muted: #6f625a !important;
    --pgri-terra: #c96b4b !important;
    --pgri-terra-dark: #a95136 !important;
    --pgri-olive: #8a9a5b !important;
    --pgri-line: rgba(47, 42, 38, .10) !important;
    --pgri-warm-shadow: 0 18px 42px rgba(47, 42, 38, .10) !important;
    --primary: #c96b4b !important;
    --primary-2: #a95136 !important;
    --primary-soft: rgba(201,107,75,.10) !important;
    --teal: #8a9a5b !important;
    --teal-soft: rgba(138,154,91,.12) !important;
    --info: #c96b4b !important;
    --info-soft: rgba(201,107,75,.12) !important;
    --success: #8a9a5b !important;
    --success-soft: rgba(138,154,91,.13) !important;
    --surface-dark: #2f2a26 !important;
    --surface-dark-2: #3b332d !important;
    --shadow-sm: 0 8px 18px rgba(47,42,38,.06) !important;
    --shadow: 0 18px 48px rgba(47,42,38,.10) !important;
    --shadow-lg: 0 28px 64px rgba(47,42,38,.14) !important;
}

html,
body,
body.public-body,
body.civic-public-body,
body.app-shell-authenticated {
    background:
        radial-gradient(circle at 8% 0%, rgba(201,107,75,.08), transparent 24rem),
        radial-gradient(circle at 92% 4%, rgba(138,154,91,.09), transparent 22rem),
        linear-gradient(180deg, #fffaf5 0%, #f8f1ea 100%) !important;
    color: var(--pgri-slate) !important;
}

body::before {
    background-image: linear-gradient(rgba(47,42,38,.026) 1px, transparent 1px), linear-gradient(90deg, rgba(47,42,38,.026) 1px, transparent 1px) !important;
}

/* Public navbar: cream surface, slate text, terracotta active */
.public-header,
.public-header.civic-public-header,
.civic-public-header {
    background: rgba(255,250,245,.96) !important;
    border-bottom: 1px solid rgba(47,42,38,.10) !important;
    box-shadow: 0 8px 28px rgba(47,42,38,.07) !important;
    backdrop-filter: blur(16px) !important;
}

.public-header .brand,
.public-header .brand span,
.public-header .brand strong,
.public-header .brand span strong,
.public-header .brand small,
.public-header .brand span small,
.civic-brand,
.civic-brand span,
.civic-brand strong,
.civic-brand small {
    text-shadow: none !important;
}

.public-header .brand strong,
.public-header .brand span strong,
.civic-brand strong {
    color: var(--pgri-slate) !important;
    font-weight: 900 !important;
}
.public-header .brand strong::first-letter,
.civic-brand strong::first-letter { color: var(--pgri-terra) !important; }
.public-header .brand small,
.public-header .brand span small,
.civic-brand small {
    color: var(--pgri-slate-3) !important;
    font-weight: 700 !important;
}
.public-header .brand-logo,
.civic-brand .brand-logo,
.brand-logo {
    background: #fffaf5 !important;
    border: 1px solid rgba(47,42,38,.08) !important;
    box-shadow: 0 10px 22px rgba(47,42,38,.10) !important;
}

.public-nav a:not(.btn),
.civic-public-nav a:not(.btn) {
    color: var(--pgri-slate) !important;
    text-shadow: none !important;
}
.public-nav a:not(.btn):hover,
.civic-public-nav a:not(.btn):hover,
.civic-public-nav a:not(.btn):first-child {
    color: var(--pgri-terra) !important;
}
.public-nav a:not(.btn)::after,
.civic-public-nav a:not(.btn)::after,
.civic-public-nav a:not(.btn):first-child::after {
    background: var(--pgri-terra) !important;
}

/* Buttons */
.btn-primary,
.exact-primary-btn,
button.btn-primary,
a.btn-primary {
    background: linear-gradient(135deg, #c96b4b, #a95136) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 14px 28px rgba(201,107,75,.24) !important;
}
.btn-light,
a.btn-light,
button.btn-light {
    background: #fffaf5 !important;
    color: var(--pgri-slate) !important;
    border: 1px solid rgba(47,42,38,.12) !important;
    box-shadow: 0 8px 18px rgba(47,42,38,.05) !important;
}
.btn-dark,
a.btn-dark,
button.btn-dark {
    background: linear-gradient(135deg, #2f2a26, #3b332d) !important;
    color: #fffaf5 !important;
    border-color: transparent !important;
}

/* Landing sections */
.exact-home,
.landing-civic,
.public-wrap,
.civic-public-wrap {
    background: transparent !important;
}
.exact-hero {
    background:
        radial-gradient(circle at 62% 14%, rgba(138,154,91,.16), transparent 24%),
        linear-gradient(90deg, rgba(255,250,245,1) 0%, rgba(255,250,245,.95) 42%, rgba(255,250,245,.35) 66%, rgba(255,250,245,0) 84%) !important;
    border-bottom: 1px solid rgba(47,42,38,.08) !important;
}
.exact-hero h1,
.exact-section-title h2,
.exact-process h3,
.exact-activity-card h3,
.exact-service-card h3,
.exact-place-card strong,
.exact-cta h2,
.civic-hero h1,
.civic-section-head h2,
h1, h2, h3, h4 {
    color: var(--pgri-slate) !important;
}
.exact-hero h1 em,
.exact-link-btn,
.exact-section-title a,
.exact-service-card a,
.text-link,
a.text-link {
    color: var(--pgri-terra) !important;
}
.exact-hero p,
.exact-service-card p,
.exact-activity-card p,
.exact-process p,
.exact-stats small,
.exact-stats p,
p, small, .muted, .subtle-value {
    color: var(--pgri-muted) !important;
}

.card,
.exact-service-card,
.exact-stats,
.exact-activity-card,
.exact-process article,
.auth-card,
.panel,
.table-card,
.inset-card,
.strip-card,
.summary-card,
.data-card,
.portal-feature-card,
.portal-role-card,
.portal-flow-card,
.portal-stat-card,
.portal-quick-link,
.portal-flow-step,
.detail-line,
.empty-state-block,
.empty-callout {
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,250,245,.96)) !important;
    border-color: rgba(47,42,38,.10) !important;
    box-shadow: var(--pgri-warm-shadow) !important;
    color: var(--pgri-slate) !important;
}
.surface-note,
.card-flat {
    background: linear-gradient(180deg, #fffaf5, #f8f1ea) !important;
}
.highlight-card {
    background:
        radial-gradient(circle at top right, rgba(138,154,91,.13), transparent 30%),
        radial-gradient(circle at top left, rgba(201,107,75,.10), transparent 28%),
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,250,245,.98)) !important;
}

.exact-stat-icon { background: #f0eadf !important; color: #5f6f33 !important; }
.exact-stat-icon.rp { background: rgba(201,107,75,.14) !important; color: #c96b4b !important; }
.exact-stats strong { color: var(--pgri-terra) !important; }
.exact-stats article:nth-child(1) strong,
.exact-stats article:nth-child(3) strong { color: var(--pgri-olive) !important; }
.exact-badge,
.exact-kicker,
.badge,
.status-badge,
.pill,
.chip,
.mini-tag {
    background: rgba(201,107,75,.10) !important;
    color: var(--pgri-terra-dark) !important;
    border-color: rgba(201,107,75,.16) !important;
}
.chip-success,
.badge-success,
.status-paid,
.is-paid {
    background: rgba(138,154,91,.14) !important;
    color: #5f6f33 !important;
    border-color: rgba(138,154,91,.20) !important;
}

/* Footer */
.public-footer,
.civic-footer,
.exact-footer,
footer {
    background: linear-gradient(135deg, #2f2a26, #3b332d) !important;
    color: rgba(255,250,245,.86) !important;
    border-top: 1px solid rgba(255,250,245,.08) !important;
}
.public-footer h4,
.public-footer strong,
.civic-footer h4,
.civic-footer strong,
.exact-footer h4,
.exact-footer strong,
footer h4,
footer strong {
    color: #fffaf5 !important;
}
.public-footer p,
.public-footer small,
.public-footer li,
.civic-footer p,
.civic-footer small,
.civic-footer li,
.exact-footer p,
.exact-footer small,
.exact-footer li,
footer p,
footer small,
footer li {
    color: rgba(255,250,245,.76) !important;
}
.public-footer a,
.civic-footer a,
.exact-footer a,
footer a {
    color: #e5a18a !important;
}
.public-footer a:hover,
.civic-footer a:hover,
.exact-footer a:hover,
footer a:hover {
    color: #fffaf5 !important;
}

.app-shell {
    background: transparent !important;
}
.sidebar {
    background: linear-gradient(180deg, #2f2a26 0%, #3b332d 100%) !important;
    border: 1px solid rgba(255,250,245,.08) !important;
    box-shadow: 0 24px 60px rgba(47,42,38,.22) !important;
}
.sidebar,
.sidebar * {
    text-shadow: none !important;
}
.sidebar .brand strong,
.sidebar .section-label,
.sidebar-user strong,
.sidebar .nav-link,
.sidebar h1,
.sidebar h2,
.sidebar h3,
.sidebar h4 {
    color: #fffaf5 !important;
}
.sidebar .brand small,
.sidebar-panel p,
.sidebar-user small,
.sidebar-metrics span,
.sidebar small {
    color: rgba(255,250,245,.72) !important;
}
.sidebar-panel,
.sidebar-group,
.sidebar-panel-muted {
    background: rgba(255,250,245,.055) !important;
    border-color: rgba(255,250,245,.08) !important;
}
.nav-link {
    color: rgba(255,250,245,.80) !important;
}
.nav-link:hover,
.nav-link.active,
.nav-link[aria-current="page"] {
    background: rgba(201,107,75,.22) !important;
    color: #fffaf5 !important;
    border-color: rgba(255,250,245,.12) !important;
}
.counter,
.nav-link .counter {
    background: #c96b4b !important;
    color: #ffffff !important;
    border-color: transparent !important;
}
.topbar {
    background: rgba(255,250,245,.94) !important;
    border: 1px solid rgba(47,42,38,.10) !important;
    box-shadow: 0 14px 30px rgba(47,42,38,.08) !important;
}
.workspace-label { color: var(--pgri-terra-dark) !important; }
.page-title { color: var(--pgri-slate) !important; }
.page-subtitle,
.utility-chip { color: var(--pgri-muted) !important; }
.utility-chip {
    background: #fffaf5 !important;
    border: 1px solid rgba(47,42,38,.10) !important;
}
.page-content,
.main-column,
.page-content-inner {
    background: transparent !important;
}

/* Tables/forms/messages */
table thead th,
.table thead th {
    background: #f5ede4 !important;
    color: var(--pgri-slate) !important;
    border-bottom: 1px solid rgba(47,42,38,.10) !important;
}
table tbody tr:hover,
.table tbody tr:hover { background: rgba(201,107,75,.045) !important; }
table td, table th, .table td, .table th { color: var(--pgri-slate) !important; }
input:not([type="hidden"]), select, textarea {
    background: #fffaf5 !important;
    color: var(--pgri-slate) !important;
    border-color: rgba(47,42,38,.13) !important;
}
input:not([type="hidden"]):focus, select:focus, textarea:focus {
    border-color: rgba(201,107,75,.55) !important;
    box-shadow: 0 0 0 4px rgba(201,107,75,.13) !important;
}

/* Remove leftover cool-toned image feel on landing illustrations */
.exact-hero-art img,
.exact-service-card img,
.exact-activity-card img,
.civic-hero-visual-card img,
.activity-card img {
    filter: saturate(.96) sepia(.06) hue-rotate(-8deg) contrast(1.02) !important;
}

/* =========================================================
   FINAL VISUAL LOCK - WARM TERRACOTTA SLATE, NO COOL DARKS
   ========================================================= */
:root {
    --pgri-slate: #2f2a26 !important;
    --pgri-slate-2: #3b332d !important;
    --pgri-slate-3: #6f625a !important;
    --pgri-muted: #6f625a !important;
    --pgri-dark: #241f1b !important;
    --pgri-footer: #2b2622 !important;
    --pgri-footer-2: #3a302a !important;
    --pgri-terra: #c96b4b !important;
    --pgri-terra-dark: #a95136 !important;
    --pgri-sand: #f8f1ea !important;
    --pgri-cream: #fffaf5 !important;
    --pgri-olive: #8a9a5b !important;
}

html, body, body.public-body, body.civic-public-body, body.app-shell-authenticated {
    background:
        radial-gradient(circle at 8% 0%, rgba(201,107,75,.08), transparent 24rem),
        radial-gradient(circle at 92% 5%, rgba(138,154,91,.08), transparent 22rem),
        linear-gradient(180deg, #fffaf5 0%, #f8f1ea 100%) !important;
    color: var(--pgri-slate) !important;
}

.public-header, .public-header.civic-public-header, .civic-public-header {
    background: rgba(255,250,245,.98) !important;
    color: var(--pgri-slate) !important;
    border-bottom: 1px solid rgba(47,42,38,.10) !important;
    box-shadow: 0 10px 28px rgba(47,42,38,.07) !important;
}
.public-header *, .civic-public-header * { text-shadow: none !important; }
.public-header .brand strong, .civic-brand strong, .brand strong { color: var(--pgri-slate) !important; }
.public-header .brand small, .civic-brand small, .brand small { color: var(--pgri-muted) !important; }
.public-nav a:not(.btn), .civic-public-nav a:not(.btn) { color: var(--pgri-slate) !important; }
.public-nav a:not(.btn):hover, .civic-public-nav a:not(.btn):hover, .public-nav a:not(.btn).active { color: var(--pgri-terra) !important; }

/* CTA section that previously collided: force readable text */
.exact-cta {
    background: linear-gradient(135deg, #2b2622 0%, #3a302a 58%, #4a3931 100%) !important;
    border: 1px solid rgba(255,250,245,.08) !important;
    box-shadow: 0 20px 46px rgba(47,42,38,.18) !important;
    color: #fffaf5 !important;
}
.exact-cta *, .exact-cta span, .exact-cta h2, .exact-cta p {
    color: #fffaf5 !important;
    text-shadow: none !important;
    opacity: 1 !important;
}
.exact-cta span { color: #ffd8c7 !important; font-weight: 900 !important; }
.exact-cta p { color: rgba(255,250,245,.78) !important; }
.exact-cta .exact-primary-btn {
    background: linear-gradient(135deg, #c96b4b, #a95136) !important;
    color: #ffffff !important;
    border: 0 !important;
}

/* Footer becomes warm charcoal, not cool slate */
.public-footer, .civic-footer, footer {
    background: linear-gradient(135deg, #2b2622 0%, #3a302a 100%) !important;
    color: rgba(255,250,245,.86) !important;
    border-top: 1px solid rgba(255,250,245,.08) !important;
}
.public-footer *, .civic-footer *, footer * { text-shadow: none !important; }
.public-footer h4, .public-footer strong, .civic-footer h4, .civic-footer strong, footer h4, footer strong {
    color: #fffaf5 !important;
}
.public-footer p, .public-footer small, .public-footer li, .civic-footer p, .civic-footer small, .civic-footer li, footer p, footer small, footer li {
    color: rgba(255,250,245,.76) !important;
}
.public-footer a, .civic-footer a, footer a { color: #eaa48d !important; }
.public-footer a:hover, .civic-footer a:hover, footer a:hover { color: #fffaf5 !important; }
.civic-footer-bottom, .public-footer .civic-footer-bottom { border-top-color: rgba(255,250,245,.12) !important; }

/* Authenticated sidebar/topbar: warm dark, not cool dark */
.sidebar {
    background: linear-gradient(180deg, #2b2622 0%, #3a302a 100%) !important;
    border: 1px solid rgba(255,250,245,.08) !important;
    box-shadow: 0 24px 60px rgba(47,42,38,.24) !important;
}
.sidebar, .sidebar * { text-shadow: none !important; }
.sidebar .brand strong, .sidebar .section-label, .sidebar-user strong, .sidebar .nav-link, .sidebar h1, .sidebar h2, .sidebar h3, .sidebar h4 {
    color: #fffaf5 !important;
}
.sidebar .brand small, .sidebar-panel p, .sidebar-user small, .sidebar-metrics span, .sidebar small {
    color: rgba(255,250,245,.72) !important;
}
.sidebar-panel, .sidebar-group, .sidebar-panel-muted {
    background: rgba(255,250,245,.055) !important;
    border-color: rgba(255,250,245,.08) !important;
}
.nav-link:hover, .nav-link.active, .nav-link[aria-current="page"] {
    background: rgba(201,107,75,.22) !important;
    color: #fffaf5 !important;
}
.topbar {
    background: rgba(255,250,245,.96) !important;
    border: 1px solid rgba(47,42,38,.10) !important;
    box-shadow: 0 14px 30px rgba(47,42,38,.08) !important;
}
.page-title, .workspace-label, .topbar h1, .topbar strong { color: var(--pgri-slate) !important; }
.page-subtitle, .utility-chip, .topbar small { color: var(--pgri-muted) !important; }

/* Cards and form text */
.card, .exact-service-card, .exact-stats, .exact-activity-card, .exact-process article, .auth-card, .panel, .table-card, .inset-card, .strip-card, .summary-card, .data-card, .portal-feature-card, .portal-role-card, .portal-flow-card, .portal-stat-card, .portal-quick-link, .portal-flow-step, .detail-line, .empty-state-block, .empty-callout {
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,250,245,.97)) !important;
    border-color: rgba(47,42,38,.10) !important;
    box-shadow: 0 16px 38px rgba(47,42,38,.08) !important;
    color: var(--pgri-slate) !important;
}
.card h1, .card h2, .card h3, .card h4, .panel h1, .panel h2, .panel h3, .panel h4, .exact-service-card h3, .exact-activity-card h3, .exact-process h3 {
    color: var(--pgri-slate) !important;
}
.card p, .card small, .panel p, .panel small, .exact-service-card p, .exact-activity-card p, .exact-process p {
    color: var(--pgri-muted) !important;
}

.btn-primary, .exact-primary-btn, button.btn-primary, a.btn-primary {
    background: linear-gradient(135deg, #c96b4b, #a95136) !important;
    color: #ffffff !important;
    border-color: transparent !important;
    box-shadow: 0 14px 28px rgba(201,107,75,.24) !important;
}
.btn-dark, a.btn-dark, button.btn-dark { background: linear-gradient(135deg,#2b2622,#3a302a) !important; color:#fffaf5 !important; }
.btn-light, a.btn-light, button.btn-light { background:#fffaf5 !important; color:var(--pgri-slate) !important; border-color:rgba(47,42,38,.12) !important; }

/* Table/form */
table thead th, .table thead th { background:#f5ede4 !important; color:var(--pgri-slate) !important; }
table td, table th, .table td, .table th { color:var(--pgri-slate) !important; }
input:not([type="hidden"]), select, textarea { background:#fffaf5 !important; color:var(--pgri-slate) !important; border-color:rgba(47,42,38,.13) !important; }
input:not([type="hidden"]):focus, select:focus, textarea:focus { border-color:rgba(201,107,75,.55) !important; box-shadow:0 0 0 4px rgba(201,107,75,.13) !important; }

/* Warm illustration tone */
.exact-hero-art img, .exact-service-card img, .exact-activity-card img, .civic-hero-visual-card img, .activity-card img {
    filter: saturate(.95) sepia(.08) hue-rotate(-10deg) contrast(1.02) !important;
}

/* WhatsApp batch reminder improvements */
.check-option {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.75rem 0.85rem;
    border: 1px solid rgba(74, 57, 49, 0.12);
    border-radius: 14px;
    background: rgba(255, 250, 245, 0.72);
    color: var(--terra-slate, #2b2622);
    line-height: 1.45;
}

.check-option input[type="checkbox"] {
    width: 1.05rem;
    height: 1.05rem;
    margin-top: 0.13rem;
    accent-color: var(--terra-terracotta, #c96b4b);
    flex: 0 0 auto;
}

.check-option small {
    color: var(--terra-slate-soft, #6b5b52);
}

.compact-check {
    padding: 0.65rem 0.75rem;
}

.compact-form textarea {
    resize: vertical;
    min-height: 72px;
}

/* WhatsApp dynamic target enhancements */
.message-preview {
    white-space: pre-wrap;
    word-break: break-word;
    margin: 0.85rem 0 0;
    padding: 1rem;
    border-radius: 16px;
    background: rgba(248, 241, 234, 0.74);
    border: 1px solid rgba(74, 57, 49, 0.10);
    color: var(--terra-slate, #2b2622);
    font: 500 0.92rem/1.65 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.compact-check small,
.table-subtitle {
    color: var(--terra-slate-soft, #6d625a);
    line-height: 1.55;
}

/* WhatsApp reminder simple final: one house, one primary number */
.whatsapp-simple-page .lead,
.whatsapp-simple-page .subtle-value,
.whatsapp-simple-page small,
.whatsapp-simple-page .table-subtitle {
    word-break: normal;
    overflow-wrap: anywhere;
}

.whatsapp-simple-grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(360px, 0.8fr);
}

.wa-checkbox-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    max-height: 300px;
    overflow: auto;
    padding-right: 0.35rem;
}

.whatsapp-log-list {
    display: grid;
    gap: 0.85rem;
    margin-top: 1rem;
}

.whatsapp-log-item {
    display: grid;
    gap: 0.5rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(74, 57, 49, 0.10);
    background: rgba(255, 250, 245, 0.82);
    min-width: 0;
}

.whatsapp-log-item strong,
.whatsapp-log-item span,
.whatsapp-log-item small,
.whatsapp-log-item time {
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
    line-height: 1.55;
}

.wa-log-main,
.wa-log-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-width: 0;
}

.wa-log-main strong {
    color: var(--terra-slate, #2b2622);
    font-size: 0.98rem;
}

.wa-log-main span,
.wa-log-meta span,
.whatsapp-log-item small {
    color: var(--terra-slate-soft, #6d625a);
    font-size: 0.86rem;
}

.wa-log-meta .badge {
    flex: 0 0 auto;
}

@media (max-width: 1100px) {
    .whatsapp-simple-grid,
    .wa-checkbox-list {
        grid-template-columns: 1fr;
    }
}

/* WhatsApp final hosting form: only 3 target modes */
.whatsapp-final-page .wa-final-form {
    display: grid;
    gap: 1.05rem;
}

.wa-target-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.wa-target-card {
    display: flex;
    gap: 0.8rem;
    align-items: flex-start;
    padding: 1rem;
    border-radius: 20px;
    border: 1px solid rgba(74, 57, 49, 0.12);
    background: rgba(255, 250, 245, 0.82);
    cursor: pointer;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
    min-width: 0;
}

.wa-target-card:hover,
.wa-target-card.active {
    border-color: rgba(201, 107, 75, 0.45);
    box-shadow: 0 14px 30px rgba(74, 57, 49, 0.10);
    transform: translateY(-1px);
}

.wa-target-card input {
    margin-top: 0.18rem;
    accent-color: var(--terra-terracotta, #c96b4b);
    flex: 0 0 auto;
}

.wa-target-card strong,
.wa-target-card small {
    display: block;
    word-break: normal;
    overflow-wrap: normal;
}

.wa-target-card strong {
    color: var(--terra-slate, #2b2622);
    margin-bottom: 0.25rem;
}

.wa-target-card small {
    color: var(--terra-slate-soft, #6d625a);
    line-height: 1.5;
}

.wa-action-row {
    justify-content: flex-end;
    border-top: 1px solid rgba(74, 57, 49, 0.10);
    padding-top: 1rem;
}

.wa-preview-grid {
    display: grid;
    gap: 0.95rem;
}

.wa-log-table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid rgba(74, 57, 49, 0.10);
    border-radius: 18px;
    background: rgba(255, 250, 245, 0.74);
}

.wa-log-table {
    width: 100%;
    min-width: 860px;
    border-collapse: collapse;
    table-layout: auto;
}

.wa-log-table th,
.wa-log-table td {
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
    vertical-align: middle;
    font-size: 0.9rem;
    line-height: 1.45;
}

.wa-log-table td:nth-child(3),
.wa-log-table td:nth-child(6) {
    white-space: normal;
    min-width: 180px;
}

@media (max-width: 980px) {
    .wa-target-options,
    .wa-checkbox-list {
        grid-template-columns: 1fr;
    }

    .wa-action-row {
        justify-content: stretch;
    }

    .wa-action-row .btn {
        width: 100%;
    }
}

/* WhatsApp reminder UI final tidy-up */
.whatsapp-final-page .wa-final-form .table-toolbar {
    align-items: flex-start;
    gap: 1rem;
}

.wa-target-options {
    align-items: stretch;
}

.wa-target-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.9rem;
    min-height: 170px;
    padding: 1.15rem 1.2rem;
}

.wa-target-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.wa-target-card input[type="radio"] {
    margin: 0;
    width: 24px;
    height: 24px;
}

.wa-target-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.72rem;
    border-radius: 999px;
    background: rgba(201, 107, 75, 0.10);
    border: 1px solid rgba(201, 107, 75, 0.20);
    color: var(--terra-terracotta, #c96b4b);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.wa-target-copy {
    display: grid;
    gap: 0.45rem;
    width: 100%;
}

.wa-target-card strong,
.wa-target-copy strong {
    display: block;
    font-size: 1.2rem;
    line-height: 1.3;
    letter-spacing: -0.01em;
    color: var(--terra-slate, #2b2622);
}

.wa-target-card small,
.wa-target-copy small {
    display: block;
    font-size: 0.96rem;
    line-height: 1.65;
    color: var(--terra-slate-soft, #6d625a);
    white-space: normal;
    overflow-wrap: anywhere;
}

.wa-target-card.active .wa-target-pill {
    background: linear-gradient(135deg, rgba(201, 107, 75, 0.18), rgba(255, 250, 245, 0.82));
    border-color: rgba(201, 107, 75, 0.35);
}

.wa-log-table-wrap {
    border-radius: 20px;
}

.wa-log-table {
    min-width: 980px;
}

.wa-log-table thead th {
    font-size: 0.9rem;
    line-height: 1.35;
    white-space: nowrap;
}

.wa-log-table td,
.wa-log-table th {
    padding: 0.9rem 1rem;
}

.wa-log-table td {
    font-size: 0.94rem;
    line-height: 1.55;
    color: var(--terra-slate, #2b2622);
    vertical-align: top;
}

.wa-log-table td:first-child {
    min-width: 170px;
    font-variant-numeric: tabular-nums;
}

.wa-log-table td:nth-child(2) {
    min-width: 90px;
}

.wa-log-table td:nth-child(3) {
    min-width: 220px;
}

.wa-log-table td:nth-child(4) {
    min-width: 140px;
    font-variant-numeric: tabular-nums;
}

.wa-log-table td:nth-child(6) {
    min-width: 260px;
}

@media (max-width: 1200px) {
    .wa-target-options {
        grid-template-columns: 1fr;
    }

    .wa-target-card {
        min-height: unset;
    }
}
