.catalog-hero { padding: 82px 0 70px; background: linear-gradient(135deg, #f8f2e6 0%, #edf7f3 100%); }
.catalog-hero h1 { margin: 18px 0; font: 500 clamp(3rem, 6vw, 5.4rem)/1 Georgia, "Times New Roman", serif; letter-spacing: -.05em; }
.catalog-hero h1 em { color: var(--green); font-weight: inherit; }
.catalog-hero > .shell > p:last-of-type { max-width: 700px; color: var(--muted); font-size: 1.12rem; }
nav .active { color: var(--green); }
.search-panel { display: grid; grid-template-columns: 1.5fr .8fr auto; gap: 12px; align-items: end; max-width: 980px; margin-top: 38px; padding: 18px; border: 1px solid rgba(29,105,93,.12); border-radius: 24px; background: rgba(255,255,255,.9); box-shadow: var(--shadow); }
.search-panel label span { display: block; margin: 0 0 7px 4px; color: var(--ink); font-size: .8rem; font-weight: 800; }
.search-panel input, .search-panel select { width: 100%; height: 54px; padding: 0 16px; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: white; font: inherit; }
.search-panel input:focus, .search-panel select:focus { outline: 3px solid rgba(29,105,93,.16); border-color: var(--green); }
.search-panel .button { border: 0; cursor: pointer; font: inherit; font-weight: 750; }

.category-overview { padding: 95px 0; }
.category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 14px; }
.category-card { min-height: 0; padding: 20px; border: 1px solid var(--line); border-radius: 24px; background: white; transition: transform .2s ease, border-color .2s ease; }
.category-card:hover { transform: translateY(-3px); border-color: #95b9ae; }
.category-card.featured { color: white; background: var(--green); }
.category-card[open] { grid-column: 1 / -1; }
.category-card[open] .category-subcategories { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.category-card summary { display: grid; grid-template-columns: 45px minmax(0,1fr) 24px; gap: 14px; align-items: center; min-height: 66px; cursor: pointer; list-style: none; }
.category-card summary::-webkit-details-marker { display: none; }
.category-card summary::after { content: "+"; justify-self: end; color: var(--green); font-size: 1.35rem; font-weight: 500; }
.category-card[open] summary::after { content: "−"; }
.category-card summary strong, .category-card summary small { display: block; }
.category-card summary strong { font-size: 1.05rem; line-height: 1.25; }
.category-card summary small { margin-top: 4px; color: var(--green); font-size: .73rem; font-weight: 800; }
.category-card .category-icon { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 14px; color: var(--green); background: var(--mint); font-size: 1.3rem; }
.category-card.featured .category-icon { color: var(--green-dark); background: var(--cream); }
.category-card > p { margin: 8px 0 14px; color: var(--muted); font-size: .84rem; }.category-card.featured > p { color: #dcece7; }
.category-card.featured summary::after, .category-card.featured summary small { color: #fff2d5; }
.category-subcategories { display: grid; gap: 6px; padding-top: 4px; }.category-subcategories a, .category-subcategories > span { display: flex; justify-content: space-between; gap: 12px; padding: 9px 11px; border-radius: 10px; color: var(--ink); background: #f3f7f5; font-size: .78rem; font-weight: 700; text-decoration: none; }.category-subcategories a:hover { background: var(--mint); }.category-subcategories small { flex: none; color: var(--green); font-size: .65rem; text-transform: uppercase; }.category-card.featured .category-subcategories a, .category-card.featured .category-subcategories > span { color: white; background: rgba(255,255,255,.1); }.category-card.featured .category-subcategories small { color: #fff2d5; }

.directory-section { padding: 100px 0; background: #eef6f2; }
.directory-heading { display: flex; justify-content: space-between; gap: 30px; align-items: end; }
.directory-heading h2 { max-width: 780px; margin-bottom: 25px; }.directory-heading > p { flex: none; margin-bottom: 35px; color: var(--muted); font-weight: 750; }
.filter-row { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 30px; }
.filter-chip { padding: 10px 14px; border: 1px solid #c6d9d2; border-radius: 999px; color: var(--ink); background: white; font: inherit; font-size: .87rem; font-weight: 700; cursor: pointer; }
.filter-chip span { display: inline-grid; place-items: center; min-width: 23px; height: 23px; margin-left: 5px; padding-inline: 5px; border-radius: 99px; color: var(--muted); background: #edf2ef; font-size: .72rem; }
.filter-chip.active { border-color: var(--green); color: white; background: var(--green); }.filter-chip.active span { color: var(--green-dark); background: var(--mint); }
.business-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.business-card { overflow: hidden; border: 1px solid var(--line); border-radius: 26px; background: white; box-shadow: 0 13px 35px rgba(28,73,65,.08); }
.business-cover { position: relative; display: grid; place-items: center; height: 165px; color: white; background: var(--green); }
.business-cover::after { content: ""; position: absolute; inset: 18px; border: 1px solid rgba(255,255,255,.3); border-radius: 19px; }
.business-cover h3 { margin: 0; padding: 20px 28px 45px; text-align: center; font: 600 1.65rem Georgia, serif; line-height: 1.2; }
.business-card { position: relative; }
.business-page-link { display: inline-block; padding-block: 10px; font-weight: 700; color: var(--green); }
.business-page-link::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.business-card:focus-within { outline: 3px solid var(--green); outline-offset: 3px; }
.business-card:hover { box-shadow: 0 13px 35px rgba(28,73,65,.2); }
.business-cover small { position: absolute; z-index: 1; right: 28px; bottom: 25px; padding: 4px 9px; border-radius: 99px; color: var(--ink); background: var(--cream); font-weight: 800; }
.cover-timea { background: linear-gradient(135deg, #9c426d, #ed91bd); }.cover-noemi { background: linear-gradient(135deg, #61415d, #ad829f); }.cover-barber { background: linear-gradient(135deg, #143f39, #2e8879); }
.business-body { padding: 21px; }.business-type { margin: 0 0 6px; color: var(--green); font-size: .72rem; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }.business-body h3 { font: 500 1.42rem Georgia, serif; line-height: 1.15; }.business-location { margin: 6px 0 13px; color: var(--muted); font-size: .84rem; }.service-preview { display: flex; flex-wrap: wrap; gap: 6px; min-height: 30px; margin: 0 0 10px; }.service-preview span { padding: 5px 8px; border-radius: 9px; color: #415d58; background: #eef4f1; font-size: .76rem; line-height: 1.2; }.business-modes { display: flex; gap: 6px; margin-bottom: 15px; }.business-modes span { padding: 4px 8px; border: 1px solid #c9ddd6; border-radius: 999px; color: var(--green); font-size: .7rem; font-weight: 750; }.card-button { width: 100%; min-height: 48px; padding-inline: 13px; font-size: .79rem; }
.empty-state { padding: 50px 25px; border: 1px dashed #adc8bf; border-radius: 25px; text-align: center; background: rgba(255,255,255,.55); }.empty-state > span { display: block; color: var(--green); font-size: 2rem; }.empty-state p { color: var(--muted); }.text-button { border: 0; color: var(--green); background: none; font: inherit; font-weight: 800; text-decoration: underline; cursor: pointer; }

.future-sections { padding: 100px 0; }.future-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }.future-grid article { padding: 34px; border: 1px solid var(--line); border-radius: 28px; background: var(--cream); }.future-grid article:nth-child(2) { color: white; background: var(--green-dark); }.future-grid article:nth-child(2) .section-kicker { color: #a9ddcd; }.future-grid article:nth-child(3), .future-grid article:nth-child(4) { background: white; }.future-grid h2 { margin: 9px 0 22px; font-size: 2.15rem; }.subcategory-list { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }.subcategory-list > div { position: relative; min-height: 78px; padding: 14px 14px 30px; border: 1px solid rgba(29,105,93,.13); border-radius: 14px; background: rgba(255,255,255,.72); }.subcategory-list strong { display: block; font-size: .9rem; line-height: 1.3; }.subcategory-list span { position: absolute; left: 14px; bottom: 10px; color: var(--green); font-size: .67rem; font-weight: 850; text-transform: uppercase; letter-spacing: .04em; }.subcategory-list p { margin: 5px 0 0; color: var(--muted); font-size: .8rem; }.subcategory-list .wide-subcategory { grid-column: 1 / -1; min-height: 108px; border-left: 3px solid var(--green); }.future-grid article:nth-child(2) .subcategory-list > div { border-color: rgba(255,255,255,.16); background: rgba(255,255,255,.08); }.future-grid article:nth-child(2) .subcategory-list span { color: #b7dfd3; }
.mode-pills { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 22px; }.mode-pills span { padding: 6px 10px; border-radius: 99px; color: var(--green); background: var(--mint); font-size: .78rem; font-weight: 800; }
.template-intro{max-width:820px;color:#dcece7}.template-actions{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 24px}.template-actions .button{border:1px solid #fff2d5;cursor:pointer;font:inherit;font-weight:800}.template-primary{color:var(--green-dark);background:#fff2d5}.template-secondary{color:white;background:transparent}
.demo-dialog{width:min(680px,calc(100% - 24px));padding:0;border:0;border-radius:28px;color:var(--ink);background:#fff;box-shadow:0 30px 90px rgba(9,35,31,.35)}.demo-dialog::backdrop{background:rgba(8,29,26,.72)}.demo-top{display:flex;justify-content:space-between;gap:20px;padding:24px 26px 15px}.demo-top h2{margin:5px 0 0;font-size:1.8rem}.demo-close{align-self:start;width:42px;height:42px;border:0;border-radius:50%;font-size:1.7rem;cursor:pointer}.demo-stage{min-height:300px;margin:0 26px;padding:34px;border-radius:22px;background:linear-gradient(145deg,#e8f5f0,#fff8e9)}.demo-screen{animation:demo-in .32s ease}.demo-role{display:inline-block;padding:5px 9px;border-radius:999px;color:white;background:var(--green);font-size:.7rem;font-weight:900;letter-spacing:.1em}.demo-role.business{background:#8b5b10}.demo-icon{display:grid;place-items:center;width:72px;height:72px;margin:30px auto 18px;border-radius:22px;color:white;background:var(--green-dark);font-size:2.1rem}.demo-screen h3,.demo-screen p{text-align:center}.demo-screen h3{margin:0 0 10px;font-size:1.55rem}.demo-screen p{max-width:480px;margin:auto;color:var(--muted);font-size:1.03rem}.demo-progress{height:5px;margin:18px 26px 8px;border-radius:99px;background:linear-gradient(to right,var(--green) var(--demo-progress,16.6%),#dce7e3 var(--demo-progress,16.6%))}.demo-controls{display:flex;align-items:center;justify-content:center;gap:8px;padding:6px 20px}.demo-controls button{padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:white;cursor:pointer}.demo-controls span{min-width:48px;text-align:center;font-weight:800}.demo-open-template{display:block;margin:12px 26px 26px;text-align:center}@keyframes demo-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

@media (max-width: 1000px) { .category-grid { grid-template-columns: repeat(2, 1fr); }.category-card, .category-card.featured, .category-card:not(.featured) { grid-column: span 1; }.category-card[open] { grid-column: 1 / -1; }.category-card[open] .category-subcategories { grid-template-columns: repeat(2, minmax(0, 1fr)); }.business-grid { grid-template-columns: 1fr 1fr; }.search-panel { grid-template-columns: 1fr 1fr; }.search-panel .button { grid-column: 1 / -1; } }
@media (max-width: 1000px) and (min-width: 701px) { .category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .catalog-hero { padding: 55px 0 58px; }.catalog-hero h1 { font-size: 2.65rem; }.search-panel, .category-grid, .business-grid, .future-grid { grid-template-columns: 1fr; }.search-panel .button { grid-column: auto; }.category-grid { gap: 9px; }.category-card { padding: 10px 14px; border-radius: 17px; }.category-card[open] { grid-column: auto; }.category-card[open] .category-subcategories { grid-template-columns: 1fr; }.category-card summary { min-height: 64px; }.category-card > p { margin: 4px 0 10px 59px; }.category-subcategories { padding: 2px 0 8px 59px; }.business-cover { height: 138px; }.business-cover::after { inset: 13px; }.business-cover > span { width: 62px; height: 62px; font-size: 1.45rem; }.business-cover small { right: 20px; bottom: 18px; }.business-body { padding: 18px; }.business-body h3 { font-size: 1.32rem; }.directory-heading { display: block; }.directory-heading > p { margin-top: -12px; }.filter-row { flex-wrap: nowrap; margin-inline: -13px; padding: 0 13px 8px; overflow-x: auto; }.filter-chip { flex: none; }.future-grid article { padding: 25px 20px; }.subcategory-list { grid-template-columns: 1fr; }.subcategory-list .wide-subcategory { grid-column: auto; }.site-header .button-small { font-size: .73rem; padding-inline: 11px; }.template-actions{display:grid}.demo-stage{min-height:280px;margin-inline:14px;padding:24px 17px}.demo-top{padding:19px 18px 12px}.demo-controls{flex-wrap:wrap}.demo-open-template{margin-inline:14px} }
@media (prefers-reduced-motion: reduce) { .category-card { transition: none; } }