.lopa-app,.lopa-profile{--lopa-gold:#BF9B30;--lopa-light:#f4dfb2;--lopa-dark:#14090c;box-sizing:border-box;width:100%;max-width:1200px;margin:0 auto;background:linear-gradient(145deg,#26090e,#0e080a);color:#f5f0e9;border:1px solid #9b7936;border-radius:24px;overflow:hidden;font:400 16px/1.65 Montserrat,Arial,sans-serif}
.lopa-app *,.lopa-profile *{box-sizing:border-box;min-width:0}.lopa-app [hidden]{display:none!important}.lopa-app h2,.lopa-app h3,.lopa-profile h1,.lopa-profile h2,.lopa-profile h3{font-family:'Playfair Display',Georgia,serif;color:#f4dfb2;line-height:1.18}.lopa-app a,.lopa-profile a{color:#f1d58c;text-decoration:none}.lopa-app a:focus-visible,.lopa-profile a:focus-visible,.lopa-app button:focus-visible,.lopa-app input:focus-visible,.lopa-app select:focus-visible{outline:3px solid #e0bd54;outline-offset:3px}.lopa-hero>img{display:block;width:100%;height:auto;aspect-ratio:1672/941;object-fit:contain}.lopa-hero-copy{padding:26px 34px 30px;border-bottom:1px solid #765928}.lopa-hero-copy small,.lopa-profile-head small,.lopa-card-copy small{color:#dfbc69;letter-spacing:.1em;font-size:.72rem;font-weight:700;text-transform:uppercase}.lopa-hero-copy h2{font-size:clamp(2rem,4.5vw,3.5rem);margin:8px 0 12px}.lopa-hero-copy p{margin:0;max-width:780px}.lopa-tools{padding:24px 30px;background:#18090d;border-bottom:1px solid #765928}.lopa-tools>label{display:block;font-weight:600;margin-bottom:8px}.lopa-tools input,.lopa-tools select{font:inherit;width:100%;background:#fffaf1;color:#291c20;border:1px solid #bf9b30;border-radius:9px;padding:12px 14px;box-shadow:none}.lopa-filters{display:flex;align-items:flex-end;gap:16px;margin-top:16px}.lopa-filters label{flex:1;font-size:.85rem}.lopa-filters select{display:block;margin-top:6px}.lopa-filters button{font:600 .85rem/1.4 Montserrat,Arial,sans-serif;padding:13px 18px;border:1px solid #bf9b30;border-radius:9px;background:#881119;color:#fff;cursor:pointer}.lopa-tools [role=status]{font-size:.85rem;color:#ddc6a2;margin:12px 0 0}.lopa-feed-head{padding:22px 30px 0;display:flex;justify-content:space-between;gap:16px;color:#e9cd8d}.lopa-feed-head span{font-size:.82rem}.lopa-feed{display:flex;gap:22px;overflow-x:auto;padding:22px 30px 32px;scroll-snap-type:x proximity;scrollbar-color:#bf9b30 #26090e}.lopa-card{flex:0 0 min(460px,80%);border:1px solid #967439;border-radius:20px;overflow:hidden;background:linear-gradient(150deg,#3b0c15,#16090e);scroll-snap-align:start}.lopa-card>a{display:flex;flex-direction:column;height:100%;color:#f5f0e9}.lopa-card-media{aspect-ratio:1;background:#300b11}.lopa-card-media img{display:block;width:100%;height:100%;object-fit:cover}.lopa-card-copy{padding:24px;display:flex;flex-direction:column;flex:1}.lopa-card-copy h3{font-size:1.85rem;margin:10px 0 12px}.lopa-card-copy p{font-size:.94rem;line-height:1.55;margin:0 0 20px}.lopa-card-copy span{margin-top:auto;font-size:.86rem;font-weight:700;color:#e8c576}.lopa-empty{padding:20px 30px}.lopa-atlas-footer{padding:18px 30px;border-top:1px solid #765928;font-size:.8rem;color:#d9c5ae}.lopa-single-wrap{padding:30px 18px;max-width:1240px;margin:auto}.lopa-profile{padding:30px}.lopa-back{display:inline-block;margin-bottom:22px;font-size:.86rem}.lopa-profile-head{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;align-items:center}.lopa-profile-head h1{font-size:clamp(2rem,4.2vw,3.8rem);margin:8px 0 18px;overflow-wrap:anywhere}.lopa-profile-head p{margin:0}.lopa-profile-head>img{width:100%;height:auto;aspect-ratio:1;border:1px solid #bf9b30;border-radius:18px}.lopa-byline{display:flex;flex-wrap:wrap;gap:8px 24px;margin:26px 0;font-size:.8rem;color:#d9c5ae}.lopa-facts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 22px}.lopa-facts>div{border:1px solid #765928;border-radius:12px;padding:18px}.lopa-facts dt{font-weight:700;font-size:.84rem;color:#e8c576}.lopa-facts dd{margin:8px 0 0;font-size:.91rem}.lopa-toc{border:1px solid #765928;border-radius:12px;padding:16px 20px;margin-bottom:26px}.lopa-toc summary{cursor:pointer;font-weight:600;color:#e8c576}.lopa-toc nav{display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;padding-top:16px}.lopa-toc a{font-size:.88rem}.lopa-document{max-width:980px;margin:auto;overflow-wrap:anywhere}.lopa-document h2{font-size:1.8rem;border-top:1px solid #765928;padding-top:26px;margin:34px 0 16px;scroll-margin-top:90px}.lopa-document h3{font-size:1.35rem;margin:24px 0 12px}.lopa-document p{margin:0 0 15px}.lopa-document a{text-decoration:underline;text-underline-offset:3px}.lopa-document figure{margin:24px auto;max-width:820px}.lopa-document figure img{display:block;width:100%;height:auto;border-radius:14px}.lopa-table-wrap{overflow-x:auto;margin:24px 0;border:1px solid #765928;border-radius:12px}.lopa-document table{width:100%;border-collapse:collapse;background:#1f0b11;color:#f5f0e9;font-size:.9rem}.lopa-document th,.lopa-document td{padding:14px;border:1px solid #765928;text-align:left;vertical-align:top}.lopa-document th{color:#e8c576;background:#3d0e17}.lopa-document td p,.lopa-document th p{margin:0}.lopa-list-item{padding-left:10px}.lopa-image-note{margin-top:30px;border:1px solid #765928;border-radius:12px;padding:18px;font-size:.82rem;color:#d9c5ae}.lopa-footer{margin-top:26px;padding-top:22px;border-top:1px solid #765928;font-size:.84rem}.lopa-footer p{margin:0 0 12px}
@media(hover:hover){.lopa-card{transition:border-color .2s,box-shadow .2s}.lopa-card:hover{border-color:#e8c576;box-shadow:0 8px 25px #0006}.lopa-app a:hover,.lopa-profile a:hover{color:#ffe9b1}}
@media(max-width:680px){.lopa-app,.lopa-profile{border-radius:16px}.lopa-hero-copy{padding:20px}.lopa-tools{padding:20px}.lopa-filters{flex-direction:column;align-items:stretch;gap:10px}.lopa-feed-head{padding:20px 18px 0;font-size:.88rem}.lopa-feed{padding:18px;gap:16px}.lopa-card{flex-basis:92%}.lopa-card-copy{padding:20px}.lopa-card-copy h3{font-size:1.55rem}.lopa-atlas-footer{padding:16px 20px}.lopa-single-wrap{padding:16px 10px}.lopa-profile{padding:20px 16px}.lopa-profile-head{grid-template-columns:1fr;gap:20px}.lopa-profile-head>img{max-width:500px;margin:auto}.lopa-facts{grid-template-columns:1fr}.lopa-toc nav{grid-template-columns:1fr}.lopa-document h2{font-size:1.55rem}.lopa-document h3{font-size:1.2rem}.lopa-document table{min-width:460px}}
@media(prefers-reduced-motion:reduce){.lopa-card{transition:none}}

/* Compact atlas layout, 1.0.1. Keep body copy readable. */
.lopa-app,.lopa-profile{max-width:1060px;border-radius:18px}
.lopa-hero>img{max-height:300px;background:#14090c}
.lopa-hero-copy{padding:16px 22px 18px}
.lopa-hero-copy h2{font-size:clamp(1.6rem,3vw,2.35rem);margin:6px 0 8px}
.lopa-tools{padding:16px 22px}
.lopa-tools input,.lopa-tools select{padding:8px 12px}
.lopa-filters{gap:12px;margin-top:10px}
.lopa-filters button{padding:9px 14px}
.lopa-tools [role=status]{margin-top:8px}
.lopa-feed-head{padding:16px 22px 0}
.lopa-feed{gap:16px;padding:16px 22px 22px}
.lopa-card{flex-basis:min(270px,85%);border-radius:14px}
.lopa-card-copy{padding:16px}
.lopa-card-copy h3{font-size:1.35rem;margin:8px 0 10px}
.lopa-card-copy p{font-size:.88rem;margin-bottom:14px}
.lopa-profile{padding:24px}
.lopa-profile-head{grid-template-columns:minmax(0,1fr) minmax(0,280px);gap:24px}
.lopa-profile-head h1{font-size:clamp(1.7rem,3.2vw,2.6rem)}
.lopa-byline{margin:18px 0}
.lopa-facts>div{padding:14px}
.lopa-document figure{max-width:600px}
@media(max-width:680px){
.lopa-hero>img{max-height:220px}
.lopa-hero-copy,.lopa-tools{padding:14px 16px}
.lopa-feed-head{padding:14px 16px 0}
.lopa-feed{padding:14px 16px 18px}
.lopa-card{flex-basis:min(250px,90%)}
.lopa-profile{padding:18px 16px}
.lopa-profile-head{grid-template-columns:1fr;gap:16px}
.lopa-profile-head>img{max-width:240px}
}

/* 1.0.3: compact hero caption and opening image beside introduction. */
.lopa-app .lopa-hero{display:grid;grid-template-columns:minmax(0,1fr);position:relative;background:#14090c}
.lopa-app .lopa-hero>img{grid-area:1/1;width:100%;height:280px;max-height:none;aspect-ratio:auto;object-fit:contain}
.lopa-app .lopa-hero-copy{grid-area:1/1;align-self:end;position:relative;padding:34px 20px 14px;background:linear-gradient(transparent,rgba(20,9,12,.94) 35%,#14090c);border-bottom:1px solid #765928}
.lopa-app .lopa-hero-copy small{font-size:.65rem}
.lopa-app .lopa-hero-copy h2{font-size:clamp(1.5rem,2.5vw,1.95rem);margin:4px 0 6px}
.lopa-app .lopa-hero-copy p{font-size:.88rem;line-height:1.5;max-width:760px}
.lopa-profile .lopa-profile-head{grid-template-columns:minmax(0,1fr)}
.lopa-profile .lopa-document-lead{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:start;margin:20px 0 28px}
.lopa-profile .lopa-document-lead>figure{width:100%;max-width:220px;margin:0}
.lopa-profile .lopa-document-lead>figure img{width:100%;height:auto;max-height:400px;object-fit:contain}
.lopa-profile .lopa-document-intro>h2:first-child{border:0;padding:0;margin:0 0 14px}
.lopa-profile .lopa-document figure{max-width:360px}
.lopa-profile .lopa-document figure img{width:100%;height:auto;max-height:460px;object-fit:contain}
.lopa-app .lopa-card{flex-basis:min(230px,85%)}
.lopa-app .lopa-card-copy h3{font-size:1.2rem}
@media(max-width:680px){
.lopa-app .lopa-hero>img{height:270px;object-position:center top}
.lopa-app .lopa-hero-copy{padding:32px 16px 12px}
.lopa-app .lopa-hero-copy h2{font-size:1.45rem}
.lopa-profile .lopa-document-lead{grid-template-columns:minmax(0,1fr);gap:18px}
.lopa-profile .lopa-document-lead>figure{width:180px;max-width:100%;margin:0 auto}
.lopa-profile .lopa-document figure{max-width:260px}
.lopa-profile .lopa-document figure img{max-height:380px}
.lopa-app .lopa-card{flex-basis:min(220px,88%)}
}

/* 1.0.4: match the ingredient atlas panel and thumbnail proportions. */
.lopa-app{max-width:1060px;background:#0d090a;border-radius:24px}
.lopa-app .lopa-hero{height:245px;overflow:hidden}
.lopa-app .lopa-hero>img{height:245px;width:100%;object-fit:cover;object-position:center 12%}
.lopa-app .lopa-hero-copy{align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:28px 38px;background:linear-gradient(90deg,rgba(13,7,9,.96),rgba(13,7,9,.72) 34%,rgba(13,7,9,.08) 70%);border:0}
.lopa-app .lopa-hero-copy h2{font-size:clamp(2.3rem,4.7vw,3.7rem);line-height:1.04;margin:10px 0 0;max-width:65%;overflow-wrap:anywhere}
.lopa-app .lopa-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 14px;margin:0 14px 14px;padding:14px 16px 12px;border:1px solid #765928;border-top:0;border-radius:0 0 18px 18px;background:#0c0809}
.lopa-app .lopa-tools>label{grid-column:1/-1;font-size:.9rem;margin:0;color:#e9cd8d}
.lopa-app .lopa-search-intro{grid-column:1/-1;font-size:.8rem;line-height:1.45;color:#d9c5ae;margin:0}
.lopa-app .lopa-tools>input{grid-column:1;grid-row:3;background:#180c10;color:#fff8ed;border:1px solid #7b696e;border-radius:3px;padding:10px 14px;height:44px}
.lopa-app .lopa-filters{display:contents}
.lopa-app .lopa-filters>button{grid-column:2;grid-row:3;align-self:center;padding:6px 12px;border-radius:30px;border:1px solid #f4dfb2;background:linear-gradient(120deg,#f4dfb2,#b77b23);color:#160b0d;font-size:.7rem;text-transform:uppercase}
.lopa-app .lopa-filters>label{grid-column:1;font-size:.75rem;display:flex;gap:10px;align-items:center}
.lopa-app .lopa-filters select{margin:0;width:auto;max-width:100%;padding:4px 8px;background:#180c10;color:#f4dfb2;border-color:#765928;font-size:.75rem}
.lopa-app .lopa-tools [role=status]{grid-column:2;align-self:center;font-size:.75rem;margin:0;text-align:right}
.lopa-app .lopa-feed-panel{margin:0 14px 14px;border:1px solid #765928;border-radius:16px;overflow:hidden;background:#180a0f}
.lopa-app .lopa-feed-head{padding:10px 14px;border-bottom:1px solid #765928}
.lopa-app .lopa-feed-head strong{font:700 1.15rem/1.2 'Playfair Display',Georgia,serif}
.lopa-app .lopa-feed{padding:14px 0 12px;gap:14px}
.lopa-app .lopa-card{flex-basis:300px;border-radius:18px}
.lopa-app .lopa-card-media{height:165px;aspect-ratio:auto;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #765928;background:radial-gradient(ellipse at top,#420e1a,#12080c)}
.lopa-app .lopa-card-media img{width:120px;height:120px;object-fit:contain;border-radius:50%;border:1px solid #bf9b30;padding:3px;background:#21090f}
.lopa-app .lopa-card-copy{padding:15px;min-height:155px}
.lopa-app .lopa-card-copy small{font-size:.65rem;letter-spacing:.03em}
.lopa-app .lopa-card-copy h3{font-size:1.35rem;margin:8px 0 7px}
.lopa-app .lopa-card-copy p{font-size:.8rem;line-height:1.4;margin-bottom:10px}
.lopa-app .lopa-card-copy span{font-size:.8rem}
@media(max-width:680px){
.lopa-app .lopa-hero,.lopa-app .lopa-hero>img{height:210px}
.lopa-app .lopa-hero-copy{padding:20px 18px;background:linear-gradient(90deg,rgba(13,7,9,.96),rgba(13,7,9,.66) 60%,rgba(13,7,9,.08))}
.lopa-app .lopa-hero-copy h2{font-size:clamp(1.7rem,6.7vw,2.4rem);max-width:88%}
.lopa-app .lopa-tools{margin:0 10px 12px;padding:12px;grid-template-columns:minmax(0,1fr)}
.lopa-app .lopa-tools>input{grid-row:auto;grid-column:1}
.lopa-app .lopa-filters>button,.lopa-app .lopa-filters>label,.lopa-app .lopa-tools [role=status]{grid-row:auto;grid-column:1;text-align:left}
.lopa-app .lopa-filters>button{justify-self:start}
.lopa-app .lopa-feed-panel{margin:0 10px 12px}
.lopa-app .lopa-feed-head span{display:none}
.lopa-app .lopa-card{flex-basis:min(280px,88%)}
}

/* 1.0.5: uncropped hero, separate caption, full card image panels. */
.lopa-app .lopa-hero{display:flex;flex-direction:column;height:auto;overflow:hidden}
.lopa-app .lopa-hero>img{display:block;width:100%;height:280px;max-height:none;object-fit:contain;object-position:center;background:#14090c}
.lopa-app .lopa-hero-copy{display:block;position:static;padding:12px 20px 14px;background:#14090c;border-bottom:1px solid #765928}
.lopa-app .lopa-hero-copy h2{max-width:100%;font-size:clamp(1.5rem,2.6vw,2rem);line-height:1.15;margin:5px 0 0}
.lopa-app .lopa-card{flex-basis:260px}
.lopa-app .lopa-card-media{display:block;height:auto;aspect-ratio:1;overflow:hidden}
.lopa-app .lopa-card-media img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0;border:0;padding:0;background:none}
.lopa-app .lopa-card-copy p{font-weight:400}
@media(max-width:680px){
.lopa-app .lopa-hero>img{height:auto;max-height:none;aspect-ratio:1672/941;object-fit:contain}
.lopa-app .lopa-hero-copy{padding:10px 16px 12px;background:#14090c}
.lopa-app .lopa-hero-copy h2{font-size:1.5rem;max-width:100%}
.lopa-app .lopa-card{flex-basis:min(250px,88%)}
}

/* 1.0.6: side-by-side hero and explanatory illustration sections. */
.lopa-app .lopa-hero{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);align-items:center;height:auto;background:#14090c}
.lopa-app .lopa-hero>img{grid-column:2;grid-row:1;width:100%;height:auto;max-height:320px;aspect-ratio:1672/941;object-fit:contain}
.lopa-app .lopa-hero-copy{grid-column:1;grid-row:1;padding:22px;background:#14090c;border:0}
.lopa-app .lopa-hero-copy h2{font-size:clamp(1.65rem,3vw,2.65rem);max-width:100%;line-height:1.12;margin-top:8px}
.lopa-profile .lopa-figure-text{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:24px;align-items:start;margin:22px 0 28px}
.lopa-profile .lopa-figure-text>figure{width:100%;max-width:280px;margin:0}
.lopa-profile .lopa-figure-text>figure img{width:100%;height:auto;max-height:none;object-fit:contain}
.lopa-profile .lopa-figure-explanation p:last-child{margin-bottom:0}
@media(max-width:680px){
.lopa-app .lopa-hero{grid-template-columns:minmax(0,1fr)}
.lopa-app .lopa-hero>img{grid-column:1;grid-row:1;max-height:none}
.lopa-app .lopa-hero-copy{grid-column:1;grid-row:2;padding:12px 16px}
.lopa-app .lopa-hero-copy h2{font-size:1.5rem}
.lopa-profile .lopa-figure-text{grid-template-columns:minmax(0,1fr);gap:16px}
.lopa-profile .lopa-figure-text>figure{max-width:260px;margin:0 auto}
}

.lopa-app .lopa-hero-copy{align-self:center}

/* 1.0.7: vertical mobile snap feed, matching ingredient atlas. */
@media(max-width:760px){
.lopa-app .lopa-feed{--lopa-feed-height:clamp(390px,56svh,470px);display:block;height:var(--lopa-feed-height);max-height:none;padding:8px;overflow-x:hidden;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.lopa-app .lopa-feed::-webkit-scrollbar{display:none}
.lopa-app .lopa-feed .lopa-card{width:100%;height:calc(var(--lopa-feed-height) - 16px);min-height:0;max-height:none;margin:0 0 8px;scroll-snap-align:start;scroll-snap-stop:always}
.lopa-app .lopa-feed .lopa-card>a{display:grid;grid-template-rows:49% 51%;height:100%;min-height:0}
.lopa-app .lopa-feed .lopa-card-media{height:100%;aspect-ratio:auto;min-height:0}
.lopa-app .lopa-feed .lopa-card-copy{height:100%;min-height:0;padding:10px 14px 8px}
.lopa-app .lopa-feed .lopa-card-copy h3{font-size:1.25rem;margin:4px 0 6px}
.lopa-app .lopa-feed .lopa-card-copy p{font-size:.8rem;line-height:1.3;margin:0 0 8px}
.lopa-app .lopa-feed-head span{display:block;font-size:0}
.lopa-app .lopa-feed-head span::after{content:'↑ húzd ↓';font-size:.75rem}
}

/* 1.0.8: preserve atlas text colors inside Elementor theme typography. */
.lopa-app.lopa-app h2,.lopa-app.lopa-app h3{color:#f4dfb2!important}
.lopa-app.lopa-app .lopa-card-copy p{color:#f5f0e9!important}
