:root{--bg:#fffaf3;--surface:#fffdf9;--brown:#6f2f12;--brown-soft:#9a5d3b;--olive:#687957;--olive-dark:#4f6240;--border:#ead8ca;--muted:#7e7068;--shadow:0 8px 24px rgba(100,57,31,.07)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--brown);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.55}a{color:inherit;text-decoration:none}.container{width:min(1150px,calc(100% - 40px));margin-inline:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{background:rgba(255,253,249,.96);border-bottom:1px solid var(--border)}.header-inner{height:88px;display:flex;align-items:center;justify-content:flex-start;gap:0}.brand{display:flex;align-items:center;min-width:0}.brand img{display:block;width:350px;height:76px;object-fit:contain;object-position:left center}.main-nav{display:flex;align-items:center;gap:25px;margin-left:45px;font-size:.9rem;font-weight:600;color:var(--brown-soft)}.main-nav a{padding:8px 0;border-bottom:2px solid transparent}.main-nav a:hover,.main-nav a.active{color:var(--brown);border-bottom-color:var(--brown-soft)}.menu-toggle{display:none}
.welcome-panel{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 610px;column-gap:18px;align-items:center;margin-top:20px;padding:16px 26px 14px;border:1px solid var(--border);border-radius:21px;background:var(--surface);box-shadow:var(--shadow);overflow:hidden}.welcome-panel:after{content:"";position:absolute;right:-55px;top:-85px;width:220px;height:220px;border-radius:50%;background:#fbf0e5;z-index:0}.welcome-copy,.welcome-logo,.recipe-search{position:relative;z-index:1}.eyebrow{margin:0 0 5px;color:var(--olive);font-size:.68rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.welcome-copy h1,.section-heading h2,.ingredients-copy h2{margin:0;font-family:Georgia,"Times New Roman",serif;line-height:1.1;color:var(--brown)}.welcome-copy h1{font-size:clamp(1.8rem,3.5vw,2.65rem)}.welcome-copy p:not(.eyebrow){max-width:580px;margin:7px 0 0;color:var(--muted);font-size:.93rem}.welcome-logo{width:610px;height:86px;object-fit:contain;object-position:right center}.recipe-search{grid-column:1/-1;display:flex;margin-top:10px;width:min(710px,100%);height:46px;border:1px solid #dcc2b0;border-radius:11px;background:#fff;overflow:hidden}.recipe-search input{min-width:0;flex:1;border:0;outline:0;padding:0 16px;color:var(--brown);font:inherit}.recipe-search input::placeholder{color:#aa9990}.recipe-search button{width:76px;padding:0 4px;border:0;background:var(--brown);color:#fff;cursor:pointer;font:700 .78rem inherit;text-align:center;transition:background .18s}.recipe-search button:hover{background:#54210c}
.recipes-section{padding:20px 0 12px}.section-heading{margin-bottom:9px}.section-heading h2{font-size:1.85rem}.section-heading p{margin:3px 0 0;color:var(--muted);font-size:.89rem}.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.category-card{min-height:96px;padding:8px 10px 8px;border:1px solid var(--border);border-radius:15px;background:var(--surface);box-shadow:0 5px 15px rgba(100,57,31,.045);display:flex;flex-direction:column;align-items:flex-start;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.category-card:hover{transform:translateY(-3px);border-color:#d6ae95;box-shadow:0 11px 22px rgba(100,57,31,.11)}.category-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#faeee3;font-size:1.22rem}.category-card h3{margin:4px 0 1px;color:var(--brown);font:700 1.02rem/1.1 Georgia,"Times New Roman",serif}.category-card .category-description{margin:0;color:#b49a8b;font-size:.66rem}.category-arrow{margin-top:auto;align-self:flex-end;margin-right:0;margin-bottom:-2px;color:var(--olive);font-size:1rem}
.ingredients-panel{margin-top:8px;margin-bottom:38px;padding:23px 28px;border:1px solid #d4ddc9;border-radius:20px;background:#f3f6ed;display:flex;justify-content:space-between;align-items:center;gap:24px}.ingredients-copy h2{font-size:1.75rem}.ingredients-copy p:not(.eyebrow){max-width:640px;margin:6px 0 0;color:#67705f;font-size:.9rem}.ingredients-button{display:inline-flex;align-items:center;gap:8px;flex:none;border-radius:9px;background:var(--olive);padding:7px 10px;color:#fff;font-size:.76rem;font-weight:700;transition:transform .18s,background .18s}.ingredients-button:hover{transform:translateY(-2px);background:var(--olive-dark)}
.site-footer{border-top:1px solid var(--border);color:var(--brown-soft);font-size:.78rem}.footer-inner{min-height:66px;display:flex;align-items:center;justify-content:space-between;gap:20px}.footer-inner nav{display:flex;gap:16px}.footer-inner a:hover{color:var(--brown)}
@media(max-width:850px){.container{width:min(100% - 34px,800px)}.header-inner{height:80px}.brand img{width:290px;height:66px}.main-nav{gap:16px;margin-left:25px}.welcome-panel{grid-template-columns:minmax(0,1fr) 475px}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.welcome-logo{width:475px;height:76px}.category-card{min-height:102px}}
@media(max-width:620px){.container{width:min(100% - 28px,540px)}.header-inner{height:auto;min-height:70px;flex-wrap:wrap;padding:7px 0}.brand img{width:245px;height:59px}.menu-toggle{display:block;margin-left:auto;border:1px solid var(--border);border-radius:9px;background:#fffaf5;padding:7px 11px;color:var(--brown);font:700 .78rem inherit;cursor:pointer}.main-nav{display:none;order:3;width:100%;padding:5px 0 4px;margin-left:0;flex-direction:column;align-items:flex-start;gap:0}.main-nav.open{display:flex}.main-nav a{width:100%;padding:8px 0}.welcome-panel{display:block;margin-top:15px;padding:16px 19px 15px}.welcome-panel:after{right:-110px;top:-100px}.welcome-copy h1{font-size:1.9rem}.welcome-logo{width:400px;height:56px;margin-top:8px;object-position:left center}.recipe-search{margin-top:11px;height:44px}.recipe-search button{width:70px;padding:0 3px;font-size:.75rem}.recipes-section{padding-top:19px}.section-heading{margin-bottom:8px}.section-heading h2{font-size:1.78rem}.category-grid{gap:8px}.category-card{min-height:95px;padding:8px;border-radius:14px}.category-icon{width:33px;height:33px;font-size:1.18rem}.category-card h3{font-size:.98rem;margin-top:4px}.ingredients-panel{display:block;margin-top:7px;margin-bottom:30px;padding:22px 20px}.ingredients-button{margin-top:16px;padding:9px 12px;font-size:.8rem}.footer-inner{padding:17px 0;align-items:flex-start;flex-direction:column;gap:7px}.footer-inner nav{flex-wrap:wrap;gap:5px 13px}}
@media(max-width:350px){.category-grid{grid-template-columns:1fr}.brand img{width:210px}.welcome-copy h1{font-size:1.72rem}.welcome-logo{width:100%;max-width:320px}}

/* Category card sizing */
.category-card{height:95px;min-height:0;padding:5px 10px 4px}
@media(max-width:850px){.category-card{height:auto;min-height:102px}}
@media(max-width:620px){.category-card{min-height:95px;padding:8px}}

/* Hero logo sizing */
.welcome-logo{width:295px;height:193px;object-fit:contain;object-position:center center;justify-self:center;transform:translateX(25px)}
@media(max-width:850px){.welcome-logo{width:475px;height:76px;object-position:center center;transform:none}}
@media(max-width:620px){.welcome-logo{width:400px;height:56px;object-position:left center;transform:none}}

/* Hero search and logo row */
.welcome-panel{grid-template-columns:1fr}
.hero-bottom{grid-column:1/-1;display:flex;align-items:flex-end;gap:40px;width:100%}
.hero-bottom .recipe-search{grid-column:auto;flex:1;width:auto;margin-top:0}
.hero-bottom .welcome-logo{flex:0 0 295px;width:295px;height:193px;object-position:center bottom;transform:none}
@media(max-width:850px){.hero-bottom{gap:30px}.hero-bottom .welcome-logo{flex-basis:260px;width:260px;height:170px}}
@media(max-width:620px){.hero-bottom{flex-direction:column;align-items:stretch;gap:12px}.hero-bottom .welcome-logo{align-self:center;flex-basis:auto;width:100%;max-width:295px;height:193px}}

/* Compact desktop hero top spacing */
.welcome-panel{padding:6px 26px 14px}
@media(max-width:620px){.welcome-panel{padding:16px 19px 15px}}

@media(min-width:851px){
  .welcome-panel{grid-template-columns:minmax(0,1fr) 295px;column-gap:40px}
  .hero-bottom{display:contents}
  .hero-bottom .recipe-search{grid-column:1;grid-row:2;align-self:end}
  .hero-bottom .welcome-logo{grid-column:2;grid-row:1 / span 2;align-self:end;justify-self:end}
}

/* Category and recipe pages */
.page-content{padding:28px 0 42px}.breadcrumb{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:13px;color:var(--muted);font-size:.82rem}.breadcrumb a:hover,.back-link:hover{color:var(--brown)}.page-heading{margin-bottom:20px}.page-heading h1,.recipe-detail h1{margin:0;font:700 clamp(2rem,4vw,2.6rem)/1.1 Georgia,"Times New Roman",serif;color:var(--brown)}.page-heading p{margin:6px 0 0;color:var(--muted)}.recipe-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.recipe-card{overflow:hidden;border:1px solid var(--border);border-radius:15px;background:var(--surface);box-shadow:0 5px 15px rgba(100,57,31,.045);transition:transform .18s ease,box-shadow .18s ease}.recipe-card:hover{transform:translateY(-3px);box-shadow:0 11px 22px rgba(100,57,31,.11)}.recipe-card img{display:block;width:100%;height:190px;object-fit:cover}.recipe-card div{padding:13px 14px}.recipe-card h2{min-height:2.35em;margin:0 0 9px;font:700 1.1rem/1.18 Georgia,"Times New Roman",serif}.recipe-card span{font-size:.78rem;font-weight:700;color:var(--olive)}.recipe-card b{font-size:1rem}.back-link{display:inline-block;margin-bottom:16px;font-size:.86rem;font-weight:700;color:var(--olive)}.recipe-detail{max-width:940px}.recipe-detail h1{margin-bottom:18px}.recipe-hero-image{display:block;width:100%;height:min(52vw,480px);object-fit:cover;border:1px solid var(--border);border-radius:18px}.recipe-section{margin-top:18px;padding:20px 22px;border:1px solid var(--border);border-radius:16px;background:var(--surface);color:var(--muted)}.recipe-section h2{margin:0 0 10px;color:var(--brown);font:700 1.35rem/1.1 Georgia,"Times New Roman",serif}.recipe-section div{white-space:normal}.recipe-columns{display:grid;grid-template-columns:minmax(250px,.8fr) minmax(0,1.2fr);gap:18px}.recipe-columns .recipe-section{margin-top:18px}.ingredients{color:#675a52}.preparation{color:#675a52}.not-found{padding:30px 0}
@media(max-width:850px){.recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.recipe-card img{height:180px}}
@media(max-width:620px){.page-content{padding:20px 0 30px}.recipe-grid{gap:12px}.recipe-card img{height:135px}.recipe-card div{padding:10px}.recipe-card h2{font-size:1rem}.recipe-columns{grid-template-columns:1fr;gap:0}.recipe-section{padding:17px}.recipe-hero-image{height:62vw}.breadcrumb{font-size:.76rem}}
@media(max-width:350px){.recipe-grid{grid-template-columns:1fr}.recipe-card img{height:190px}}

/* Ingredients */
.ingredients-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.ingredient-item{display:flex;align-items:center;gap:11px;min-height:62px;padding:10px 13px;border:1px solid var(--border);border-radius:13px;background:var(--surface);box-shadow:0 4px 12px rgba(100,57,31,.04);font-weight:700;color:var(--brown);transition:transform .18s ease,box-shadow .18s ease}.ingredient-item:hover{transform:translateY(-2px);box-shadow:0 8px 17px rgba(100,57,31,.09)}.ingredient-item b{margin-left:auto;color:var(--olive)}.ingredient-icon,.ingredient-detail-icon{display:grid;place-items:center;flex:none;background:#faeee3;border-radius:10px}.ingredient-icon{width:38px;height:38px;font-size:1.25rem}.ingredient-detail{max-width:900px}.ingredient-detail header{display:flex;align-items:center;gap:13px;margin-bottom:18px}.ingredient-detail h1{margin:0;font:700 clamp(2rem,4vw,2.6rem)/1.1 Georgia,"Times New Roman",serif;color:var(--brown)}.ingredient-detail-icon{width:64px;height:64px;font-size:2.2rem;border-radius:16px}.ingredient-section{margin-top:18px;padding:21px 23px;border:1px solid var(--border);border-radius:16px;background:var(--surface);color:var(--muted);line-height:1.65}.ingredient-section h2{margin:0 0 11px;color:var(--brown);font:700 1.35rem/1.15 Georgia,"Times New Roman",serif}.ingredient-section div{overflow-wrap:anywhere}
@media(max-width:850px){.ingredients-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.ingredients-list{grid-template-columns:1fr;gap:9px}.ingredient-section{padding:17px}.ingredient-detail-icon{width:54px;height:54px;font-size:1.9rem}}

/* Individual recipe image */
.recipe-hero-image{display:block;width:auto;max-width:100%;height:auto;max-height:420px;margin-inline:auto;object-fit:contain;object-position:center;background:transparent;border:none;box-shadow:none;border-radius:18px}
@media(max-width:620px){.recipe-hero-image{width:100%;max-height:none;height:auto}}

/* Standard recipe hero framing; drinks keep their original image proportions. */
.recipe-hero-image--standard {
  display: block;
  width: 100%;
  max-width: 560px;
  aspect-ratio: 4 / 3;
  height: auto;
  max-height: none;
  margin-inline: auto;
  object-fit: cover;
  object-position: center;
  border-radius: 18px;
}
@media(max-width:620px) {
  .recipe-hero-image--standard { width: 100%; max-width: 100%; aspect-ratio: 4 / 3; height: auto; }
}

/* Omiljeni recepti: shared by category, search, detail and favorites pages. */
.favorite-card { position: relative; min-width: 0; }
.favorite-card .recipe-card { display: block; height: 100%; }
.favorite-button { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; padding: 6px 12px; border: 1px solid var(--border); border-radius: 50%; background: var(--bg); color: var(--brown); font: inherit; font-size: 30px; cursor: pointer; line-height: 1.2; }
.favorite-card > .favorite-button { position: absolute; top: 12px; right: 12px; box-shadow: 0 2px 8px #4e2a1726; }
.favorite-button:hover { background: #f3e4d5; }
.favorite-button:focus-visible { outline: 3px solid var(--brown); outline-offset: 3px; }
.favorite-button[aria-pressed="true"] { background: #f3e4d5; }
.favorite-detail { font-size: 18px; border-radius: 16px; margin: 0 0 20px; }
.favorites-empty { grid-column: 1 / -1; margin: 0; padding: 28px; background: var(--surface); border: 1px solid var(--border); border-radius: 20px; color: var(--muted); line-height: 1.8; }
#favorites-error { color: var(--brown); padding: 12px; }
@media (min-width:621px) and (max-width:1050px) {
  .header-inner { height: auto; min-height: 80px; flex-wrap: wrap; padding-block: 7px; }
  .main-nav { margin-left: 0; flex-wrap: wrap; gap: 8px 20px; }
}

/* Public recipe ratings */
.recipe-card .rating-summary { display: block; margin: 0 0 10px; color: #94611c; font-size: .78rem; font-weight: 500; line-height: 1.5; }
.rating-panel { width: 100%; max-width: 560px; margin: 0 auto 16px; padding: 12px 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); }
.rating-panel h2 { margin: 0 0 4px; font: 700 1.1rem Georgia, serif; color: var(--brown); }
.rating-stars { display: flex; gap: 2px; flex-wrap: wrap; }
.rating-stars button { width: 44px; height: 44px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #94611c; font-size: 28px; line-height: 1; cursor: pointer; }
.rating-stars button:hover { background: #faeee3; }
.rating-stars button:focus-visible { outline: 2px solid var(--brown); outline-offset: 2px; }
.rating-stars button:disabled { opacity: .6; cursor: wait; }
.rating-panel p { margin: 4px 0 0; color: var(--muted); font-size: .85rem; line-height: 1.4; }
.rating-panel .rating-message { color: var(--olive-dark); }
.rating-message:empty { display: none; }
.rating-note { font-size: .8rem; }
.rating-hint { font-size: .8rem; }
