/* /ghiduri hub — marketing design language (tokens). */
.mkt-guides__hero { background: linear-gradient(180deg, #ffe8e8 55%, transparent 100%); padding: var(--space-14, 3.5rem) var(--space-6, 1.5rem) var(--space-10, 2.5rem); text-align: center; }
.mkt-guides__hero .mkt-guides__title { text-transform: none; font-family: var(--font-brand); font-weight: var(--font-weight-bold, 800); font-size: 2.75rem; color: #1b1b1b; margin: 0 0 var(--space-3, 0.75rem); }
.mkt-guides__hero .mkt-guides__intro { max-width: 40rem; margin: 0 auto var(--space-7, 1.75rem); color: #1b1b1b; font-size: var(--font-size-lg, 1.0625rem); line-height: 1.6; }
.mkt-guides__search { max-width: 34rem; margin: 0 auto; position: relative; }
.mkt-guides__search-input { width: 100%; padding: 1rem 1.125rem 1rem 3.125rem; border: 1px solid var(--color-border, #C2C2C2); border-radius: var(--radius-md, 14px); font-family: var(--font-body, inherit); font-size: 1rem; background: var(--color-surface, #fff); box-shadow: 0 2px 10px rgba(0, 0, 0, .05); }
.mkt-guides__search-input:focus { outline: none; border-color: var(--color-brand-red); box-shadow: 0 0 0 3px rgba(240, 2, 2, .12); }
.mkt-guides__search-icon { position: absolute; left: 1.125rem; top: 50%; transform: translateY(-50%); color: var(--color-text-muted); display: flex; }
.mkt-guides__body { max-width: 76rem; margin: 0 auto; padding: var(--space-9, 2.25rem) var(--space-6, 1.5rem) var(--space-16, 4rem); }
.mkt-guides__chips { display: flex; gap: 0.625rem; flex-wrap: wrap; justify-content: center; margin-bottom: var(--space-8, 2rem); }
.mkt-guides__chip { padding: 0.5rem 1.125rem; border: 1px solid var(--color-border-subtle, #E2E2EA); border-radius: var(--radius-full, 9999px); font-weight: var(--font-weight-semibold, 600); font-size: var(--font-size-sm, 0.875rem); color: var(--color-text-muted); background: var(--color-surface, #fff); text-decoration: none; }
.mkt-guides__chip--active { background: var(--color-brand-red); color: #fff; border-color: var(--color-brand-red); }
.mkt-guides__grid { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.375rem; grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr)); }
.mkt-guides__card { border: 1px solid var(--color-border-subtle, #E2E2EA); border-radius: var(--radius-lg, 18px); background: var(--color-surface, #fff); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.mkt-guides__card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(0, 0, 0, .08); border-color: var(--color-brand-red); }
.mkt-guides__card-link { display: flex; flex-direction: column; gap: 0.75rem; padding: 1.625rem; color: inherit; text-decoration: none; height: 100%; }
.mkt-guides__tag { align-self: flex-start; font-size: 0.75rem; font-weight: var(--font-weight-bold, 700); letter-spacing: .02em; text-transform: uppercase; color: var(--color-brand-red); background: #ffecec; padding: 0.3125rem 0.75rem; border-radius: var(--radius-full, 9999px); }
.mkt-guides__card .mkt-guides__card-title { text-transform: none; font-family: var(--font-brand); font-weight: var(--font-weight-semibold, 600); font-size: 1.125rem; line-height: 1.35; color: #1b1b1b; margin: 0; }
.mkt-guides__card .mkt-guides__card-desc { color: var(--color-text-muted); font-size: var(--font-size-sm, 0.875rem); line-height: 1.6; flex: 1; margin: 0; }
.mkt-guides__read { font-weight: var(--font-weight-bold, 700); font-size: var(--font-size-sm, 0.875rem); color: var(--color-brand-red); }
.mkt-guides__empty { text-align: center; color: var(--color-text-muted); padding: var(--space-10, 2.5rem) 0; }
.mkt-guides__empty a { color: var(--color-brand-red); font-weight: 700; }
.mkt-guides__pager { display: flex; justify-content: center; align-items: center; gap: 0.5rem; margin-top: var(--space-11, 2.75rem); flex-wrap: wrap; }
.mkt-guides__page { min-width: 2.625rem; height: 2.625rem; display: inline-flex; align-items: center; justify-content: center; padding: 0 0.75rem; border: 1px solid var(--color-border-subtle, #E2E2EA); border-radius: var(--radius-sm, 12px); font-weight: 600; color: #1b1b1b; background: #fff; text-decoration: none; }
.mkt-guides__page--active { background: var(--color-brand-red); color: #fff; border-color: var(--color-brand-red); }
.mkt-guides__page--disabled { opacity: .4; pointer-events: none; }