/* Elos Compatibility Shortcodes — base + polish
   You can tweak the accent below to better match your brand. */
:root { --elos-accent: #e11d48; }

/* --- Columns --- */
.elos-col{float:left;min-height:1px;padding:0 12px;box-sizing:border-box;margin-bottom:24px}
.elos-w-100{width:100%}.elos-w-75{width:75%}.elos-w-66{width:66.6667%}.elos-w-50{width:50%}.elos-w-33{width:33.3333%}.elos-w-25{width:25%}
.elos-last{margin-right:0;float:right}
.elos-row:after{content:"";display:block;clear:both}

/* --- Headings --- */
.elos-heading{margin:1em 0 .6em; font-weight:700; letter-spacing:.2px}
.elos-heading.alignleft{text-align:left}
.elos-heading.aligncenter{text-align:center}
.elos-heading.alignright{text-align:right}

/* --- Divider --- */
.elos-divider{border:0;border-top:1px solid #e2e8f0;margin:28px 0}
.elos-divider.light{border-top-color:#eee}
.elos-divider.dark{border-top-color:#bbb}

/* --- Buttons --- */
.elos-button{display:inline-block;padding:11px 20px;border-radius:6px;text-decoration:none;font-weight:600}
.elos-button.primary{background:var(--elos-accent, #e11d48);color:#fff}
.elos-button.primary:hover{filter:brightness(0.95)}
.elos-button.secondary{background:#f3f4f6;color:#111827}

/* --- Highlight / Box --- */
.elos-highlight{background:yellow;padding:0 .15em}
.elos-box{border:1px solid #e5e7eb;padding:15px;margin:15px 0;border-radius:6px;background:#fff}

/* --- Icon block --- */
.elos-icon{display:flex;gap:12px;align-items:flex-start;margin:12px 0}
.elos-icon .elos-icon__i{font-size:22px;line-height:1.2; width:28px; text-align:center}
.elos-icon .elos-icon__title{font-weight:600;margin:0}
.elos-icon .elos-icon__text{margin:.25em 0 0}

/* --- Tabs --- */
.elos-tabs{margin:16px 0}
.elos-tabs__nav{display:flex;gap:8px;border-bottom:1px solid #e5e7eb;margin-bottom:12px;flex-wrap:wrap}
.elos-tabs__nav a{padding:8px 12px;text-decoration:none;border:1px solid #e5e7eb;border-bottom:none;border-radius:6px 6px 0 0;background:#f3f4f6;color:inherit}
.elos-tabs__nav a.active{background:#fff;font-weight:600}
.elos-tabs__pane{display:none;padding:12px;border:1px solid #e5e7eb;border-radius:0 6px 6px 6px;background:#fff}
.elos-tabs__pane.active{display:block}

/* --- Accordions --- */
.elos-acc{border:1px solid #e5e7eb;border-radius:8px;overflow:hidden;background:#fff}
.elos-acc__item{border-top:1px solid #e5e7eb}
.elos-acc__item:first-child{border-top:0}
.elos-acc__head{margin:0;padding:12px 14px;background:#f9fafb;cursor:pointer;font-weight:600}
.elos-acc__item.open .elos-acc__head{background:#fff}
.elos-acc__body{display:none;padding:14px}
.elos-acc__item.open .elos-acc__body{display:block}

/* --- Clients / grids / mosaic --- */
.elos-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.elos-grid.logo-grid img{max-width:100%;height:auto;display:block;transition:transform .15s ease; filter:none; opacity:.95}
.elos-grid.logo-grid a:hover img{transform:scale(1.02)}

.elos-imagebox{border:1px solid #eee;border-radius:8px;overflow:hidden;background:#fff}
.elos-imagebox img{display:block;width:100%;height:auto}
.elos-imagebox__body{padding:10px}

/* --- Lists --- */
.elos-list{list-style:none;margin:0;padding:0}
.elos-list li{margin:6px 0;display:flex;gap:8px;align-items:flex-start}
.elos-list i{margin-top:4px}

/* --- Latest posts/projects --- */
.elos-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.elos-card{border:1px solid #eee;border-radius:8px;overflow:hidden;background:#fff}
.elos-card img{width:100%;height:auto;display:block}
.elos-card__body{padding:12px}
.elos-card__title{font-weight:600;margin:0 0 6px}
.elos-card__title a{color:inherit;text-decoration:none}
.elos-card__title a:hover{text-decoration:underline}
.elos-card__meta{font-size:.9em;color:#666}

/* --- Responsive --- */
@media(max-width:1024px){
  .elos-grid{grid-template-columns:repeat(3,1fr)}
  .elos-cards{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .elos-grid{grid-template-columns:repeat(2,1fr)}
  .elos-cards{grid-template-columns:1fr}
  .elos-col{width:100% !important; float:none}
}
