.cs-shell { width: min(calc(100% - 2rem), var(--cs-container)); margin-inline: auto; }
.cs-trustbar { background: var(--cs-mata-profunda); color: #f5ecd6; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.cs-trustbar__inner { min-height: 2.4rem; display: flex; align-items: center; justify-content: center; gap: .65rem; text-align: center; }
.cs-trustbar svg { width: 1rem; height: 1rem; color: var(--cs-ouro); }
.cs-header { background: rgba(255, 252, 245, .96); border-bottom: 1px solid var(--cs-linha); position: relative; z-index: 10; }
.cs-header__inner { min-height: 5rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.cs-brand { display: inline-flex; align-items: center; gap: .8rem; color: var(--cs-mata); text-decoration: none; }
.cs-brand__mark { display: grid; place-items: center; width: 2.65rem; height: 2.65rem; border: 1px solid var(--cs-ouro); border-radius: 50% 50% 44% 56%; background: var(--cs-mata); color: var(--cs-ouro-claro); }
.cs-brand__mark svg { width: 1.35rem; height: 1.35rem; }
.cs-brand__text { display: grid; line-height: 1.05; }
.cs-brand__text strong { font-family: var(--cs-font-display); font-size: 1.12rem; }
.cs-brand__text span { margin-top: .25rem; color: var(--cs-terra-suave); font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; }
.cs-nav { display: flex; align-items: center; gap: 1.4rem; font-size: .9rem; font-weight: 700; }
.cs-nav a { color: var(--cs-terra); text-decoration: none; }
.cs-nav a:hover { color: var(--cs-folha); }
.cs-nav__account { padding: .65rem 1rem; border: 1px solid var(--cs-mata); border-radius: 999px; }

.cs-hero { position: relative; overflow: hidden; color: var(--cs-branco); background: var(--cs-mata); }
.cs-hero::before,
.cs-hero::after { position: absolute; content: ""; pointer-events: none; }
.cs-hero::before { inset: auto -7% -5.5rem -7%; height: 12rem; border: 1px solid rgba(232, 213, 165, .3); border-radius: 50% 50% 0 0; transform: rotate(-2deg); }
.cs-hero::after { right: -6rem; top: -9rem; width: 28rem; height: 28rem; border: 1px solid rgba(232, 213, 165, .15); border-radius: 50%; }
.cs-hero__inner { position: relative; min-height: 31rem; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .8fr); align-items: center; gap: 5rem; padding-block: 5rem 6rem; z-index: 1; }
.cs-kicker { display: inline-flex; align-items: center; gap: .65rem; margin: 0 0 1.25rem; color: var(--cs-ouro-claro); font-size: .76rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.cs-kicker::before { width: 2.6rem; height: 1px; content: ""; background: var(--cs-ouro); }
.cs-hero h1 { max-width: 12ch; margin: 0; font-family: var(--cs-font-display); font-size: clamp(2.8rem, 6vw, 5.4rem); font-weight: 600; letter-spacing: -.045em; line-height: .98; }
.cs-hero__lead { max-width: 38rem; margin: 1.5rem 0 2rem; color: #e8e4d9; font-size: clamp(1rem, 1.6vw, 1.18rem); }
.cs-hero__actions { display: flex; flex-wrap: wrap; gap: .8rem; }
.cs-btn { min-height: 3rem; display: inline-flex; align-items: center; justify-content: center; gap: .55rem; padding: .75rem 1.25rem; border: 1px solid transparent; border-radius: var(--cs-radius-sm); font-weight: 800; text-decoration: none; cursor: pointer; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.cs-btn:hover { transform: translateY(-2px); }
.cs-btn--gold { background: var(--cs-ouro); color: #201b12; }
.cs-btn--outline { border-color: rgba(255,255,255,.4); color: var(--cs-branco); background: transparent; }
.cs-btn--primary { background: var(--cs-mata); color: var(--cs-branco); }
.cs-btn--secondary { border-color: var(--cs-linha); background: transparent; color: var(--cs-mata); }
.cs-hero__stamp { justify-self: end; width: min(100%, 22rem); padding: 2rem; border: 1px solid rgba(232, 213, 165, .35); background: rgba(13, 45, 29, .44); box-shadow: 0 2rem 5rem rgba(0,0,0,.16); }
.cs-hero__stamp strong { display: block; font-family: var(--cs-font-display); color: var(--cs-ouro-claro); font-size: 2rem; font-weight: 500; line-height: 1.15; }
.cs-hero__stamp p { margin: .8rem 0 0; color: #dedaca; font-size: .92rem; }
.cs-hero__stamp-list { display: grid; gap: .8rem; margin: 1.5rem 0 0; padding: 1.25rem 0 0; border-top: 1px solid rgba(232, 213, 165, .25); list-style: none; }
.cs-hero__stamp-list li { display: flex; gap: .65rem; align-items: center; font-size: .88rem; }
.cs-check { display: grid; place-items: center; flex: 0 0 auto; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: var(--cs-ouro); color: var(--cs-mata-profunda); font-size: .75rem; font-weight: 900; }

.cs-shop { padding-block: 4rem 5rem; }
.cs-section-head { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-bottom: 1.5rem; }
.cs-section-head h2 { margin: 0; color: var(--cs-mata); font-family: var(--cs-font-display); font-size: clamp(2rem, 4vw, 3rem); font-weight: 600; letter-spacing: -.03em; }
.cs-section-head p { max-width: 35rem; margin: .5rem 0 0; color: var(--cs-terra-suave); }
.cs-count { white-space: nowrap; color: var(--cs-terra-suave); font-size: .86rem; }
.cs-toolbar { display: grid; grid-template-columns: minmax(16rem, 1fr) minmax(12rem, .35fr) minmax(12rem, .35fr); gap: .8rem; margin-bottom: 2rem; padding: 1rem; border: 1px solid var(--cs-linha); background: var(--cs-marfim); box-shadow: var(--cs-shadow-sm); }
.cs-field { display: grid; gap: .35rem; }
.cs-field label { color: var(--cs-terra-suave); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cs-input-wrap { position: relative; }
.cs-input-wrap svg { position: absolute; left: .9rem; top: 50%; width: 1rem; height: 1rem; color: var(--cs-folha); transform: translateY(-50%); pointer-events: none; }
.cs-field input,
.cs-field select { width: 100%; min-height: 3rem; padding: .7rem .85rem; border: 1px solid #cfc5b5; border-radius: var(--cs-radius-sm); color: var(--cs-terra); background: var(--cs-branco); }
.cs-field input { padding-left: 2.65rem; }
.cs-field input::placeholder { color: #827a6e; }
.cs-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.35rem; }
.cs-card { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--cs-linha); border-radius: var(--cs-radius-md); background: var(--cs-marfim); box-shadow: var(--cs-shadow-sm); transition: transform .25s ease, box-shadow .25s ease; }
.cs-card:hover { transform: translateY(-4px); box-shadow: var(--cs-shadow-md); }
.cs-card[hidden] { display: none; }
.cs-card__media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #e4ddcf; }
.cs-card__media img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .45s ease; }
.cs-card:hover .cs-card__media img { transform: scale(1.035); }
.cs-card__placeholder { width: 100%; height: 100%; display: grid; place-items: center; color: var(--cs-folha); background: linear-gradient(145deg, #ebe4d7, #d7dfd3); }
.cs-card__placeholder svg { width: 3rem; height: 3rem; }
.cs-card__type { position: absolute; top: .85rem; left: .85rem; padding: .35rem .65rem; border-radius: 999px; background: rgba(255,252,245,.94); color: var(--cs-mata); font-size: .7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.cs-card__body { flex: 1; display: flex; flex-direction: column; padding: 1.25rem; }
.cs-card__category { margin: 0 0 .5rem; color: var(--cs-folha); font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.cs-card h3 { margin: 0; color: var(--cs-mata-profunda); font-family: var(--cs-font-display); font-size: 1.35rem; font-weight: 600; line-height: 1.2; }
.cs-card__description { display: -webkit-box; min-height: 3.2rem; margin: .65rem 0 1.25rem; overflow: hidden; color: var(--cs-terra-suave); font-size: .88rem; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.cs-card__price { margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--cs-linha); }
.cs-card__price-old { display: block; color: var(--cs-terra-suave); font-size: .76rem; text-decoration: line-through; }
.cs-card__price-current { color: var(--cs-mata); font-family: var(--cs-font-display); font-size: 1.65rem; font-variant-numeric: tabular-nums; font-weight: 700; }
.cs-card__actions { display: grid; grid-template-columns: 1fr auto; gap: .65rem; margin-top: 1rem; }
.cs-card__actions .cs-btn { min-height: 2.8rem; padding: .65rem .85rem; font-size: .82rem; }
.cs-empty { padding: 4rem 1.5rem; border: 1px solid var(--cs-linha); background: var(--cs-marfim); text-align: center; }
.cs-empty svg { width: 3rem; height: 3rem; color: var(--cs-folha); }
.cs-empty h2 { margin: 1rem 0 .35rem; color: var(--cs-mata); font-family: var(--cs-font-display); }
.cs-empty p { max-width: 34rem; margin: 0 auto; color: var(--cs-terra-suave); }
.cs-empty[hidden] { display: none; }
.cs-benefits { border-block: 1px solid var(--cs-linha); background: var(--cs-marfim); }
.cs-benefits__inner { display: grid; grid-template-columns: repeat(3, 1fr); }
.cs-benefit { padding: 2rem; border-right: 1px solid var(--cs-linha); }
.cs-benefit:last-child { border-right: 0; }
.cs-benefit strong { display: block; color: var(--cs-mata); font-family: var(--cs-font-display); font-size: 1.08rem; }
.cs-benefit span { color: var(--cs-terra-suave); font-size: .86rem; }
.cs-footer { padding-block: 2.5rem; color: #dcd7ca; background: var(--cs-mata-profunda); font-size: .82rem; }
.cs-footer__inner { display: flex; justify-content: space-between; gap: 2rem; }

@media (max-width: 900px) {
    .cs-hero__inner { grid-template-columns: 1fr; gap: 2rem; padding-block: 4rem; }
    .cs-hero__stamp { justify-self: start; }
    .cs-toolbar { grid-template-columns: 1fr 1fr; }
    .cs-toolbar .cs-field:first-child { grid-column: 1 / -1; }
    .cs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .cs-shell { width: min(calc(100% - 1.25rem), var(--cs-container)); }
    .cs-nav a:not(.cs-nav__account) { display: none; }
    .cs-brand__text span { display: none; }
    .cs-header__inner { min-height: 4.5rem; }
    .cs-hero__inner { min-height: auto; padding-block: 3.5rem; }
    .cs-hero__stamp { padding: 1.4rem; }
    .cs-section-head { align-items: start; flex-direction: column; gap: .5rem; }
    .cs-toolbar { grid-template-columns: 1fr; }
    .cs-toolbar .cs-field:first-child { grid-column: auto; }
    .cs-grid { grid-template-columns: 1fr; }
    .cs-benefits__inner { grid-template-columns: 1fr; }
    .cs-benefit { border-right: 0; border-bottom: 1px solid var(--cs-linha); }
    .cs-benefit:last-child { border-bottom: 0; }
    .cs-footer__inner { flex-direction: column; gap: .5rem; }
}