:root {
  --cream: #f7f4f0;
  --paper: #fffdfb;
  --coffee: #6f4e37;
  --coffee-dark: #493326;
  --ink: #292522;
  --muted: #6d625a;
  --border: #ded4cc;
  --shadow: 0 10px 30px rgba(92, 53, 33, .08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: Inter, Arial, sans-serif; }
button, input, select { font: inherit; }
button, select { cursor: pointer; }

.topbar {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between;
  min-height: 74px; padding: 10px max(24px, calc((100vw - 1480px) / 2));
  background: rgba(247, 244, 240, .95); border-bottom: 1px solid var(--border);
  backdrop-filter: blur(14px);
}
.brand { display: flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; font: 800 27px Georgia, serif; }
.brand em { color: var(--coffee); font-style: normal; }
.brand__mark { display:grid; place-items:center; width:46px; height:46px; border-radius:50%; overflow:hidden; box-shadow:0 4px 12px rgba(73,51,38,.16); }
.brand__mark img { display:block; width:100%; height:100%; }
.nav { display: flex; align-items: center; gap: 30px; }
.nav a { padding: 12px 0; color: #493a33; text-decoration: none; font-weight: 700; }
.nav a.active { color: var(--coffee); border-bottom: 2px solid var(--coffee); }
.favorites { padding: 13px 16px; color: var(--ink); background: var(--paper); border: 1px solid var(--border); border-radius: 14px; font-weight: 750; }
.favorites span { display: inline-grid; place-items: center; min-width: 24px; height: 24px; margin-left: 6px; color: white; background: var(--coffee); border-radius: 50%; }

.page { margin: auto; padding: 0 0 64px; }
.hero { min-height: 305px; padding: 0; background: linear-gradient(90deg,#f7f1e9 0%,rgba(247,241,233,.96) 31%,rgba(247,241,233,.2) 58%,rgba(247,241,233,0) 100%),url('assets/receitas/cappuccino-tradicional.png') center 48%/cover no-repeat; border-bottom:1px solid var(--border); }
.hero__content { width:min(1480px,100%); margin:auto; padding:40px max(48px,calc((100vw - 1480px)/2 + 48px)); }
.eyebrow { margin: 0; color: var(--coffee); font-size: 14px; font-weight: 850; letter-spacing: 2px; }
.hero h1 { margin: 10px 0 14px; font: 800 clamp(48px,5vw,64px)/.92 Georgia,serif; letter-spacing:-2px; }
.hero > p:last-child { color: var(--muted); font-size: 19px; }

.quick-filters { position:relative; z-index:3; display:flex; justify-content:center; gap:14px; width:min(1380px,calc(100% - 40px)); margin:-28px auto 34px; }
.quick-filter { min-height:50px; padding:0 28px; color:var(--ink); background:var(--paper); border:1px solid var(--border); border-radius:18px; font-weight:650; box-shadow:0 4px 14px rgba(92,53,33,.04); }
.quick-filter:hover { border-color:#b9a18f; }
.quick-filter.active { color:white; background:var(--coffee-dark); border-color:var(--coffee-dark); }
.mobile-filter-bar { display:none; }
.filters__header { display:flex; align-items:center; justify-content:space-between; }
.filters__close,.filter-overlay { display:none; }
.catalog { display:grid; grid-template-columns:280px 1fr; gap:34px; align-items:start; width:min(1480px,calc(100% - 48px)); margin:auto; }
.filters { position:sticky; top:96px; min-height:420px; padding:28px; background:var(--paper); border:1px solid var(--border); border-radius:20px; box-shadow:var(--shadow); }
.filters h2 { margin: 0 0 28px; font: 800 31px Georgia, serif; }
.filters label { display: block; margin: 22px 0 9px; font-size: 12px; font-weight: 850; letter-spacing: 1.5px; text-transform: uppercase; }
select { width: 100%; min-height: 54px; padding: 0 15px; color: var(--ink); background: var(--paper); border: 1px solid var(--border); border-radius: 14px; outline: none; }
select:focus, input:focus { border-color: var(--coffee); box-shadow: 0 0 0 3px rgba(111,78,55,.13); }
.clear { width: 100%; margin-top: 25px; padding: 13px; color: var(--coffee-dark); background: #f3ece6; border: 1px solid #dbc8b8; border-radius: 13px; font-weight: 750; }

.toolbar { display:grid; grid-template-columns:1fr 190px 92px; gap:16px; }
.search { display: flex; align-items: center; gap: 12px; min-height: 58px; padding: 0 20px; background: white; border: 1px solid var(--border); border-radius: 999px; box-shadow: 0 4px 14px rgba(92,53,33,.05); }
.search span { color: #a88d7b; font-size: 28px; }
.search input { width: 100%; border: 0; outline: 0; background: transparent; font-size: 17px; }
.search input:focus { box-shadow: none; }
.view-buttons { display:grid; grid-template-columns:1fr 1fr; padding:5px; background:var(--paper); border:1px solid var(--border); border-radius:13px; }
.view-buttons button { color:var(--muted); background:transparent; border:0; border-radius:9px; font-size:21px; }
.view-buttons button.selected { color:white; background:var(--coffee); }
.result-count { margin: 26px 0; color: #5d4438; font-weight: 750; }

.recipe-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
.recipe-card { position: relative; overflow: hidden; background: var(--paper); border: 1px solid var(--border); border-radius: 20px; box-shadow: var(--shadow); transition: transform .2s ease, box-shadow .2s ease; }
.recipe-card:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(92,53,33,.13); }
.recipe-card__image { width:100%; aspect-ratio:1.36/1; display:block; object-fit:cover; }
.recipe-card__body { padding:16px 18px 18px; }
.tag { display: inline-block; padding: 6px 10px; color: var(--coffee-dark); background: #f3ece6; border: 1px solid #dbc8b8; border-radius: 999px; font-size: 11px; font-weight: 850; letter-spacing: .6px; text-transform: uppercase; }
.recipe-card h2 { min-height:50px; margin:11px 0 8px; font:800 20px/1.22 Georgia,serif; }
.meta { color: var(--muted); font-size: 14px; }
.card-rating{margin-top:5px;font-size:9px}.card-rating span{color:#d99843;letter-spacing:1px}.card-rating small{color:var(--muted)}
.card-actions { display:flex; gap:9px; margin-top:18px; }
.view-recipe { flex: 1; padding: 12px; color: white; background: var(--coffee); border: 0; border-radius: 12px; font-weight: 750; }
.view-recipe:hover { background: var(--coffee-dark); }
.favorite-card { position:absolute; top:12px; right:12px; width:40px; height:40px; color:white; background:rgba(55,38,28,.3); border:1px solid rgba(255,255,255,.8); border-radius:50%; font-size:22px; backdrop-filter:blur(6px); }
.favorite-card.selected { color: white; background: var(--coffee); }
.empty { padding: 70px 20px; text-align: center; background: var(--paper); border: 1px dashed var(--border); border-radius: 20px; }
.empty span { font-size: 46px; }

.recipe-dialog { width:100vw; max-width:none; height:100vh; max-height:none; margin:0; padding:0; color:var(--ink); background:var(--cream); border:0; border-radius:0; }
.recipe-dialog::backdrop { background:var(--cream); }
.dialog-close { position:fixed; top:16px; right:24px; z-index:102; display:grid; place-items:center; width:42px; height:42px; color:var(--ink); background:white; border:1px solid var(--border); border-radius:50%; font-size:27px; box-shadow:var(--shadow); }
.detail-nav { position:sticky; top:0; z-index:100; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; min-height:74px; padding:10px max(82px,calc((100vw - 1480px)/2)); background:rgba(255,253,251,.97); border-bottom:1px solid var(--border); backdrop-filter:blur(12px); }
.detail-brand { display:flex; align-items:center; gap:12px; font:800 27px Georgia,serif; }
.detail-brand img { width:44px; height:44px; }
.detail-nav__links { display:flex; gap:36px; font-weight:700; }
.detail-nav__links button { padding:17px 10px; color:var(--ink); background:transparent; border:0; font-weight:700; }
.detail-nav__links button:hover { color:var(--coffee); }
.detail-nav__links .active { color:var(--coffee); border-bottom:2px solid var(--coffee); }
.detail-favorites { justify-self:end; margin-right:45px; padding:12px 15px; background:white; border:1px solid var(--border); border-radius:13px; font-weight:700; }
.detail-favorites b { display:inline-grid; place-items:center; width:22px; height:22px; margin-left:6px; color:white; background:var(--coffee); border-radius:50%; }
.detail-page { width:min(1480px,calc(100% - 48px)); margin:auto; padding:22px 0 45px; }
.detail-page__top { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.breadcrumb { color:var(--muted); font-size:14px; }.breadcrumb b { margin:0 10px; color:#b8a79b; }
.back-home { padding:10px 15px; color:var(--coffee-dark); background:var(--paper); border:1px solid var(--border); border-radius:12px; font-weight:700; }
.back-home:hover { background:#f3ece6; }
.detail-intro { display:grid; grid-template-columns:1.08fr .92fr; gap:54px; align-items:center; }
.dialog-hero { width:100%; height:310px; object-fit:cover; border-radius:14px; box-shadow:var(--shadow); }
.detail-summary h1 { margin:10px 0 13px; font:800 clamp(42px,4vw,58px)/1 Georgia,serif; letter-spacing:-1.5px; }
.detail-summary > p { max-width:620px; margin:0 0 17px; color:var(--muted); font-size:15px; line-height:1.45; }
.detail-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.detail-stats > div { display:grid; grid-template-columns:30px 1fr; padding:14px; background:var(--paper); border:1px solid var(--border); border-radius:14px; }
.detail-stats span { grid-row:1/3; align-self:center; color:var(--coffee); font-size:23px; }.detail-stats strong{font-size:14px}.detail-stats small{color:var(--muted);font-size:11px}
.detail-actions { display:flex; align-items:center; gap:28px; margin-top:18px; }
.save-recipe { min-width:185px; padding:14px 20px; color:white; background:var(--coffee-dark); border:0; border-radius:14px; font-weight:750; }.save-recipe.selected{background:#785945}.rating{color:var(--coffee);font-size:17px}
.detail-grid { display:grid; grid-template-columns:.9fr 1.25fr .9fr; gap:20px; margin-top:22px; align-items:stretch; }
.detail-card { padding:24px; background:var(--paper); border:1px solid var(--border); border-radius:16px; box-shadow:0 5px 20px rgba(92,53,33,.05); }
.detail-card h2 { margin:0 0 16px; font:800 21px Georgia,serif; }.serving{display:inline-block;margin-bottom:12px;padding:4px 10px;background:#f4eee9;border-radius:999px;font-size:12px}
.ingredients-card ul { padding-left:21px; }.ingredients-card li { padding:8px 0; border-bottom:1px dotted var(--border); font-size:14px; }
.ingredient-note,.preparation-tip { margin-top:20px; padding:13px; color:#604b3f; background:#f3ece6; border-radius:10px; font-size:13px; }
.preparation-card ol { margin:0; padding:0; list-style:none; }.preparation-card li { display:flex; gap:13px; margin-bottom:13px; font-size:14px; line-height:1.4; }.preparation-card li > span{flex:0 0 24px;display:grid;place-items:center;width:24px;height:24px;color:white;background:var(--coffee-dark);border-radius:50%;font-size:12px}.preparation-card li p{margin:2px 0}
.detail-side { display:grid; gap:15px; }.barista-card p{font-size:14px;line-height:1.5}.barista-card em{display:block;margin-top:13px;color:#936f57;font-family:Georgia,serif}.info-card p{display:flex;justify-content:space-between;margin:0;padding:7px 0;border-bottom:1px dotted var(--border);font-size:13px}.info-card span{color:var(--muted)}
.related { margin-top:20px; }.related-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }.related-grid button{display:grid;grid-template-columns:110px 1fr 30px;align-items:center;padding:0;overflow:hidden;text-align:left;color:var(--ink);background:white;border:1px solid var(--border);border-radius:12px}.related-grid img{width:110px;height:78px;object-fit:cover}.related-grid span{padding:10px}.related-grid strong{display:block;font:700 14px Georgia,serif}.related-grid small{display:block;margin-top:9px;color:var(--muted)}.related-grid i{font-size:22px;font-style:normal}

/* Página inicial — modelo editorial compacto */
body { background:radial-gradient(circle at 50% 0,#fffdf9 0,#f2ebe4 72%); }
.topbar { position:relative; width:min(1500px,calc(100% - 10px)); min-height:64px; margin:5px auto 0; padding:8px 34px; border:0; border-radius:13px 13px 0 0; }
.brand { font-size:24px; }.brand__mark{width:42px;height:42px}.nav{gap:34px}.nav a{font-size:13px}.favorites{padding:10px 14px;font-size:13px}
.page { width:min(1500px,calc(100% - 10px)); padding:0 10px 16px; background:rgba(255,253,249,.94); }
.hero { min-height:230px; border:0; border-radius:14px; background:linear-gradient(90deg,#f7eee3 0%,rgba(247,238,227,.96) 30%,rgba(247,238,227,.2) 58%,rgba(247,238,227,0) 100%),url('assets/receitas/cappuccino-chocolate.png') right center/62% auto no-repeat; overflow:hidden; }
.hero__content { width:100%; padding:28px 70px; }
.eyebrow { display:inline-block; padding:4px 8px; background:#f6eadb; border:1px solid #ddc4aa; border-radius:999px; font-size:9px; letter-spacing:1px; }
.hero h1 { margin:9px 0; font-size:42px; line-height:.9; }
.hero > p:last-child,.hero__content>p:last-of-type{font-size:12px;line-height:1.45}
.hero__actions { display:flex; gap:12px; margin-top:12px; }.hero__actions a,.hero__actions button{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 18px;border-radius:8px;font-size:11px;font-weight:750;text-decoration:none}.hero__primary{color:white;background:var(--coffee-dark)}.hero__secondary{color:var(--coffee-dark);background:rgba(255,255,255,.72);border:1px solid #aa876f}
.quick-filters { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; width:calc(100% - 16px); margin:8px auto 10px; }
.quick-filter { position:relative;display:flex;align-items:center;justify-content:flex-start;gap:10px;min-width:0;min-height:54px;padding:7px 14px;text-align:left;border-radius:10px;box-shadow:0 3px 12px rgba(73,51,38,.06)}.quick-filter b{display:grid;place-items:center;flex:0 0 40px;height:40px;overflow:hidden;background:#fbf5eb;border:1px solid #dfbc7b;border-radius:50%}.quick-filter b img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.85)}.quick-filter span{display:block;min-width:0}.quick-filter strong,.quick-filter small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quick-filter strong{font:700 12px Georgia,serif}.quick-filter small{margin-top:2px;color:var(--muted);font-size:9px}.quick-filter.active{color:var(--ink);background:#fff8e9;border-color:#c69133;box-shadow:0 0 0 1px #c69133,0 5px 16px rgba(161,109,28,.12)}.quick-filter.active::after{content:'✓';position:absolute;top:5px;right:6px;display:grid;place-items:center;width:19px;height:19px;color:white;background:#bd8730;border-radius:50%;font-size:12px}
.mobile-filter-bar{width:calc(100% - 16px)}
.catalog { grid-template-columns:190px 1fr; gap:12px; width:calc(100% - 16px); }
.filters { top:14px; min-height:318px; padding:14px 12px; border-radius:12px; }.filters h2{margin-bottom:16px;font-size:19px}.filters label{margin:12px 0 5px;font-size:8px}.filters select{min-height:30px;padding:0 8px;border-radius:7px;font-size:10px}.clear{margin-top:10px;padding:8px;font-size:10px}.favorite-only{display:flex!important;align-items:center;gap:6px;text-transform:none!important;letter-spacing:0!important}.favorite-only input{width:12px;height:12px}.favorite-only span{margin-left:auto}
.toolbar { grid-template-columns:1fr 170px 78px; gap:10px; }.search{min-height:36px;padding:0 12px}.search span{font-size:19px}.search input{font-size:11px}.toolbar>select{min-height:36px;font-size:10px}.view-buttons{padding:3px}.view-buttons button{font-size:17px}.result-count{margin:10px 0;font-size:10px}
.recipe-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.recipe-card{border-radius:10px}.recipe-card:hover{transform:translateY(-2px)}.recipe-card__image{aspect-ratio:1.48/1}.recipe-card__body{padding:10px}.tag{padding:3px 7px;font-size:8px}.recipe-card h2{min-height:38px;margin:7px 0 4px;font-size:16px}.meta{font-size:9px}.favorite-card{top:8px;right:8px;width:30px;height:30px;font-size:17px}.card-cta{width:100%;margin-top:8px;padding:6px;color:var(--coffee-dark);background:white;border:1px solid #bca18d;border-radius:6px;font-size:9px;font-weight:700}
.pagination { display:flex;align-items:center;justify-content:center;gap:10px;margin-top:10px }.pagination button{width:28px;height:28px;color:var(--coffee-dark);background:var(--paper);border:1px solid var(--border);border-radius:7px}.pagination button:disabled{opacity:.35;cursor:not-allowed}.pagination span{font-size:10px;font-weight:700}
.highlights { display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:calc(100% - 16px);margin:18px auto 10px}.highlights article{position:relative;display:grid;grid-template-columns:1.1fr .9fr;min-height:100px;overflow:hidden;background:var(--paper);border:1px solid var(--border);border-radius:11px;box-shadow:var(--shadow)}.highlights div{z-index:1;padding:15px}.highlights h2{margin:0 0 3px;font:800 17px Georgia,serif}.highlights h3{margin:3px 0;font:800 14px Georgia,serif}.highlights p{margin:0 0 10px;color:var(--muted);font-size:9px}.highlights a,.highlights button{display:inline-block;padding:6px 12px;color:var(--coffee-dark);background:rgba(255,253,251,.85);border:1px solid #bda18d;border-radius:6px;text-decoration:none;font-size:9px}.highlights img{width:100%;height:100%;object-fit:cover;mask-image:linear-gradient(90deg,transparent,#000 35%)}
.newsletter { display:grid;grid-template-columns:50px 1fr 430px;align-items:center;gap:14px;width:calc(100% - 16px);margin:10px auto;padding:14px 35px;background:var(--paper);border:1px solid var(--border);border-radius:11px}.newsletter__icon{font-size:29px}.newsletter h2{margin:0;font:800 18px Georgia,serif}.newsletter p{margin:4px 0 0;color:var(--muted);font-size:10px}.newsletter form{display:flex}.newsletter input{flex:1;min-width:0;padding:0 14px;border:1px solid var(--border);border-radius:7px 0 0 7px}.newsletter button{padding:10px 18px;color:white;background:var(--coffee-dark);border:0;border-radius:0 7px 7px 0;font-size:10px;font-weight:700}
footer { padding: 30px 20px; color: #8a6a59; text-align: center; border-top: 1px solid var(--border); }
footer { display:flex;justify-content:space-between;width:min(1500px,calc(100% - 10px));margin:0 auto 5px;padding:18px 34px;background:rgba(255,253,249,.94);border-radius:0 0 13px 13px;font-size:10px}footer strong{font:800 18px Georgia,serif}

/* Modelo amplo e minimalista da referência atual */
body { background:var(--cream); }
.topbar { position:sticky; width:100%; max-width:none; min-height:72px; margin:0; padding:10px max(60px,calc((100vw - 1080px)/2)); border-radius:0; }
.brand{font-size:25px}.brand__mark{width:44px;height:44px}.nav{gap:38px}.nav a{font-size:14px}.favorites{font-size:13px}
.page { width:100%; max-width:none; padding:0 0 45px; background:var(--cream); }
.hero { position:relative;height:clamp(180px,17.25vw,259px);min-height:0;border-radius:0;background:linear-gradient(90deg,rgba(246,238,229,.32),transparent 55%),url('assets/banner-cafe-hd.png') center/cover no-repeat;overflow:hidden; }
.hero__model-image{display:none}
.hero__content{position:relative;z-index:1;display:block;width:min(1080px,100%);padding:30px 32px}.eyebrow{padding:0;background:transparent;border:0;border-radius:0;font-size:11px}.hero h1{margin:9px 0 12px;font-size:45px;line-height:.88}.hero__content>p:last-of-type{font-size:12px}.hero__actions{display:none}
.quick-filters{display:flex;justify-content:center;gap:12px;width:min(1010px,calc(100% - 30px));margin:-20px auto 28px;overflow:visible}.quick-filter{display:block;flex:0 1 auto;min-width:112px;min-height:40px;padding:0 18px;text-align:center;border-radius:16px;font-size:12px;white-space:nowrap}.quick-filter:nth-child(6){min-width:170px}.quick-filter b,.quick-filter span{display:initial}.quick-filter.active{color:white;background:var(--coffee-dark);border-color:var(--coffee-dark);box-shadow:none}.quick-filter.active::after{content:none}
.mobile-filter-bar{width:min(1080px,calc(100% - 30px))}
.catalog{grid-template-columns:220px 1fr;gap:28px;width:min(1120px,calc(100% - 30px))}.filters{position:sticky;top:88px;min-height:390px;padding:22px 18px;border:1px solid #dfd0c4;border-radius:18px;background:linear-gradient(160deg,#fffdfa,#fbf6f0);box-shadow:0 12px 32px rgba(73,51,38,.08)}.filters::before{content:'';position:absolute;top:0;left:24px;right:24px;height:3px;background:linear-gradient(90deg,transparent,#b98a60,transparent);border-radius:0 0 3px 3px}.filters h2{margin:0;font-size:24px}.filters__header p{margin:4px 0 13px;color:#9a7a65;font:italic 11px Georgia,serif}.filters label{margin:14px 0 6px;font-size:9px}.filters select{min-height:40px;padding:0 10px;font-size:10px;background:rgba(255,255,255,.9);border-color:#dfd1c6;transition:.2s ease}.filters select:hover{border-color:#b98a60;box-shadow:0 4px 12px rgba(73,51,38,.06)}.filters label[for="difficulty"],.filters label[for="ratingFilter"]{display:block!important}#difficulty,#ratingFilter{display:block!important}.favorite-only{display:flex!important;align-items:center;gap:7px;padding:8px 2px;margin:8px 0!important;text-transform:none!important;letter-spacing:0!important;font-size:10px!important}.favorite-only input{accent-color:var(--coffee)}.favorite-only span{margin-left:auto;color:var(--coffee);font-size:16px}.clear{margin-top:7px;min-height:38px;color:white;background:linear-gradient(135deg,var(--coffee-dark),#76513b);border:0;font-size:11px;box-shadow:0 6px 14px rgba(73,51,38,.16)}.clear:hover{filter:brightness(1.08)}
.toolbar{grid-template-columns:1fr 150px 76px;gap:14px}.search{min-height:42px}.toolbar>select{min-height:42px}.result-count{margin:13px 0;font-size:10px}.recipe-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.recipe-card{border-radius:11px}.recipe-card__image{aspect-ratio:1.4/1}.recipe-card__body{padding:12px}.recipe-card h2{min-height:42px;font-size:17px}.tag{font-size:8px}.meta{display:flex;align-items:center;gap:5px;margin-top:3px;color:#77675d;font-size:10px}.card-rating{display:flex;align-items:center;gap:4px;margin:7px 0 9px;font-size:10px}.card-rating b{color:var(--ink)}.card-rating span{color:#d4973d;letter-spacing:.5px}.card-rating small{color:#8b7b70}.card-cta{display:block;width:100%;min-height:30px;margin-top:7px;padding:5px 10px;color:var(--coffee-dark);background:linear-gradient(180deg,#fffdfa,#f8f1ea);border:1px solid #bfa38f;border-radius:7px;font-size:10px;font-weight:750;transition:.2s ease}.card-cta:hover{color:white;background:var(--coffee-dark);border-color:var(--coffee-dark);transform:translateY(-1px)}.favorite-card{width:31px;height:31px}.pagination{display:none!important}
.hero { background:linear-gradient(90deg,rgba(45,25,15,.82) 0%,rgba(45,25,15,.55) 38%,rgba(45,25,15,.04) 70%),url('assets/banner-cafe-hd.png') center/cover no-repeat; }
.hero__content{color:#fff}.eyebrow{color:#f4d5ad;border:1px solid rgba(226,181,121,.65);padding:4px 9px;border-radius:999px;background:rgba(61,33,18,.45)}.hero__content>p:last-of-type{color:#fff7ef}.hero__actions{display:flex}.hero__secondary{color:white;background:rgba(50,28,17,.32);border-color:rgba(255,255,255,.7)}
.quick-filters{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;width:min(1120px,calc(100% - 30px));margin:10px auto 16px}.quick-filter{display:flex;align-items:center;justify-content:flex-start;gap:9px;min-width:0;min-height:54px;padding:6px 10px;text-align:left;border-radius:10px;white-space:normal}.quick-filter:nth-child(6){min-width:0}.quick-filter b{display:grid;place-items:center;flex:0 0 38px;height:38px;overflow:hidden;border:1px solid #e4cda9;border-radius:50%;background:#fbf3e8;font-size:16px}.quick-filter b img{width:100%;height:100%;object-fit:cover;transform:scale(1.7)}.quick-filter span{display:block;min-width:0}.quick-filter strong,.quick-filter small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.quick-filter strong{font:700 11px Georgia,serif}.quick-filter small{margin-top:2px;color:var(--muted);font-size:8px}.quick-filter.active{color:var(--ink);background:#fff9ee;border-color:#c99549;box-shadow:0 0 0 1px #c99549}.quick-filter.active::after{content:'✓';position:absolute;top:4px;right:5px;display:grid;place-items:center;width:17px;height:17px;color:#fff;background:#b87b2c;border-radius:50%;font-size:10px}
.categories-panel{display:none;width:min(1120px,calc(100% - 30px));margin:0 auto 22px;padding:0 0 8px;scroll-margin-top:72px}.categories-panel:target{display:block}.categories-hero{min-height:210px;margin:0 calc((1120px - 100vw)/2);padding:28px max(30px,calc((100vw - 1020px)/2));color:white;background:linear-gradient(90deg,rgba(49,25,12,.94),rgba(49,25,12,.55) 47%,rgba(49,25,12,.04)),url('assets/banner-cafe-hd.png') center 48%/cover no-repeat}.categories-hero p{display:inline-block;margin:0;padding:4px 10px;color:#f4d3a4;border:1px solid rgba(227,174,101,.55);border-radius:999px;font-size:8px;font-weight:800;letter-spacing:.6px}.categories-hero h2{margin:10px 0 8px;font:800 40px/.92 Georgia,serif;letter-spacing:-1px}.categories-hero span{font-size:11px;line-height:1.45}.categories-panel .quick-filters{grid-template-columns:repeat(5,1fr);gap:18px;width:100%;margin:16px 0 22px}.categories-panel .quick-filter:first-child{display:none}.categories-panel .quick-filter{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:205px;padding:14px 10px;text-align:center;border-radius:15px}.categories-panel .quick-filter b{flex:0 0 92px;width:92px;height:92px}.categories-panel .quick-filter strong{margin-top:10px;font-size:17px}.categories-panel .quick-filter small{margin-top:4px;font-size:9px}.categories-panel .quick-filter span::after{content:'Ver categoria   →';display:block;min-width:142px;margin-top:11px;padding:8px 12px;color:white;background:var(--coffee-dark);border-radius:6px;font:700 9px Arial,sans-serif}.categories-panel .quick-filter.active span::after{background:linear-gradient(135deg,#c78a38,#e0a552)}
.category-collections header{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.category-collections h3{margin:0;font:800 17px Georgia,serif}.category-collections header a{color:var(--coffee-dark);font-size:9px;text-decoration:none}.collection-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.collection-grid article{position:relative;display:grid;grid-template-columns:1.05fr .95fr;min-height:104px;overflow:hidden;background:#fbf1e6;border:1px solid var(--border);border-radius:10px}.collection-grid article>div{z-index:1;padding:13px}.collection-grid h4{margin:0 0 5px;font:800 13px Georgia,serif}.collection-grid p{min-height:30px;margin:0 0 6px;color:var(--muted);font-size:8px;line-height:1.35}.collection-grid button{padding:5px 10px;color:var(--coffee-dark);background:rgba(255,255,255,.8);border:1px solid #cbb5a3;border-radius:5px;font-size:8px}.collection-grid img{width:100%;height:100%;object-fit:cover;mask-image:linear-gradient(90deg,transparent,#000 28%)}.category-stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:12px;padding:12px 18px;background:#fffaf4;border:1px solid var(--border);border-radius:11px}.category-stats>div{display:flex;align-items:center;justify-content:center;gap:12px;border-right:1px solid #eadfd6}.category-stats>div:last-child{border:0}.category-stats i{display:grid;place-items:center;width:34px;height:34px;color:#9b6c41;background:#f3e4d2;border-radius:50%;font-size:18px;font-style:normal}.category-stats strong,.category-stats small{display:block}.category-stats strong{font:700 12px Georgia,serif}.category-stats small{margin-top:3px;color:var(--muted);font-size:8px}
body:has(.categories-panel:target)>.page>.hero,body:has(.categories-panel:target) .mobile-filter-bar,body:has(.categories-panel:target) .catalog,body:has(.categories-panel:target) .highlights,body:has(.categories-panel:target) .newsletter{display:none}body:has(.categories-panel:target) .nav a{border-bottom-color:transparent;color:#493a33}body:has(.categories-panel:target) .nav a[href="#categorias"]{color:var(--coffee);border-bottom:2px solid var(--coffee)}
.catalog{margin-top:22px}
.toolbar{grid-template-columns:1fr 200px 76px}.sort-field{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:7px;min-height:42px;padding-left:12px;background:var(--paper);border:1px solid var(--border);border-radius:10px;font-size:9px;white-space:nowrap}.sort-field select{min-height:40px;padding:0 8px;border:0;background:transparent;font-size:10px}.sort-field select:focus{box-shadow:none}
.highlights{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;width:min(1120px,calc(100% - 30px));margin:20px auto 12px}.highlights article{position:relative;display:grid;grid-template-columns:1.05fr .95fr;min-height:112px;overflow:hidden;background:linear-gradient(135deg,#fffaf3,#f1dfca);border:1px solid var(--border);border-radius:11px;box-shadow:var(--shadow)}.highlights div{z-index:1;padding:16px}.highlights h2{margin:0 0 4px;font:800 16px Georgia,serif}.highlights h3{margin:3px 0 9px;font:800 13px Georgia,serif}.highlights p{margin:0 0 10px;color:var(--muted);font-size:9px}.highlights a,.highlights button{display:inline-block;padding:6px 12px;color:var(--coffee-dark);background:rgba(255,253,251,.82);border:1px solid #bda18d;border-radius:6px;text-decoration:none;font-size:9px}.highlights img{width:100%;height:100%;object-fit:cover;mask-image:linear-gradient(90deg,transparent,#000 30%)}
.newsletter{display:grid;grid-template-columns:44px 1fr 430px;align-items:center;gap:14px;width:min(1120px,calc(100% - 30px));margin:12px auto;padding:14px 24px;background:var(--paper);border:1px solid var(--border);border-radius:11px}.newsletter__icon{display:grid;place-items:center;width:38px;height:38px;color:var(--coffee);background:#f1e3d5;border-radius:50%;font-size:23px}.newsletter h2{margin:0;font:800 16px Georgia,serif}.newsletter p{margin:3px 0 0;color:var(--muted);font-size:9px}.newsletter form{display:flex}.newsletter input{flex:1;min-width:0;padding:0 12px;border:1px solid var(--border);border-radius:7px 0 0 7px;font-size:10px}.newsletter button{padding:10px 18px;color:white;background:var(--coffee-dark);border:0;border-radius:0 7px 7px 0;font-size:9px;font-weight:700}
.site-footer{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:42px;width:min(1120px,calc(100% - 30px));margin:0 auto;padding:24px 12px;color:var(--ink);text-align:left;background:transparent;border-top:1px solid var(--border);border-radius:0}.site-footer strong{font:800 17px Georgia,serif}.site-footer p{max-width:220px;color:var(--muted);font-size:9px;line-height:1.5}.site-footer b{display:block;margin-bottom:9px;font-size:8px;letter-spacing:1px}.site-footer a,.site-footer span{display:block;margin:6px 0;color:var(--muted);text-decoration:none;font-size:8px}.site-footer a:hover{color:var(--coffee)}

@media (max-width: 1250px) { .quick-filters{display:flex;overflow-x:auto;justify-content:flex-start;padding-bottom:8px}.quick-filter{flex:0 0 175px} }
@media (max-width: 1000px) { .recipe-grid { grid-template-columns: repeat(2, 1fr); } }
.card-rating .unrated{color:#8b7b70;letter-spacing:0;font-style:italic}.real-rating{display:grid;gap:4px}.real-rating>strong{font-size:11px}.real-rating>small{color:var(--muted);font-size:10px}.rating-buttons{display:flex;gap:1px}.rating-buttons button{padding:0 2px;color:#c9bdb4;background:transparent;border:0;font-size:23px;line-height:1;transition:.15s ease}.rating-buttons button:hover,.rating-buttons button.selected{color:#d4973d;transform:scale(1.08)}
.demo-rating-note{margin:8px 0 0!important;color:#967044!important;font-size:10px!important;font-style:italic}

@media (max-width: 760px) {
  .topbar { min-height: 74px; padding: 10px 16px; }
  .brand { font-size: 20px; }.brand__mark { width: 42px; height: 42px; }
  .nav a, .favorites { display: none; }
  .page { width:calc(100% - 16px);padding:0 8px 30px }.hero{height:auto;min-height:360px;background:linear-gradient(90deg,#f6eee5,rgba(246,238,229,.72)),url('assets/banner-cafe-hd.png') 64% center/cover no-repeat}.hero__model-image{display:none}.hero__content{display:block;padding:42px 22px;background:linear-gradient(90deg,rgba(247,241,233,.98),rgba(247,241,233,.7) 70%,transparent)}.hero h1 { font-size: 43px; }.hero__actions{align-items:stretch;flex-direction:column;width:180px}
  .quick-filters{display:flex;width:calc(100% - 12px);margin:8px auto 15px;padding-bottom:8px;overflow-x:auto}.quick-filter{flex:0 0 175px;padding:8px 12px}
  .categories-panel{width:100%;margin:0}.categories-hero{min-height:290px;margin:0 -8px;padding:42px 24px;background-position:62% center}.categories-hero h2{font-size:38px}.categories-hero span br{display:none}.categories-panel .quick-filters{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;padding:0;overflow:visible}.categories-panel .quick-filter{min-height:190px;flex:none}.categories-panel .quick-filter b{flex-basis:78px;width:78px;height:78px}.categories-panel .quick-filter strong{font-size:15px}.categories-panel .quick-filter span::after{min-width:120px}.collection-grid{grid-template-columns:1fr}.category-collections header{align-items:flex-start;gap:10px}.category-stats{grid-template-columns:1fr 1fr;gap:14px}.category-stats>div{justify-content:flex-start;padding:8px;border-right:0;border-bottom:1px solid #eadfd6}.category-stats>div:nth-last-child(-n+2){border-bottom:0}
  .mobile-filter-bar { display:block; width:calc(100% - 30px); margin:0 auto 16px; }
  .mobile-filter-button { width:100%; min-height:52px; color:white; background:var(--coffee-dark); border:0; border-radius:14px; font-weight:750; box-shadow:var(--shadow); }
  .catalog { grid-template-columns:1fr; width:calc(100% - 30px); }
  .filters { position:fixed; z-index:50; top:0; left:0; bottom:0; width:min(88vw,340px); min-height:100vh; padding:24px; border-radius:0 22px 22px 0; overflow-y:auto; transform:translateX(-105%); transition:transform .25s ease; }
  .filters.open { transform:translateX(0); }
  .filters__header h2 { margin-bottom:20px; }
  .filters__close { display:grid; place-items:center; width:42px; height:42px; color:var(--ink); background:#f3ece6; border:1px solid var(--border); border-radius:50%; font-size:27px; }
  .filter-overlay { position:fixed; z-index:40; inset:0; width:100%; height:100%; padding:0; background:rgba(34,27,23,.52); border:0; backdrop-filter:blur(2px); }
  .filter-overlay.open { display:block; }
  body.filters-open { overflow:hidden; }
  .toolbar { grid-template-columns: 1fr; }
  .recipe-grid { grid-template-columns: 1fr; }.recipe-details { grid-template-columns: 1fr; }
  .highlights{grid-template-columns:1fr;width:calc(100% - 12px)}.newsletter{grid-template-columns:42px 1fr;width:calc(100% - 12px);padding:16px}.newsletter form{grid-column:1/3}.newsletter h2{font-size:16px}.site-footer{grid-template-columns:1fr 1fr;gap:24px;width:calc(100% - 16px);padding:20px 8px}
  .detail-nav { grid-template-columns:1fr; min-height:66px; padding:10px 16px; }.detail-brand{font-size:21px}.detail-brand img{width:40px;height:40px}.detail-nav__links,.detail-favorites{display:none}.dialog-close{top:12px;right:14px}
  .detail-page { width:calc(100% - 28px); padding-top:16px; }.detail-page__top{align-items:flex-start;flex-direction:column-reverse;gap:12px}.breadcrumb{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.back-home{width:100%}
  .detail-intro { grid-template-columns:1fr; gap:20px; }.dialog-hero{height:240px}.detail-summary h1{font-size:40px}.detail-stats{grid-template-columns:repeat(2,1fr)}.detail-actions{align-items:stretch;flex-direction:column;gap:14px}.save-recipe{width:100%}
  .detail-grid { grid-template-columns:1fr; }.related-grid{grid-template-columns:1fr}.related-grid button{grid-template-columns:95px 1fr 30px}.related-grid img{width:95px}
}