:root { --green:#35ae60; --green-dark:#08783b; --green-deep:#075c31; --yellow:#fff000; --yellow-soft:#fff9a8; --ink:#123a25; --muted:#66766c; --cream:#fffdf2; --line:#e4eadf; --white:#fff; --shadow:0 18px 50px rgba(13,89,48,.11); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; }
body { margin:0; min-width:320px; color:var(--ink); background:var(--cream); font-family:Tahoma,Arial,sans-serif; }
a { color:inherit; } button,input { font:inherit; }
.site-header { position:sticky; top:0; z-index:30; background:rgba(255,253,242,.94); border-bottom:1px solid rgba(8,120,59,.11); backdrop-filter:blur(16px); }
.header-inner { width:min(1160px,calc(100% - 32px)); min-height:78px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:28px; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; }
.brand-crop { position:relative; width:58px; height:58px; overflow:hidden; border-radius:18px; background:white; box-shadow:0 7px 20px rgba(8,120,59,.14); }
.brand-crop img { position:absolute; width:280%; height:280%; object-fit:contain; top:-55%; right:-90%; }
.brand strong,.brand small { display:block; }
.brand strong { font-size:1.06rem; } .brand small { margin-top:3px; color:var(--green); font-size:.72rem; font-weight:700; }
.top-links { display:flex; align-items:center; gap:8px; }
.top-links a { padding:10px 15px; border-radius:999px; text-decoration:none; font-size:.9rem; font-weight:800; }
.top-links a:hover,.top-links a:focus-visible { color:var(--green-dark); background:var(--yellow-soft); outline:none; }
.menu-hero { min-height:540px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:70px; padding:64px max(7vw,calc((100vw - 1160px)/2)); overflow:hidden; background:linear-gradient(118deg,var(--green-dark),var(--green) 60%,#63c879); }
.hero-copy { color:white; }
.status { display:inline-flex; align-items:center; gap:9px; padding:9px 15px; border:1px solid rgba(255,255,255,.35); border-radius:999px; background:rgba(255,255,255,.12); font-size:.9rem; font-weight:800; }
.status i { width:9px; height:9px; border-radius:50%; background:var(--yellow); box-shadow:0 0 0 5px rgba(255,240,0,.18); }
.hero-copy h1 { margin:24px 0 12px; font-size:clamp(4rem,7vw,7.4rem); line-height:.9; letter-spacing:-6px; }
.hero-copy h1 em { color:var(--yellow); font-style:normal; }
.hero-copy p { max-width:550px; margin:0; font-size:clamp(1.05rem,1.6vw,1.35rem); line-height:1.8; font-weight:700; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.btn { min-height:54px; display:inline-flex; align-items:center; justify-content:center; padding:0 24px; border-radius:17px; text-decoration:none; font-weight:900; transition:transform .2s,box-shadow .2s; }
.btn:hover,.btn:focus-visible { transform:translateY(-3px); outline:none; box-shadow:0 12px 24px rgba(0,0,0,.16); }
.btn-yellow { color:var(--green-dark); background:var(--yellow); } .btn-ghost { color:white; border:2px solid rgba(255,255,255,.65); }
.hero-mark { position:relative; width:min(480px,40vw); aspect-ratio:1; justify-self:center; overflow:hidden; border-radius:50%; background:white; box-shadow:0 32px 70px rgba(3,74,35,.34); }
.hero-mark::after { content:""; position:absolute; inset:18px; border:3px dashed rgba(53,174,96,.25); border-radius:50%; }
.hero-mark img { position:absolute; width:125%; height:125%; inset:-12.5% -12.5% auto auto; object-fit:contain; }
.menu-shell { width:min(1160px,calc(100% - 32px)); margin:auto; padding:72px 0 90px; }
.menu-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; }
.section-kicker { color:var(--green); font-size:.86rem; font-weight:900; letter-spacing:.05em; } .section-kicker.light { color:var(--yellow); }
.menu-heading h2,.visit-section h2 { margin:7px 0 0; font-size:clamp(2.2rem,4vw,4rem); letter-spacing:-2px; }
.search-box { width:min(360px,100%); min-height:54px; display:flex; align-items:center; gap:10px; padding:0 17px; border:2px solid var(--line); border-radius:18px; background:white; box-shadow:0 8px 25px rgba(8,120,59,.06); }
.search-box:focus-within { border-color:var(--green); } .search-box span { color:var(--green); font-size:1.5rem; }
.search-box input { width:100%; border:0; outline:0; color:var(--ink); background:transparent; }
.category-nav { position:sticky; top:78px; z-index:20; display:flex; gap:9px; margin:30px 0 40px; padding:12px 0; overflow-x:auto; scrollbar-width:none; background:linear-gradient(var(--cream) 70%,rgba(255,253,242,0)); }
.category-nav::-webkit-scrollbar { display:none; }
.category-nav button { flex:0 0 auto; min-height:44px; padding:0 18px; border:1px solid var(--line); border-radius:999px; color:var(--green-dark); background:white; font-weight:900; cursor:pointer; }
.category-nav button.active,.category-nav button:hover { color:white; border-color:var(--green-dark); background:var(--green-dark); }
.menu-section { margin:0 0 58px; scroll-margin-top:150px; }
.section-title { display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.section-title span { width:52px; height:52px; display:grid; place-items:center; border-radius:18px; color:var(--green-dark); background:var(--yellow); font-size:1.6rem; }
.section-title h3 { margin:0; font-size:clamp(1.55rem,2.4vw,2.15rem); } .section-title small { display:block; margin-top:4px; color:var(--muted); font-size:.8rem; }
.product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.product-card { min-height:166px; display:grid; grid-template-columns:1fr auto; grid-template-areas:"copy icon" "price action"; gap:14px; padding:20px; text-align:right; border:1px solid var(--line); border-radius:24px; background:white; box-shadow:0 10px 30px rgba(8,120,59,.06); transition:transform .2s,box-shadow .2s,border-color .2s; }
.product-card:hover { transform:translateY(-3px); border-color:rgba(53,174,96,.45); box-shadow:var(--shadow); }
.product-card.single-option { grid-template-areas:"copy icon" "price price"; }
.product-copy { grid-area:copy; } .product-copy h4 { margin:0 0 8px; font-size:1.05rem; line-height:1.45; } .product-copy p { margin:0; color:var(--muted); font-size:.78rem; line-height:1.5; }
.product-icon { grid-area:icon; width:54px; height:54px; display:grid; place-items:center; border-radius:18px; color:var(--green-dark); background:var(--yellow-soft); font-size:1.55rem; }
.price { grid-area:price; align-self:end; color:var(--green-dark); font-weight:900; } .price small { color:var(--muted); font-size:.7rem; }
.choose { grid-area:action; align-self:end; min-height:37px; padding:0 14px; border:0; border-radius:12px; color:white; background:var(--green); font-weight:900; cursor:pointer; }
.choose:hover,.choose:focus-visible { background:var(--green-dark); outline:3px solid rgba(53,174,96,.2); }
.empty-state { padding:50px 20px; text-align:center; color:var(--muted); font-weight:800; }
.visit-section { width:min(1160px,calc(100% - 32px)); margin:0 auto 70px; display:flex; justify-content:space-between; align-items:center; gap:40px; padding:42px; color:white; border-radius:34px; background:var(--green-dark); box-shadow:var(--shadow); }
.visit-section p { margin:12px 0 0; line-height:1.7; } .visit-actions { display:flex; flex-wrap:wrap; gap:10px; }
.visit-actions a { min-height:48px; display:inline-flex; align-items:center; padding:0 18px; border-radius:14px; text-decoration:none; font-weight:900; background:var(--yellow); color:var(--green-dark); }
.visit-actions a:last-child { color:white; border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.1); }
footer { min-height:100px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px max(7vw,calc((100vw - 1160px)/2)); color:white; background:var(--green-deep); }
footer strong,footer span { display:block; } footer span { margin-top:5px; color:var(--yellow); font-size:.8rem; }
.footer-phones { display:flex; gap:10px; direction:ltr; } .footer-phones a { padding:10px 14px; border:1px solid rgba(255,255,255,.22); border-radius:12px; text-decoration:none; font-weight:800; }
.site-credit { color:var(--yellow); text-decoration:none; font-size:.82rem; font-weight:800; }
.site-credit:hover,.site-credit:focus-visible { text-decoration:underline; outline:none; }
.sheet[hidden] { display:none; } .sheet { position:fixed; inset:0; z-index:60; display:grid; align-items:end; }
.sheet-backdrop { position:absolute; inset:0; border:0; background:rgba(1,30,15,.62); backdrop-filter:blur(5px); cursor:pointer; }
.sheet-panel { position:relative; z-index:1; width:min(620px,100%); max-height:88vh; margin-inline:auto; overflow-y:auto; padding:30px; border-radius:32px 32px 0 0; background:white; box-shadow:0 -25px 80px rgba(0,0,0,.25); animation:sheet-up .25s ease-out; }
@keyframes sheet-up { from { transform:translateY(35px); opacity:.6; } }
.sheet-close { position:absolute; top:18px; left:18px; width:40px; height:40px; border:0; border-radius:50%; color:var(--ink); background:#f3f6f2; font-size:1.5rem; cursor:pointer; }
.sheet-icon { width:72px; height:72px; display:grid; place-items:center; margin-bottom:16px; border-radius:23px; color:var(--green-dark); background:var(--yellow); font-size:2.2rem; }
.sheet-category { color:var(--green); font-size:.8rem; font-weight:900; } .sheet-panel h2 { margin:5px 0 8px; font-size:2rem; }
.sheet-panel>p { margin:0 0 24px; color:var(--muted); line-height:1.6; } .variant-list { margin:0; padding:0; border:0; }
.variant-list legend { width:100%; margin-bottom:12px; font-weight:900; }
.variant-option { display:flex; align-items:center; gap:12px; min-height:58px; margin-bottom:9px; padding:0 16px; border:2px solid var(--line); border-radius:16px; cursor:pointer; }
.variant-option:has(input:checked) { border-color:var(--green); background:#f1fff6; } .variant-option input { accent-color:var(--green); }
.variant-option span { font-weight:800; } .variant-option strong { margin-right:auto; color:var(--green-dark); }
.sheet-total { display:flex; align-items:center; justify-content:space-between; margin:22px 0 13px; padding-top:18px; border-top:1px solid var(--line); }
.sheet-total strong { color:var(--green-dark); font-size:1.3rem; }
.call-order { width:100%; min-height:56px; display:flex; align-items:center; justify-content:center; border:0; border-radius:17px; color:var(--green-dark); background:var(--yellow); text-decoration:none; font-weight:900; cursor:pointer; }
.note-field { display:block; margin-top:22px; font-weight:900; }
.note-field span { color:var(--muted); font-size:.75rem; }
.note-field textarea { width:100%; margin-top:9px; padding:14px; resize:vertical; border:2px solid var(--line); border-radius:15px; color:var(--ink); background:white; outline:0; }
.note-field textarea:focus { border-color:var(--green); }
.quantity-row { min-height:64px; display:flex; align-items:center; justify-content:space-between; margin-top:16px; padding:10px 15px; border:1px solid var(--line); border-radius:16px; }
.quantity-control { display:flex; align-items:center; gap:15px; direction:ltr; }
.quantity-control button { width:38px; height:38px; border:0; border-radius:12px; color:var(--green-dark); background:var(--yellow-soft); font-size:1.3rem; font-weight:900; cursor:pointer; }
.quantity-control span { min-width:18px; text-align:center; font-weight:900; }
.cart-bar { position:fixed; z-index:45; right:50%; bottom:18px; transform:translateX(50%); width:min(560px,calc(100% - 24px)); min-height:60px; display:flex; align-items:center; justify-content:space-between; padding:0 22px; border:0; border-radius:19px; color:white; background:var(--green-dark); box-shadow:0 18px 45px rgba(2,66,31,.35); font-weight:900; cursor:pointer; }
.cart-bar[hidden] { display:none; }
.cart-bar b { min-width:25px; height:25px; display:inline-grid; place-items:center; margin-right:7px; border-radius:50%; color:var(--green-dark); background:var(--yellow); }
.cart-panel h2 { margin:4px 0 24px; font-size:2rem; }
.cart-items { display:grid; gap:11px; }
.cart-line { padding:15px; border:1px solid var(--line); border-radius:17px; background:#fff; }
.cart-line-head { display:flex; justify-content:space-between; gap:15px; }
.cart-line h3 { margin:0; font-size:1rem; }
.cart-line-head strong { color:var(--green-dark); white-space:nowrap; }
.cart-line small { display:block; margin-top:5px; color:var(--muted); }
.cart-line-note { margin:7px 0 0; color:var(--muted); font-size:.8rem; }
.cart-line-actions { display:flex; align-items:center; justify-content:space-between; margin-top:12px; }
.cart-line-actions .quantity-control button { width:32px; height:32px; }
.remove-item { border:0; color:#d53333; background:#fff0f0; border-radius:10px; padding:7px 11px; font-weight:900; cursor:pointer; }
.cart-empty { padding:35px 10px; text-align:center; color:var(--muted); }
.cart-total { display:flex; justify-content:space-between; margin:22px 0 14px; padding-top:18px; border-top:2px solid var(--line); font-size:1.25rem; }
.order-type { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.order-type button { min-height:49px; border:1px solid var(--line); border-radius:14px; color:var(--ink); background:white; font-weight:900; cursor:pointer; }
.order-type button.active { color:white; border-color:var(--green-dark); background:var(--green-dark); }
.order-hint { margin:14px 0; padding:11px; border-radius:12px; color:#8a6b16!important; background:#fff8db; text-align:center; font-size:.76rem; }
.whatsapp-order { min-height:56px; display:flex; align-items:center; justify-content:center; border-radius:16px; color:white; background:#159447; text-decoration:none; font-weight:900; }
.whatsapp-order.disabled { opacity:.45; pointer-events:none; }
body.sheet-open { overflow:hidden; }
@media (max-width:900px) { .top-links a:not(:last-child){display:none}.menu-hero{min-height:auto;grid-template-columns:1fr;gap:35px;padding:48px 22px;text-align:center}.hero-copy p{margin-inline:auto}.hero-actions{justify-content:center}.hero-mark{width:min(380px,76vw);grid-row:1}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.visit-section{align-items:flex-start;flex-direction:column} }
@media (max-width:620px) { .header-inner{width:calc(100% - 22px);min-height:70px}.brand-crop{width:50px;height:50px}.brand strong{font-size:.95rem}.brand small{display:none}.top-links a{padding:9px 12px;font-size:.78rem;background:var(--yellow);color:var(--green-dark)}.menu-hero{padding-top:32px}.status{font-size:.75rem}.hero-copy h1{font-size:clamp(3.8rem,19vw,5.7rem);letter-spacing:-4px}.hero-copy p{font-size:.98rem}.hero-actions,.btn{width:100%}.hero-mark{width:min(300px,76vw)}.menu-shell{width:calc(100% - 24px);padding:48px 0 65px}.menu-heading{align-items:stretch;flex-direction:column;gap:18px}.search-box{width:100%}.category-nav{top:70px;margin-bottom:28px}.product-grid{grid-template-columns:1fr}.product-card{min-height:148px}.visit-section{width:calc(100% - 24px);margin-bottom:35px;padding:27px 22px;border-radius:25px}.visit-actions,.visit-actions a{width:100%;justify-content:center}footer{align-items:flex-start;flex-direction:column}.footer-phones{width:100%;flex-wrap:wrap}.sheet-panel{padding:26px 20px 22px} }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
