
:root {
    --ink: #132b37;
    --navy: #102736;
    --green: #21965a;
    --green-dark: #167748;
    --muted: #687b88;
    --line: #e3ebee;
    --surface: #f5f8fa;
    --white: #ffffff;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #fff; color: var(--ink); font-family: 'DM Sans', sans-serif; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.container { width: min(1320px, calc(100% - 64px)); margin-inline: auto; }
h1, h2, h3, h4, .brand-name { font-family: 'Manrope', sans-serif; }
.site-header { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--line); backdrop-filter: blur(14px); }
.nav-shell { min-height: 82px; display: flex; align-items: center; gap: 32px; }
.brand { display: inline-flex; align-items: center; gap: 11px; white-space: nowrap; }
.brand-icon { width: 43px; height: 43px; }
.brand-name { font-size: 20px; font-weight: 800; letter-spacing: -1.1px; }
.brand-name span { color: var(--green); }
.nav-links { margin-left: auto; display: flex; gap: 29px; }
.nav-links a, .login-link { font-size: 13px; font-weight: 700; }
.nav-links a:hover, .login-link:hover { color: var(--green); }
.nav-actions { display: flex; align-items: center; gap: 21px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 16px; border-radius: 10px; padding: 14px 24px; font-size: 13px; font-weight: 800; transition: transform .2s, background .2s; white-space: nowrap; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { color: white; background: var(--green); box-shadow: 0 8px 20px rgba(30,147,86,.14); }
.btn-primary:hover { background: var(--green-dark); }
.btn-small { padding: 12px 18px; }
.btn-outline { background: white; border: 1px solid #b9cbd0; }
.btn-light { color: var(--green-dark); background: white; }
.hero { overflow: hidden; padding: 105px 0 100px; background: radial-gradient(ellipse at 85% 20%,#e8f6f1 0,transparent 45%),linear-gradient(110deg,#f6fbf8,#fff 72%); }
.hero-layout { display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 74px; }
.eyebrow, .section-kicker { font-size: 11px; font-weight: 800; letter-spacing: 2px; color: var(--green-dark); }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; background: #e1f2e9; padding: 10px 17px; border-radius: 30px; letter-spacing: 1.3px; }
.status-dot { background: var(--green); height: 8px; width: 8px; border-radius: 50%; }
.hero h1 { margin: 27px 0; font-size: clamp(42px,4.5vw,70px); line-height: 1.13; letter-spacing: -3.6px; font-weight: 800; }
.hero h1 em { font-style: normal; color: var(--green); }
.hero-copy > p { max-width: 530px; color: #607784; font-size: 17px; line-height: 1.85; }
.hero-buttons { display: flex; gap: 12px; margin-top: 31px; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 19px; margin-top: 27px; font-size: 11px; color: #56737a; }
.hero-proof span:before { content: '✓'; color: var(--green); font-weight: 800; margin-right: 6px; }
.hero-visual { position: relative; padding: 25px 0 15px 30px; }
.hero-photo { overflow: hidden; border-radius: 27px; box-shadow: 0 24px 60px rgba(13,43,40,.12); }
.hero-photo img { width: 100%; aspect-ratio: 1.34; object-fit: cover; }
.floating-note, .hero-stat { position: absolute; background: white; box-shadow: 0 18px 40px rgba(20,49,50,.13); border: 1px solid var(--line); border-radius: 15px; padding: 14px 17px; }
.floating-note { top: 0; left: -15px; display: flex; align-items: center; gap: 12px; }
.note-icon { display: grid; place-items: center; width: 40px; height: 40px; background: #e3f5e9; border-radius: 10px; color: var(--green); font-size: 21px; }
.floating-note strong, .hero-stat strong { display: block; font-size: 14px; }
.floating-note small, .hero-stat span { display: block; color: var(--muted); font-size: 11px; }
.hero-stat { right: -20px; bottom: -3px; }
.trust-strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.trust-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; padding-block: 24px; }
.trust-inner > span { font-size: 10px; color: #71838d; font-weight: 800; letter-spacing: 1.5px; }
.trust-inner strong { font-size: 13px; }
.section { padding: 108px 0; }
.section-heading { max-width: 690px; margin: 0 auto 46px; text-align: center; }
.section-heading h2 { font-size: clamp(30px,3vw,45px); letter-spacing: -1.9px; line-height: 1.2; margin: 15px 0; }
.section-heading p { color: var(--muted); font-size: 16px; margin: 0; }
.feature-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.feature-card { padding: 30px; border: 1px solid var(--line); border-radius: 17px; background: #fff; transition: box-shadow .2s,transform .2s; }
.feature-card:hover { transform: translateY(-4px); box-shadow: 0 20px 45px rgba(15,44,53,.07); }
.feature-icon { display: grid; place-items: center; width: 45px; height: 45px; background: #e6f5ec; color: var(--green-dark); border-radius: 12px; font-family: 'Manrope'; font-weight: 800; }
.feature-card h3 { font-size: 18px; letter-spacing: -.5px; margin: 19px 0 8px; }
.feature-card p { font-size: 14px; color: var(--muted); margin: 0; }
.preview-section { background: #f4f8fa; }
.dashboard-frame { display: grid; grid-template-columns: 220px minmax(0,1fr); overflow: hidden; border: 1px solid #dbe5eb; border-radius: 17px; box-shadow: 0 25px 70px rgba(14,42,56,.12); background: #fff; }
.demo-sidebar { background: #102838; color: #dce6ec; padding: 23px 14px; }
.demo-logo { display: flex; gap: 8px; align-items: center; margin-bottom: 37px; padding: 0 4px; }
.demo-logo img { width: 34px; height: 34px; }
.demo-logo strong { display: block; font-size: 12px; letter-spacing: -.5px; color: #fff; }
.demo-logo small { display: block; font-size: 8px; color: #9cb0bd; }
.demo-nav { display: flex; gap: 13px; align-items: center; padding: 11px 12px; border-radius: 7px; font-size: 11px; margin-bottom: 4px; }
.demo-nav.active { background: #269849; color: #fff; }
.demo-nav-icon { width: 17px; text-align: center; font-size: 17px; line-height: 1; }
.demo-main { min-width: 0; background: #f5f8fb; }
.demo-toolbar { height: 48px; display: flex; justify-content: flex-end; align-items: center; gap: 10px; padding: 0 24px; background: #eef3f7; border-bottom: 1px solid #e4ebf1; font-size: 10px; }
.demo-search { margin-right: 15px; background: #fff; color: #8c9aa9; border: 1px solid #dce5ee; border-radius: 6px; padding: 7px 15px; width: 200px; }
.demo-avatar { width: 27px; height: 27px; border-radius: 50%; display: grid; place-items: center; background: #526675; color: #fff; }
.demo-content { padding: 23px; }
.demo-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 19px; }
.demo-top h3 { font-size: 28px; letter-spacing: -1.2px; margin: 0; line-height: 1.15; }
.demo-top p { margin: 3px 0 0; color: #7d8d9c; font-size: 11px; }
.demo-add { padding: 9px 13px; background: #239e4a; border-radius: 6px; color: white; font-size: 10px; font-weight: 700; }
.demo-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 11px; margin-bottom: 17px; }
.demo-metric { background: #fff; border: 1px solid #e0e8f0; border-radius: 7px; padding: 14px 10px; display: flex; align-items: flex-start; gap: 9px; min-width: 0; }
.metric-icon { display: grid; place-items: center; flex: 0 0 36px; height: 36px; border-radius: 50%; font-size: 20px; font-weight: 700; }
.metric-icon.green { color: #199953; background: #e0f4e9; }.metric-icon.blue { color: #1665d5; background: #e6f0ff; }.metric-icon.gray { color: #486274; background: #e9eff3; }
.demo-metric small { display: block; font-size: 10px; color: #546779; }
.demo-metric strong { display: block; font-size: 23px; line-height: 1.3; letter-spacing: -.8px; }
.demo-metric em { display: block; color: #13954c; font-size: 9px; font-style: normal; }
.demo-middle { display: grid; grid-template-columns: minmax(0,2.35fr) minmax(185px,1fr); gap: 14px; margin-bottom: 15px; }
.demo-panel { min-width: 0; background: white; border: 1px solid #e0e8ef; border-radius: 8px; padding: 15px; }
.demo-panel-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 13px; }
.demo-panel-head h4 { font-size: 14px; margin: 0; letter-spacing: -.4px; }
.demo-panel-head > span { color: #1464c7; font-size: 10px; }
.demo-property-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.demo-property-card { min-width: 0; border: 1px solid #e1e8ed; border-radius: 7px; overflow: hidden; }
.demo-property-card > img { width: 100%; aspect-ratio: 1.72; object-fit: cover; }
.demo-property-body { padding: 10px; }
.demo-property-body strong { display: block; font-size: 11px; line-height: 1.3; }
.demo-property-body small { display: block; color: #728395; font-size: 9px; margin: 3px 0 7px; }
.demo-chip { display: inline-block; color: #2a628f; background: #eaf3fb; border-radius: 5px; padding: 2px 5px; font-size: 9px; }
.demo-status { display: block; color: #0c944d; font-size: 10px; margin: 7px 0; }
.demo-status:before { content: ''; display: inline-block; width: 7px; height: 7px; background: #159b55; border-radius: 50%; margin-right: 4px; }
.demo-view { display: block; text-align: center; background: #f1f5f8; border: 1px solid #e2e9ee; border-radius: 5px; padding: 6px; font-size: 9px; }
.demo-action { border: 1px solid #e0e7ee; background: #f9fbfd; border-radius: 6px; padding: 7px; display: flex; gap: 9px; align-items: center; font-size: 10px; margin-bottom: 7px; }
.demo-action span { display: grid; place-items: center; width: 24px; height: 24px; flex: 0 0 24px; border-radius: 5px; color: #1664c5; background: #e7f0ff; font-weight: 800; font-size: 15px; }
.demo-bottom { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(245px,1fr); gap: 14px; }
.demo-table-wrap { overflow-x: auto; }
.demo-table { width: 100%; border-collapse: collapse; font-size: 10px; text-align: left; white-space: nowrap; }
.demo-table th { background: #eff4f8; font-weight: 700; padding: 8px; }
.demo-table td { padding: 9px 8px; border-bottom: 1px solid #e6edf2; }
.demo-table .amount { color: #0a9651; font-weight: 700; }
.tag { padding: 4px 6px; border-radius: 5px; }.tag.payment { background: #e3f6e8; color: #188849; }.tag.maintenance { background: #fff0dd; color: #b86c19; }.tag.lease { background: #e5f0ff; color: #2767c2; }
.demo-event { display: flex; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid #e8edf2; }
.demo-event:last-child { border: 0; }
.date-box { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 32px; height: 36px; flex: 0 0 32px; border: 1px solid #e4e8ec; border-radius: 5px; font-weight: 800; font-size: 13px; line-height: 1.15; }
.date-box small { order: -1; display: block; background: #ffced1; width: 100%; text-align: center; color: #c53341; font-size: 7px; }
.demo-event > div { min-width: 0; flex: 1; }.demo-event strong, .demo-event small { display: block; font-size: 10px; }.demo-event small { color: #7c8a98; }.demo-event b { font-size: 10px; color: #168d4b; }
.preview-caption { color: #8495a0; text-align: center; font-size: 11px; margin: 18px 0 0; }
.steps-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; }
.steps-grid > div { border-top: 1px solid #dbe7e4; padding-top: 22px; }
.step-num { font-size: 12px; color: var(--green); font-weight: 800; }.steps-grid h3 { margin: 10px 0; font-size: 19px; }.steps-grid p { margin: 0; font-size: 14px; color: var(--muted); }
.cta-section { padding: 65px 0; background: #123b37; color: white; }
.cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; }.cta-section .section-kicker { color: #80e3ac; }.cta-section h2 { margin: 10px 0; font-size: clamp(26px,3vw,40px); letter-spacing: -1.5px; }.cta-section p { color: #c4d9d1; margin: 0; }
.site-footer { padding: 60px 0 20px; background: #102736; color: white; }.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 60px; }.site-footer .brand-name span { color: #5dd895; }.site-footer p { max-width: 330px; color: #b6c5cd; font-size: 13px; }.footer-links h3 { font-size: 13px; }.footer-links a { display: block; margin: 10px 0; color: #b6c5cd; font-size: 13px; }.footer-bottom { border-top: 1px solid #2d4654; margin-top: 45px; padding-top: 20px; font-size: 11px; color: #b6c5cd; }
@media(max-width:1150px) { .nav-links { gap: 15px; }.nav-shell { gap: 16px; }.dashboard-frame { grid-template-columns: 170px minmax(0,1fr); }.demo-content { padding: 14px; }.demo-metric { flex-direction: column; }.demo-middle { grid-template-columns: minmax(0,1fr); }.demo-actions-panel { display: none; } }
@media(max-width:850px) { .container { width: min(100% - 36px,1320px); }.nav-shell { flex-wrap: wrap; padding: 12px 0; }.nav-links { order: 3; width: 100%; justify-content: center; margin: 0; flex-wrap: wrap; }.nav-actions { margin-left: auto; }.hero { padding: 60px 0; }.hero-layout { grid-template-columns: 1fr; gap: 45px; }.hero-visual { max-width: 600px; margin: auto; }.feature-grid { grid-template-columns: repeat(2,1fr); }.dashboard-frame { grid-template-columns: 135px minmax(0,1fr); }.demo-sidebar { padding: 12px 6px; }.demo-logo strong { font-size: 9px; }.demo-logo small { display: none; }.demo-nav { font-size: 9px; gap: 5px; }.demo-metrics { grid-template-columns: repeat(2,1fr); }.demo-bottom { grid-template-columns: 1fr; } }
@media(max-width:620px) { .brand-name { font-size: 17px; }.brand-icon { width: 36px; height: 36px; }.nav-links { gap: 12px; }.nav-links a { font-size: 11px; }.login-link { display: none; }.btn-small { padding: 9px 11px; }.hero h1 { letter-spacing: -2px; }.hero-buttons { flex-wrap: wrap; }.section { padding: 70px 0; }.feature-grid, .steps-grid, .footer-grid { grid-template-columns: 1fr; }.dashboard-frame { display: block; }.demo-sidebar { display: none; }.demo-content { padding: 10px; }.demo-toolbar { height: 35px; }.demo-top h3 { font-size: 21px; }.demo-property-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; }.demo-property-body { padding: 5px; }.demo-property-body strong { font-size: 9px; }.demo-property-body small { font-size: 7px; }.demo-view { font-size: 8px; }.demo-metric { padding: 9px; }.demo-metric strong { font-size: 20px; }.cta-inner { flex-direction: column; align-items: flex-start; } }


/* =========================================================
   APPROVED MOCKUP MATCH - PUBLIC HEADER + PHOTOGRAPHIC HERO
   ========================================================= */
:root { --navy:#0b2333; --green:#129554; --green-dark:#0c7b45; }
body { font-family:'DM Sans',sans-serif; }
.site-header { background:#0b2333; border-bottom:0; }
.nav-shell { min-height:82px; }
.brand-name,.nav-links a,.login-link { color:#fff; }
.brand-name span { color:#17a45b; }
.nav-links a:hover,.login-link:hover { color:#73dfa6; }
.brand-icon { width:44px;height:44px; }
.nav-actions .btn-primary { background:#118b4d; }
.hero { position:relative; padding:0; overflow:hidden; background:#edf5fa; }
.hero:before {
    content:""; position:absolute; inset:0;
    background:linear-gradient(90deg,#eaf4fb 0%,rgba(234,244,251,.98) 30%,rgba(234,244,251,.9) 38%,rgba(234,244,251,.16) 53%,transparent 66%),
      url('/images/properties/wawatam-barn.png') center 49% / cover no-repeat;
}
.hero-layout { position:relative; display:grid;grid-template-columns: 52% 48%;gap:0; min-height:430px; align-items:center; }
.hero-copy { position:relative;z-index:2; padding:45px 0 48px; }
.hero h1 { font-size:clamp(42px,4vw,61px);line-height:1.06;letter-spacing:-2.9px;margin:14px 0 15px; }
.hero-copy>p { font-size:16px;line-height:1.55;max-width:570px;color:#3d586b;margin:0; }
.hero-buttons { margin-top:20px; }
.hero .btn { border-radius:6px; padding:14px 24px;font-size:14px; }
.eyebrow { background:#e0f4ed;color:#123b37;letter-spacing:.3px;font-size:11px;padding:7px 13px; }
.hero-visual { height:100%;min-height:430px;padding:0; }
.hero-benefits { position:absolute;right:0;top:50%;transform:translateY(-50%);width:240px;display:grid;gap:15px; }
.benefit-card { display:flex;gap:13px;align-items:center;background:rgba(255,255,255,.97);border:1px solid #e7ebee;box-shadow:0 8px 30px rgba(7,27,40,.12);padding:14px;border-radius:12px; }
.benefit-icon { display:grid;place-items:center;flex:none;width:45px;height:45px;background:#e5f4eb;color:#178e55;border-radius:50%;font-size:25px; }
.benefit-card strong {display:block;color:#0b2532;font-size:13px;line-height:1.3}
.benefit-card small {display:block;color:#506779;font-size:10px;line-height:1.4;margin-top:3px}
.trust-strip { background:#fff; }
.preview-section { background:#f5f8fb; }
.preview-section .container { width:min(1490px,calc(100% - 36px)); }
.dashboard-frame { grid-template-columns:240px minmax(0,1fr);border-radius:14px; }
.demo-sidebar {background:#0b2333;}
.demo-property-card img { object-fit:cover; }
@media(max-width:1100px) {
    .hero-layout {grid-template-columns:58% 42%;}
    .hero-benefits {right:0;width:210px;}
    .benefit-card {padding:10px;}
}
@media(max-width:760px) {
    .hero:before {background:linear-gradient(90deg,rgba(235,246,251,.96),rgba(235,246,251,.8)),url('/images/properties/wawatam-barn.jpg') center / cover no-repeat;}
    .hero-layout {display:block;min-height:0;}
    .hero-copy {padding:65px 0 25px;}
    .hero h1 {font-size:clamp(38px,9vw,56px);}
    .hero-visual {height:auto;min-height:0;padding:0 0 25px;}
    .hero-benefits {position:static;transform:none;width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
    .benefit-card {display:block;padding:12px;}
    .benefit-icon {margin-bottom:8px;}
    .dashboard-frame {grid-template-columns:180px minmax(760px,1fr);overflow-x:auto;}
}
@media(max-width:520px) {
    .hero-benefits {grid-template-columns:1fr;}
    .benefit-card {display:flex;}
    .benefit-icon {margin-bottom:0;}
}

/* ===== APPROVED COMPOSITION CORRECTIONS ===== */
.ui-icon {width:20px;height:20px;display:inline-block;vertical-align:middle;flex:none}
.demo-nav-icon .ui-icon {width:20px;height:20px}
.metric-icon .ui-icon {width:23px;height:23px}
.demo-action .ui-icon {width:16px;height:16px}
.benefit-icon .ui-icon {width:23px;height:23px}
.demo-search .ui-icon {width:14px;height:14px;margin-right:8px}
.demo-notification {position:relative;display:inline-flex;align-items:center;margin:0 12px}
.demo-notification .ui-icon {width:19px;height:19px}
.demo-notification b {position:absolute;top:-8px;right:-7px;background:#e93535;color:#fff;font-size:8px;border-radius:50%;padding:1px 4px}
.section {padding:54px 0}
.section-heading {margin-bottom:28px}
#features {padding:54px 0 65px}
#features .section-heading {margin-bottom:30px}
.feature-card {padding:22px 24px;border-radius:13px}
.feature-card h3 {margin:14px 0 7px}
.feature-grid {gap:15px}
.preview-section {padding:8px 0 32px}
.preview-section .container {width:min(1500px,calc(100% - 18px));max-width:none}
.dashboard-frame {grid-template-columns:245px minmax(0,1fr);border-radius:9px;box-shadow:0 10px 25px rgba(11,35,51,.1)}
.demo-sidebar {padding:24px 14px}
.demo-logo {margin-bottom:32px}
.demo-nav {font-size:12px;padding:11px 12px}
.demo-nav-icon {width:22px}
.demo-content {padding:20px 24px}
.demo-metric {min-height:95px;padding:17px 14px;align-items:center}
.demo-metric strong {font-size:27px}
.demo-middle {grid-template-columns:minmax(0,2.25fr) minmax(255px,1fr)}
.demo-actions-panel {display:block}
.demo-bottom {grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr)}
.demo-panel {padding:15px}
.demo-property-card > img {aspect-ratio:1.8}
.demo-property-body {padding:10px}
.demo-property-body strong {font-size:12px}
.demo-property-body small {font-size:10px}
.demo-action {padding:8px 10px;margin-bottom:7px}
.demo-action span {font-size:13px}
.demo-toolbar {height:42px}
.demo-search {display:flex;align-items:center}
.hero-layout {min-height:385px}
.hero-copy {padding:28px 0 32px}
.hero-visual {min-height:385px}
.hero h1 {font-size:clamp(40px,3.9vw,57px);margin:12px 0 13px}
.hero-copy>p {font-size:15px;max-width:555px}
.hero-benefits {gap:12px}
.benefit-card {min-height:75px}
@media(max-width:1150px) {
 .dashboard-frame {grid-template-columns:205px minmax(0,1fr)}
 .demo-middle {grid-template-columns:minmax(0,2fr) minmax(220px,1fr)}
 .demo-metric {flex-direction:row}
 .demo-actions-panel {display:block}
}
@media(max-width:850px) {
 .hero-layout {display:block;min-height:0}
 .hero-copy {padding:50px 0 20px}
 .hero-visual {min-height:0}
 .hero-benefits {position:static;transform:none;width:100%;display:grid;grid-template-columns:repeat(3,1fr);padding-bottom:20px}
 .dashboard-frame {display:grid;grid-template-columns:205px minmax(1000px,1fr);overflow-x:auto}
 .demo-sidebar {display:block}
 .demo-metrics {grid-template-columns:repeat(4,1fr)}
 .demo-middle {grid-template-columns:minmax(0,2.25fr) minmax(255px,1fr)}
 .demo-bottom {grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr)}
}
@media(max-width:620px) {
 .dashboard-frame {display:grid;grid-template-columns:170px minmax(900px,1fr)}
 .demo-sidebar {display:block}
 .demo-metrics {grid-template-columns:repeat(4,1fr)}
 .demo-actions-panel {display:block}
 .demo-property-grid {gap:10px}
 .hero-benefits {grid-template-columns:1fr}
}

/* === HEADER: MATCH APPROVED SCREENSHOT === */
.site-header { height:56px; min-height:56px; background:#0b2333; border:0; box-shadow:none; }
.site-header .nav-shell { height:56px; min-height:56px; padding:0; display:flex; align-items:center; flex-wrap:nowrap; gap:18px; }
.site-header .brand { display:inline-flex; align-items:center; flex:none; gap:8px; text-decoration:none; line-height:1; }
.site-header .brand-icon { display:block; width:34px; height:34px; flex:none; }
.site-header .brand-text { display:flex; flex-direction:column; align-items:flex-start; gap:3px; white-space:nowrap; }
.site-header .brand-name { color:#fff; font-family:'Manrope',sans-serif; font-size:16px; font-weight:800; letter-spacing:-.6px; line-height:1.05; }
.site-header .brand-name span { color:#17a45b; }
.site-header .brand-tagline { color:#c3d1d9; font-family:'DM Sans',sans-serif; font-size:9px; font-weight:400; line-height:1.15; letter-spacing:0; }
.site-header .nav-links { display:flex; align-items:center; justify-content:center; gap:26px; margin-left:auto; width:auto; order:initial; flex-wrap:nowrap; align-self:stretch; }
.site-header .nav-links a { position:relative; display:inline-flex; align-items:center; padding:0 0 1px; color:#fff; font-size:10px; font-weight:700; white-space:nowrap; text-decoration:none; }
.site-header .nav-links a.active:after { content:""; position:absolute; height:3px; bottom:0; left:0; right:0; background:#15a65b; border-radius:3px; }
.site-header .nav-actions { display:flex; align-items:center; gap:22px; margin-left:auto; flex:none; }
.site-header .login-link { display:inline; color:#fff; font-size:10px; font-weight:700; white-space:nowrap; }
.site-header .nav-actions .btn-small { display:inline-flex; align-items:center; justify-content:center; gap:12px; background:#118b4d; color:#fff; border:0; border-radius:6px; font-size:10px; font-weight:700; line-height:1; padding:0 17px; height:34px; min-height:34px; box-shadow:none; white-space:nowrap; }
@media(max-width:950px) {
 .site-header .nav-links {gap:13px}
 .site-header .nav-actions {gap:12px}
 .site-header .brand-name {font-size:14px}
}
@media(max-width:740px) {
 .site-header {height:auto;min-height:56px}
 .site-header .nav-shell {height:auto;min-height:56px;flex-wrap:wrap;padding:8px 0;row-gap:10px}
 .site-header .nav-links {order:3;width:100%;height:30px;justify-content:space-between;margin:0;gap:8px}
 .site-header .nav-links a {font-size:10px}
 .site-header .nav-actions {margin-left:auto}
 .site-header .login-link {display:none}
}


/* Public login hamburger */
.site-header .public-account { position:relative; display:block; flex:none; }
.site-header .public-hamburger { display:flex; align-items:center; justify-content:center; width:42px; height:38px; padding:0; border:1px solid rgba(255,255,255,.35); border-radius:6px; background:transparent; cursor:pointer; list-style:none; }
.site-header .public-hamburger::-webkit-details-marker { display:none; }
.site-header .hamburger-lines { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:22px; height:22px; }
.site-header .hamburger-lines span { display:block; width:22px; height:2px; flex:none; background:#fff; border-radius:2px; transform:none; transition:none; }
.site-header .public-hamburger:hover { background:rgba(255,255,255,.12); }
.site-header .public-account-dropdown { position:absolute; top:calc(100% + 10px); right:0; width:170px; padding:7px; background:#fff; border:1px solid #dce5e9; border-radius:8px; box-shadow:0 10px 28px rgba(0,0,0,.18); z-index:1000; }
.site-header .public-account:not([open]) .public-account-dropdown { display:none; }
.site-header .public-account-dropdown a { display:block; padding:11px 13px; color:#132b37; font-size:13px; font-weight:700; text-decoration:none; border-radius:5px; }
.site-header .public-account-dropdown a:hover { background:#e6f5ec; color:#0c7b45; }
