/* Tati Artesãs — front-end styles */
:root{
	--tati-wine:#5e1b2e;        /* deep brand tone (matches the dark header) */
	--tati-primary:#9d2b54;     /* rose-wine — titles */
	--tati-accent:#d6336c;      /* bright rose — buttons/CTAs */
	--tati-accent-dark:#b02555;
	--tati-soft:#fff0f6;        /* light rose surface */
	--tati-soft2:#fff8fb;
	--tati-line:#f0e0e8;
	--tati-ink:#3a2a30;
	--tati-muted:#7a6a70;
}
.tati-ic{ width:1em; height:1em; display:inline-block; vertical-align:-.15em; }
.tati-ic--pin{ color:var(--tati-accent); width:.95em; height:.95em; }
.tati-search, .tati-profile, .tati-panel, .tati-mural, .tati-register, .tati-results { max-width: 1080px; margin: 0 auto; }
.tati-search__form { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px; }
.tati-search__form input, .tati-search__form select { flex:1 1 180px; padding:12px 14px; border:1px solid #ddd; border-radius:8px; font-size:15px; }
.tati-btn { display:inline-block; background:var(--tati-accent); color:#fff !important; border:0; padding:12px 22px; border-radius:8px; font-size:15px; cursor:pointer; text-decoration:none; transition:.15s; }
.tati-btn:hover { background:var(--tati-accent-dark); }
.tati-btn--sm { padding:8px 14px; font-size:14px; }
.tati-btn--wa { background:#25d366; }
.tati-btn--ig { background:#c13584; }

.tati-grid-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:18px; }
.tati-count { grid-column:1/-1; color:#666; margin:0 0 6px; }
.tati-pro-card { border:1px solid #eee; border-radius:12px; overflow:hidden; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.04); display:flex; flex-direction:column; }
.tati-pro-card.is-featured { border-color:#ffd43b; box-shadow:0 4px 16px rgba(255,196,0,.25); }
.tati-pro-card__media { position:relative; display:block; aspect-ratio:4/3; background:#f5f5f5; }
.tati-pro-card__media img, .tati-card__img { width:100%; height:100%; object-fit:cover; }
.tati-noimg { display:block; width:100%; height:100%; background:repeating-linear-gradient(45deg,#f3f3f3,#f3f3f3 10px,#eee 10px,#eee 20px); }
.tati-tag--star { position:absolute; top:8px; left:8px; background:#ffd43b; color:#333; padding:3px 10px; border-radius:20px; font-size:12px; font-weight:700; }
.tati-pro-card__body { padding:14px; display:flex; flex-direction:column; gap:6px; }
.tati-pro-card__body h3 { margin:0; font-size:17px; }
.tati-pro-card__body h3 a { text-decoration:none; color:#222; }
.tati-pill { display:inline-block; font-size:11px; padding:2px 8px; border-radius:20px; background:#eee; color:#555; }
.tati-pill--artesa { background:#fce7f0; color:#b02555; }
.tati-pill--lojista { background:#e7f0fc; color:#1c6dd0; }
.tati-pill--founder, .tati-pill--star { background:#fff3bf; color:#a37500; }
.tati-city { font-size:13px; color:#777; }
.tati-stars span.on { color:#ffb400; } .tati-stars span.off { color:#ddd; }
.tati-excerpt { font-size:14px; color:#555; margin:4px 0; }

.tati-profile__head h1 { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.tati-gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; margin:16px 0; }
.tati-gallery__item { width:100%; border-radius:10px; }
.tati-tags { display:flex; gap:6px; flex-wrap:wrap; }
.tati-tag { background:#f1f1f1; padding:3px 10px; border-radius:6px; font-size:13px; }
.tati-contact { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:18px 0; }
.tati-hint { display:block; flex-basis:100%; color:#888; font-size:13px; }

.tati-card { background:#fff; border:1px solid #eee; border-radius:12px; padding:20px; margin-bottom:18px; }
.tati-form { display:flex; flex-direction:column; gap:14px; }
.tati-form--inline { margin-top:12px; }
.tati-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.tati-field { display:flex; flex-direction:column; gap:6px; font-size:14px; }
.tati-field input, .tati-field select, .tati-field textarea { padding:11px 13px; border:1px solid #ddd; border-radius:8px; font-size:15px; }
.tati-check { display:flex; gap:8px; align-items:flex-start; font-size:14px; }
.tati-alert { padding:12px 16px; border-radius:8px; margin-bottom:16px; }
.tati-alert--ok { background:#e6fcf5; color:#0b7285; }
.tati-alert--err { background:#fff0f0; color:#c92a2a; }
.tati-stats { list-style:none; padding:0; display:flex; gap:24px; flex-wrap:wrap; }
.tati-stats strong { font-size:22px; display:block; }
.tati-review { border-top:1px solid #f0f0f0; padding:12px 0; }
.tati-empty { color:#888; }
/* Branded landing ("Criativas Brasil") */
.tati-home { max-width:1080px; margin:0 auto; }
.tati-hero { text-align:center; padding:40px 20px 24px; background:linear-gradient(135deg,var(--tati-soft),#fff); border-radius:18px; }
.tati-hero__title { font-size:42px; margin:0 0 8px; color:var(--tati-wine); letter-spacing:.5px; }
.tati-hero__sub { font-size:18px; color:#555; margin:0 auto 22px; max-width:640px; }
.tati-hero__search { margin:0 auto 18px; }
.tati-hero__cta { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.tati-btn--ghost { background:#fff; color:#b02555 !important; border:2px solid #d6336c; }
.tati-btn--ghost:hover { background:#fff0f6; }
.tati-steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:18px; margin:34px 0; }
.tati-step { background:#fff; border:1px solid #eee; border-radius:14px; padding:22px; text-align:center; }
.tati-step__n { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%; background:#d6336c; color:#fff; font-weight:700; font-size:18px; margin-bottom:10px; }
.tati-step h3 { margin:6px 0; font-size:18px; }
.tati-step p { color:#666; font-size:14px; margin:0; }
.tati-home__links { text-align:center; color:#999; margin:10px 0 30px; }
.tati-home__links a { color:#b02555; text-decoration:none; }

/* 3 role blocks ("Sou Artesã / Sou Cliente / Sou Fornecedor") */
.tati-roles { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:30px 0 44px; }
.tati-role { display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px;
	background:#fff; border:2px solid var(--tati-line); border-radius:18px; padding:30px 22px; text-decoration:none;
	color:var(--tati-ink); transition:.18s; box-shadow:0 2px 10px rgba(94,27,46,.05); }
.tati-role:hover { transform:translateY(-4px); border-color:var(--tati-accent); box-shadow:0 10px 24px rgba(157,43,84,.18); }
.tati-role__icon { color:var(--tati-accent); line-height:1; }
.tati-role__icon .tati-ic { width:48px; height:48px; }
.tati-role__title { font-size:23px; font-weight:800; color:var(--tati-primary); }
.tati-role__desc { font-size:14px; color:var(--tati-muted); min-height:40px; }
.tati-role__go { margin-top:6px; font-weight:700; color:var(--tati-accent); }
.tati-role--cliente { background:var(--tati-soft2); }
.tati-role--fornecedor { background:var(--tati-soft); }

/* Section heads (Lojas em destaque / Mural) */
.tati-section-head { display:flex; align-items:baseline; justify-content:space-between; margin:26px 0 16px; border-bottom:2px solid var(--tati-line); padding-bottom:8px; }
.tati-section-head h2 { margin:0; font-size:24px; color:var(--tati-wine); }
.tati-seeall { color:var(--tati-accent); text-decoration:none; font-weight:600; font-size:14px; white-space:nowrap; }
.tati-featured, .tati-mural-preview { margin-bottom:40px; }
.tati-center { text-align:center; margin-top:18px; }

/* Mural preview cards */
.tati-mural-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.tati-mural-card { background:#fff; border:1px solid #eee; border-left:4px solid var(--tati-accent); border-radius:10px; padding:16px; }
.tati-mural-card h3 { margin:0 0 6px; font-size:17px; }
.tati-mural-card p { margin:4px 0; font-size:14px; color:#555; }
.tati-mural-card__meta { color:#888 !important; font-size:13px !important; }

/* Termos de Uso */
.tati-terms { max-width:820px; margin:0 auto; color:var(--tati-ink); line-height:1.7; }
.tati-terms__intro { font-size:17px; background:var(--tati-soft); border-radius:10px; padding:14px 18px; }
.tati-terms h2 { color:var(--tati-wine); font-size:21px; margin:28px 0 8px; padding-bottom:6px; border-bottom:2px solid var(--tati-line); }
.tati-terms ul { margin:8px 0 8px 4px; padding-left:22px; }
.tati-terms li { margin:4px 0; }
.tati-terms__notice { margin-top:30px; background:#fff3bf; border-left:4px solid #e0a800; border-radius:8px; padding:14px 18px; font-weight:600; color:#7a5b00; }

@media(max-width:860px){ .tati-roles{ grid-template-columns:1fr; } }
@media(max-width:640px){ .tati-grid{ grid-template-columns:1fr; } .tati-hero__title{ font-size:32px; } }
