/* Engravista — Admin + Public shared styles (CORE)
   =============================================================================
   This single file includes:
     1) Site-wide tokens, base, helpers, and shared components (Admin + Public)
     2) Admin UI modules (uploads, tables, categories)
     3) Public homepage request form + gallery/lightbox (+ horizontal header)
   Cleanup: Removed legacy side navigation rules (no left sidebar on public).
*/

/* =============================================================================
   SECTION 0 — DESIGN TOKENS
   ========================================================================== */
:root{
  --ev-bg:#0b0d10;
  --ev-card:#111318;
  --ev-line:#1f242b;
  --ev-fg:#e5e7eb;
  --ev-accent:#FF0066;
  --ev-muted:#a1acb6;
  --ev-overlay:rgba(0,0,0,.55);

  /* Back-compat aliases */
  --bg:var(--ev-bg);
  --card:var(--ev-card);
  --line:var(--ev-line);
  --fg:var(--ev-fg);
  --accent:var(--ev-accent);
  --muted:var(--ev-muted);
  --chip:#0b0d10;
  --overlay:var(--ev-overlay);

  /* Sticky header + logo (CLS control) */
  --ev-logo-w:250px;   /* update if your actual logo intrinsic size differs */
  --ev-logo-h:72px;

  /* Legacy compatibility */
  --ev-nav-w:270px;
  --ev-topbar-h:56px;
}
@media (max-width:1200px){ :root{ --ev-nav-w:280px; } }
@media (max-width:980px) { :root{ --ev-nav-w:280px; } }

/* =============================================================================
   SECTION 1 — GLOBAL BASE + HELPERS (shared)
   ========================================================================== */
*{ box-sizing:border-box; }
html,body{ height:100%; }
html{ scrollbar-gutter:stable both-edges; }          /* prevent layout shift on scrollbar */
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;
  margin:0; background:var(--ev-bg); color:var(--ev-fg);
}
.wrap{ margin:0 auto; padding:22px; }

/* A11y helpers */
.visually-hidden,.sr-only{
  position:absolute !important; width:1px !important; height:1px !important;
  padding:0 !important; margin:-1px !important; overflow:hidden !important;
  clip:rect(0,0,0,0) !important; clip-path:inset(50%) !important; white-space:nowrap !important; border:0 !important;
}

/* Typography */
h1,h2,h3,h4,h5,h6{ color:var(--ev-accent); }
p{ color:#ccc; }
.muted{ color:var(--ev-muted); }

/* Generic UI blocks */
.card{ background:var(--ev-card); border:1px solid var(--ev-line); border-radius:14px; padding:16px; }
.grid{ display:grid; grid-template-columns:1fr; gap:14px; }
@media (min-width:960px){ .grid{ grid-template-columns:1fr 1fr; } }
.kpis{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; }
.stat{ background:var(--ev-card); border:1px dashed var(--ev-line); border-radius:12px; padding:12px; }
.stat .big{ font-size:26px; font-weight:700; }
.list{ margin:0; padding:0; list-style:none; }
.row{ display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--ev-line); padding:8px 0; }
.row:last-child{ border-bottom:0; }
.tag{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border:1px solid var(--ev-line); border-radius:999px; background:var(--chip); margin:4px 6px 0 0; }
.tag span{ opacity:.9; }
.flex{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.space{ height:8px; }

/* Header (Admin & shared shells) */
.ev-admin-header{
  display:flex; align-items:center; gap:12px;
  padding:12px 16px; border-bottom:1px solid var(--ev-line);
  background:var(--ev-bg); color:var(--ev-fg);
}
.ev-burger{
  display:inline-flex; align-items:center; background:transparent; gap:8px; border:0;
  color:var(--ev-accent); border-radius:10px; padding:8px 10px; cursor:pointer;
}
.ev-burger .lines{ width:18px; height:2px; background:var(--ev-accent); position:relative; display:block; }
.ev-burger .lines::before,.ev-burger .lines::after{ content:""; position:absolute; left:0; width:18px; height:2px; background:#fff; }
.ev-burger .lines::before{ top:-6px; } .ev-burger .lines::after{ top:6px; }
.ev-admin-brand{ display:flex; align-items:center; gap:10px; min-width:0; text-decoration:none; color:var(--ev-fg); }
.ev-admin-brand img{ display:block; height:50px; width:auto; }

/* Footer (Admin & shared shells) */
.ev-admin-footer{
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  padding:12px 16px; border-top:1px solid var(--ev-line);
  background:var(--ev-bg); color:var(--ev-fg);
}
.ev-admin-footer .note{ font-size:12px; opacity:.9; }
.ev-admin-footer .footer-logo{ display:block; height:18px; width:auto; opacity:.9; }

/* Drawer (Admin shell) */
.ev-drawer-overlay{ position:fixed; inset:0; background:var(--ev-overlay); opacity:0; pointer-events:none; transition:.2s; z-index:999; }
.ev-drawer-overlay.open{ opacity:1; pointer-events:auto; }
.ev-drawer{
  position:fixed; top:0; left:0; height:100%; width:280px;
  background:var(--ev-card); border-right:1px solid var(--ev-line);
  transform:translateX(-100%); transition:transform .25s; z-index:1000;
  display:flex; flex-direction:column;
}
.ev-drawer.open{ transform:translateX(0); }
.ev-drawer nav{ padding:8px 10px 16px; overflow:auto; }
.ev-drawer-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 14px; border-bottom:1px solid var(--ev-line);
}
.ev-brand-link{ display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.ev-logo{ display:block; height:75px; width:auto; }

/* Menu groups */
.ev-menu-section{ margin:10px 0; }
.ev-menu-section h4{ margin:8px 8px 6px; color:#cbd5e1; font-size:12px; text-transform:uppercase; letter-spacing:.06em; }
.ev-menu a{ display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:10px; color:#e5e7eb; text-decoration:none; }
.ev-menu a:hover{ background:#1a1f27; }
.ev-menu a .dot{ width:6px; height:6px; border-radius:50%; background:var(--ev-accent); display:inline-block; }

/* Buttons — unified */
.ev-btn, a.btn, button.btn,
.ev-btn.secondary, a.btn.secondary, button.btn.secondary,
.ev-drawer .ev-xbtn{
  background:var(--ev-accent); border:1px solid var(--ev-accent);
  color:#fff; padding:8px 12px; border-radius:10px; text-decoration:none; display:inline-block; cursor:pointer;
}
.ev-btn2{
  background:#fff !important; border:1px solid #ff0066 !important; color:#000;
  padding:8px 12px; border-radius:10px; text-decoration:none; display:inline-block; cursor:pointer; font-weight:600;
}
.ev-btn:hover, a.btn:hover, button.btn:hover,
.ev-btn.secondary:hover, a.btn.secondary:hover, button.btn.secondary:hover,
.ev-drawer .ev-xbtn:hover{ filter:brightness(.95); }
.ev-btn:focus, a.btn:focus, button.btn:focus,
.ev-btn.secondary:focus, a.btn.secondary:focus, button.btn.secondary:focus,
.ev-drawer .ev-xbtn:focus{ outline:2px solid #fff; outline-offset:2px; }

/* Visibility helpers */
.ev-hide-desktop{ display:block; }
@media (min-width:980px){ .ev-hide-desktop{ display:none !important; } }
.ev-hide-mobile{ display:none; }
@media (min-width:980px){ .ev-hide-mobile{ display:block !important; } }

/* Shared Filters / Pagination */
.filters{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; margin:12px 0; }
.pagination{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; justify-content:center; margin:16px 0; }
.page{ padding:8px 12px; border:1px solid var(--ev-line); border-radius:10px; text-decoration:none; color:var(--ev-fg); }
.page.current{ background:#2a3140; }

/* =============================================================================
   SECTION 2 — ADMIN UI MODULES
   ========================================================================== */
header{ padding:18px 20px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; }
a.btn,button.btn{ padding:10px 14px; }
.wrap.upload-1100,.wrap.upload{ max-width:1100px; }
.grid.upload{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }

/* Admin flashes */
.err{ background:#3b0d16; border:1px solid #6b1222; color:#ffd5dd; padding:10px; border-radius:10px; margin:0 0 10px; }
.msg{ background:#0d243b; border:1px solid #123a6b; color:#d5e9ff; padding:10px; border-radius:10px; margin:0 0 10px; }
.warn{ background:#2a1c00; border:1px solid #735c2a; color:#ffecb3; padding:10px; border-radius:10px; margin:0 0 10px; }

/* Form elements (Admin) */
label{ display:block; margin:10px 0 6px; }
input,select,textarea{ width:100%; padding:10px; border-radius:10px; border:1px solid var(--line); background:#0b0d10; color:#e5e7eb; }
textarea{ min-height:90px; }

/* Upload progress */
.ev-progress{ margin-top:12px; }
.ev-progress .track{ height:10px; background:#1f242b; border-radius:999px; overflow:hidden; border:1px solid var(--ev-line); }
.ev-progress .bar{ height:100%; width:0%; background:#FF0066; transition:width .2s ease; }
.ev-progress .label{ margin-top:6px; font-size:12px; color:#ccc; }

/* Gallery table (Admin) */
.ev-table{ width:100%; border-collapse:separate; border-spacing:0; background:var(--ev-card); border:1px solid var(--ev-line); border-radius:14px; overflow:hidden; }
.ev-table thead th{ position:sticky; top:0; background:#0e1116; border-bottom:1px solid var(--ev-line); text-align:left; padding:10px; font-weight:600; }
.ev-table tbody td{ border-bottom:1px solid var(--ev-line); padding:10px; vertical-align:top; }
.ev-table tbody tr:last-child td{ border-bottom:0; }
.thumb{ width:120px; height:90px; object-fit:cover; background:#0b0d10; border:1px solid var(--ev-line); border-radius:8px; }
.mono{ font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace; font-size:14px; }
.nowrap{ white-space:nowrap; }
.actions{ display:flex; gap:6px; flex-wrap:wrap; }

.th-sort{ color:#e5e7eb; text-decoration:none; }
.th-sort .arrow{ opacity:.8; margin-left:4px; }
.th-sort.active .arrow{ color:var(--ev-accent); }

/* Categories manager */
.ev-grid-cat{ display:grid; grid-template-columns:380px 1fr; gap:20px; }
@media (max-width:980px){ .ev-grid-cat{ grid-template-columns:1fr; } }
.ev-card{ background:var(--ev-card); border:1px solid var(--ev-line); border-radius:12px; box-shadow:0 2px 8px rgba(0,0,0,.04); overflow:hidden; }
.ev-card-title{ margin:0; padding:12px 16px; border-bottom:1px solid var(--ev-line); font-size:18px; }
.ev-card-body{ padding:16px; }
.ev-label{ display:block; font-size:12px; color:var(--ev-muted); margin:10px 0 4px; }
.ev-input,.ev-select,.ev-textarea{ width:100%; padding:10px; border:1px solid var(--ev-line); border-radius:8px; background:#0b0d10; color:#e5e7eb; font-size:14px; }
.ev-textarea{ min-height:96px; }
.ev-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media (max-width:640px){ .ev-grid-2{ grid-template-columns:1fr; } }
.ev-actions{ margin-top:12px; display:flex; gap:8px; flex-wrap:wrap; }
.ev-row-end{ display:flex; align-items:flex-end; gap:10px; }
.ev-checkbox{ display:flex; align-items:center; gap:8px; margin:0; }
.ev-sep{ border:none; border-top:1px solid var(--ev-line); margin:18px 0; }
.ev-tree{ list-style:none; padding-left:16px; margin:0; }
.ev-tree .ev-tree{ padding-left:20px; border-left:2px dashed var(--ev-line); margin-left:8px; }
.ev-tree li{ margin:8px 0; }
.ev-tree-row{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.ev-cat-name{ min-width:220px; font-weight:600; }
.ev-cat-slug,.ev-cat-so{ color:var(--ev-muted); }
.ev-badge{ font-size:11px; padding:2px 6px; border-radius:999px; border:1px solid var(--ev-line); }
.ev-badge.on{ background:#eefbf0; color:#146c2e; border-color:#ccebd4; }
.ev-badge.off{ background:#fff7e6; color:#8a5a00; border-color:#f3deb6; }
.ev-btn.xs{ padding:4px 8px; font-size:12px; }

/* Compact icon buttons */
.ev-icon-btn, a.ev-icon-btn, button.ev-icon-btn{
  width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:8px; border:1px solid var(--ev-line); background:var(--ev-card); color:var(--ev-fg);
  padding:0; cursor:pointer; text-decoration:none;
}
.ev-icon-btn:hover{ background:#1a1f27; }
.ev-icon-btn svg{ width:18px; height:18px; }
.ev-icon-btn.danger{ background:#2a0b10; border-color:#4d1620; }
.ev-icon-btn.danger:hover{ background:#3a0f17; }

/* =============================================================================
   SECTION 3 — PUBLIC HOMEPAGE: HORIZONTAL HEADER, REQUEST FORM, GALLERY
   ========================================================================== */

/* Homepage uses horizontal header (no left offset) */
body.ev-home{ padding-left:0 !important; padding-top:0 !important; }

/* --- 3A: Horizontal Header (CLS-safe) --- */
.ev-home-header{
  position:sticky; top:0; z-index:1050;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:10px 16px; background:#000; color:#fff; border-bottom:1px solid #111;
  min-height:calc(var(--ev-logo-h) + 16px); /* stable header height */
}
.ev-home-brand{
  display:inline-flex; align-items:center;
  min-width:var(--ev-logo-w); min-height:var(--ev-logo-h); /* reserve logo slot */
}
.ev-home-brand img{
  display:block; width:var(--ev-logo-w); height:var(--ev-logo-h); object-fit:contain;
}
.ev-home-nav{ display:flex; align-items:center; gap:6px; overflow-x:auto; scrollbar-width:none; }
.ev-home-nav::-webkit-scrollbar{ display:none; }
.ev-home-nav a{
  display:inline-block; text-decoration:none; color:#f3f3f3;
  padding:8px 10px; border-radius:8px; white-space:nowrap;
}
.ev-home-nav a:hover,.ev-home-nav a:focus{ background:#161616; color:#fff; outline:none; }
.ev-home-nav a[aria-current="page"]{ background:#111; color:#fff; }

/* --- Request Form Modal (public) --- */
.ev-modal-wrap{ position:fixed; inset:0; z-index:1200; display:none; align-items:center; justify-content:center; }
.ev-modal-wrap.open{ display:flex; }
.ev-modal-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.6); opacity:0; transition:opacity .25s ease; }
.ev-modal-wrap.open .ev-modal-backdrop{ opacity:1; }

.ev-modal{
  position:relative; width:min(680px,92vw); background:#1a1a1a; border-radius:14px;
  box-shadow:0 10px 30px rgba(0,0,0,.5); padding:18px 18px 20px; transform:scale(.92);
  opacity:0; animation:evZoomIn .22s ease forwards; border:2px solid #fff;
}
@keyframes evZoomIn{ to{ transform:scale(1); opacity:1; } }
.ev-modal h3{ margin:6px 0 12px; font-size:20px; color:var(--ev-accent); }
.ev-modal form{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ev-modal form .full{ grid-column:1/-1; }
@media (max-width:640px){
  .ev-modal{ width:96vw; padding:16px; }
  .ev-modal form{ grid-template-columns:1fr; }
}
.ev-modal label{ font-size:13px; font-weight:600; color:#111; }

/* Public-only inputs inside modal */
.ev-modal input,.ev-modal textarea{
  width:100%; padding:10px; border:1px solid #bbb; border-radius:8px; font-size:17px;
  background:#cecece; color:#000;
}
.ev-modal input::placeholder,.ev-modal textarea::placeholder{ color:#333; opacity:.9; }
.ev-modal textarea{ min-height:110px; resize:vertical; }

.ev-modal .ev-actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:4px; }

/* Modal buttons (scoped) */
.ev-modal .ev-btn{ appearance:none; border:1px solid #ccc; background:#c8c8c8; color:#000; border-radius:10px; padding:9px 12px; cursor:pointer; font-weight:700; }
.ev-modal .ev-btn-primary{ border-color:#cb2c51; color:#fff; background:#cb2c51; }
.ev-modal .ev-btn-primary:hover{ filter:brightness(.95); }

.ev-alert{ display:none; margin:8px 0 0; font-size:13px; }
.ev-alert.ok{ color:#0a7a3d; }
.ev-alert.err{ color:#b00020; }
.ev-x{ position:absolute; top:8px; right:8px; border:0; background:transparent; font-size:18px; line-height:1; cursor:pointer; }

/* --- Gallery / Lightbox / Misc --- */

/* Full-width public content with stable responsive padding */
#ev-main .wrap{
  margin:0 auto; max-width:none;
  padding-left:clamp(12px,3vw,24px); padding-right:clamp(12px,3vw,24px);
  padding-top:12px; padding-bottom:12px;
}

/* Responsive masonry — uses a steady target tile width to minimize relayout */
.masonry{
  width:100%;
  column-width:clamp(200px,22vw,340px);
  column-gap:clamp(8px,2vw,18px);
}
@media (max-width:680px){
  .masonry{ column-width:min(48%,320px); } /* ~2 columns on small phones */
}
@media (min-width:1600px){
  .masonry{ column-width:clamp(220px,16vw,380px); }
}

/* Each item pre-advertises its size; thumbs are always perfect squares */
.masonry figure{
  break-inside:avoid; margin:0 0 clamp(8px,2vw,18px); position:relative;
  content-visibility:auto;
  contain-intrinsic-size: 1 400px;        /* size hint for faster initial layout */
}
.masonry a.lb-wrap{ position:relative; display:block; }

/* TRUE SQUARE THUMBNAILS (no reflow): use fixed-height container with object-fit */
.masonry img.thumb{
  display:block; width:100%;
  height:auto;                                   /* fallback */
  aspect-ratio:1/1;                              /* guarantees square from first paint */
  object-fit:cover; object-position:center;
  border-radius:10px; border:1px solid var(--ev-line); background:#0b0d10;
}

/* Fixed-height single-line caption area to eliminate shifts */
.masonry .info{
  height:16px;                                   /* fixed slot height */
  line-height:16px;
  padding:0; margin-top:4px;
  font-size:14px; color:#bbb;                    /* smaller as requested */
  overflow:hidden;
}
.masonry .info p{
  margin:0; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;
}

/* Empty state (public) */
.empty{ padding:14px; border:1px dashed var(--ev-line); border-radius:10px; color:#cbd3df; background:#0a0f14; }
.empty strong{ color:#fff; }
.tips{ margin-top:10px; color:#9fb0c7; font-size:14px; }

/* Lightbox (public) */
.ev-lb{ position:fixed; inset:0; z-index:2000; display:none; }
.ev-lb.open{ display:block; }
.ev-lb .ev-lb-bg{ position:absolute; inset:0; background:rgba(0,0,0,.85); }
.ev-lb .ev-lb-stage{ position:absolute; inset:60px 16px 80px; display:flex; align-items:center; justify-content:center; }
.ev-lb img{ max-width:100%; max-height:100%; border-radius:10px; border:1px solid var(--ev-line); background:#0b0d10; }
.ev-lb .ev-lb-ui{ position:absolute; top:12px; left:12px; right:12px; display:flex; align-items:center; justify-content:space-between; gap:10px; color:#fff; }
.ev-lb .ev-lb-title{ font-weight:600; max-width:70%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ev-lb .ev-lb-btn{ background:var(--ev-accent); border:1px solid var(--ev-accent); color:#000; border-radius:10px; padding:8px 12px; cursor:pointer; }
.ev-lb .ev-lb-prev,.ev-lb .ev-lb-next{
  position:absolute; top:50%; transform:translateY(-50%); padding:10px 12px; border-radius:10px;
  background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.3); color:#fff; cursor:pointer;
}
.ev-lb .ev-lb-prev{ left:12px; } .ev-lb .ev-lb-next{ right:12px; }
.ev-lb .ev-lb-cap{ position:absolute; left:12px; right:12px; bottom:16px; text-align:center; color:#ddd; font-size:14px; }

/* Date badge — fixed size (no jiggle) */
.masonry .date-badge{
  position:absolute; right:6px; bottom:6px;
  background:#000; color:#fff;
  font-size:10px; line-height:1; padding:2px;
  border-radius:2px; pointer-events:none; opacity:.95; z-index:2;
}

/* Motion preferences */
@media (prefers-reduced-motion:reduce){
  .ev-modal{ animation:none; opacity:1; transform:none; }
}

/* =========================
   CLS HARDENING PATCH
   ========================= */

/* 1) Keep the viewport width stable (prevents body-level CLS on scrollbar appear) */
html { scrollbar-gutter: stable both-edges; }

/* 2) Masonry tiles: reserve geometry from first paint (no late content-visibility layout) */
.masonry figure{
  /* remove content-visibility/contain-intrinsic-size if present */
  content-visibility: visible !important;
  contain-intrinsic-size: auto !important;
}

/* Make the clickable wrapper itself a square so its height is known before image decode */
.masonry a.lb-wrap{
  display:block;
  aspect-ratio: 1 / 1;     /* forces a perfect square tile immediately */
  border-radius:10px;
  border:1px solid var(--ev-line);
  background:#0b0d10;
  overflow:hidden;         /* ensure child image never expands the box */
}

/* Square thumbnail that never changes the wrapper’s size */
.masonry img.thumb{
  width:100%;
  height:100%;             /* fill the square wrapper */
  object-fit:cover;
  object-position:center;
  display:block;
  border:0;                /* border now lives on the wrapper to avoid height math changes */
  border-radius:0;         /* wrapper supplies the rounding */
}

/* Single-line caption with fixed slot to avoid any push */
.masonry .info{
  height:14px;             /* fixed caption slot */
  line-height:14px;
  padding:0;
  margin-top:6px;
  font-size:12px;          /* smaller per your request */
  color:#bbb;
  overflow:hidden;
}
.masonry .info p{
  margin:0;
  white-space:nowrap;
  text-overflow:ellipsis;
  overflow:hidden;
}

/* 3) Pagination: keep sizing stable and stop wrapping/height growth */
.pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;

  /* prevent line-wrap reflow; allow horizontal scroll on tiny screens */
  flex-wrap:nowrap;
  overflow:auto;

  /* lock the row’s vertical footprint from first paint */
  min-height:40px;         /* one row */
  padding:6px 0;           /* consistent vertical padding */
}

.page{
  font-size:14px;
  line-height:28px;        /* fixed button height */
  min-height:28px;
  min-width:40px;          /* stable width so “1…10” doesn’t jitter */
  text-align:center;

  /* keep numerals same width across devices to avoid micro-shifts */
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Optional: keep ellipsis characters from wrapping on either side */
.pagination::after,
.pagination::before{ content:""; }

/* 4) Header/logo: make sure its height never changes after image decode */
.ev-home-header{
  min-height: calc(var(--ev-logo-h) + 16px);
}
.ev-home-brand{
  display:inline-flex; align-items:center;
  min-width: var(--ev-logo-w);
  min-height: var(--ev-logo-h);
}
.ev-home-brand img{
  width: var(--ev-logo-w);
  height: var(--ev-logo-h);
  object-fit: contain;
  display: block;
}