@charset "UTF-8";
:root{--deep:#4B0F5F;--deeper:#241029;--purple:#8930A6;--lime:#78D449;--cream:#FAF5FC;--ink:#231025;--muted:#6e6170;--line:rgba(35,16,37,.16);--heading:'Plus Jakarta Sans',sans-serif;--body:'Nunito Sans',sans-serif;--header-height:78px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + env(safe-area-inset-top,0px) + 24px);overflow-x:clip;overscroll-behavior-x:none;touch-action:pan-y}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--body);line-height:1.6;overflow-x:clip;overscroll-behavior-x:none;touch-action:pan-y}@supports not (overflow:clip){html{overflow-x:hidden}}body.scroll-locked{overflow:hidden}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed}a{color:inherit;text-decoration:none}img{display:block;width:100%;height:100%;object-fit:cover;color:var(--cream);font-size:.85rem}button{border:0}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-family:var(--heading);font-weight:700;line-height:1.04}h2{font-size:clamp(2.5rem,6vw,4.8rem);letter-spacing:-.025em}h3{font-size:1.8rem}::selection{background:var(--lime);color:var(--deep)}:focus-visible{outline:3px solid var(--purple);outline-offset:5px}.menu-section :focus-visible,.site-header :focus-visible,.hero :focus-visible{outline-color:var(--lime)}[hidden]{display:none!important}.svg-library{position:absolute;width:0;height:0;overflow:hidden}.icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.container{width:min(1240px,calc(100% - 36px));margin-inline:auto}.eyebrow{font-size:.75rem;font-weight:700;letter-spacing:.12em;line-height:1.5}.purple-text{color:var(--purple)}.skip-link{position:fixed;top:8px;left:12px;background:var(--lime);color:var(--deep);padding:12px 20px;z-index:200;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}
.site-header{height:var(--header-height);height:calc(var(--header-height) + env(safe-area-inset-top,0px));position:fixed;inset:0 0 auto;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:0 max(18px,calc((100vw - 1240px)/2));padding-top:env(safe-area-inset-top,0px);background:rgba(38,11,59,.94);border-bottom:1px solid #ffffff1c;color:var(--cream);backdrop-filter:blur(14px)}.site-header::before{content:'';position:absolute;left:0;right:0;bottom:100%;height:200px;background:#260B3B;pointer-events:none}.brand{display:flex;flex-direction:column;font-family:var(--heading);font-size:2rem;font-weight:600;line-height:.85;letter-spacing:-.04em;width:max-content;flex-shrink:0}.brand>span{font-family:var(--body);font-size:.75rem;letter-spacing:.12em;margin-top:7px;font-weight:700;display:flex;align-items:center;gap:7px}.brand-dot{color:var(--lime);font-size:1.15rem;line-height:.6}.site-header nav{display:flex;align-items:center;gap:18px}.nav-link{font-size:.85rem;font-weight:700;position:relative}.nav-link:after{content:'';position:absolute;bottom:-5px;left:0;width:100%;height:2px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .2s}.nav-link:hover:after{transform:scaleX(1)}.secondary-nav,.cart-label{display:none}.cart-trigger{display:flex;align-items:center;gap:9px;min-height:44px;background:transparent;border:1px solid #ffffff45;border-radius:40px;color:var(--cream);padding:8px 10px;transition:background .2s,transform .2s}.cart-trigger:hover{background:#ffffff16;transform:translateY(-2px)}.cart-count{background:var(--lime);color:var(--deep);font-size:.75rem;font-weight:700;min-width:24px;height:24px;padding-inline:5px;border-radius:50%;display:grid;place-items:center}.cart-count.bump{animation:count-bump .35s ease}.hero{position:relative;isolation:isolate;min-height:780px;min-height:max(740px,100svh);background:radial-gradient(ellipse at 80% 40%,#a43cd3,#4e146c 45%,#240c37 85%);color:var(--cream);display:flex;align-items:center;padding:calc(var(--header-height) + 68px) 0 140px;overflow:hidden}.hero-image{position:absolute;inset:0;z-index:-3;object-position:64% center}.hero-overlay{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(25,6,37,.88),rgba(38,11,59,.54) 57%,rgba(38,11,59,.1)),linear-gradient(0deg,rgba(25,6,37,.7),transparent 45%)}.hero .eyebrow{display:flex;align-items:center;gap:9px;color:var(--lime)}.little-star{font-size:1.4rem}.hero h1{font-size:clamp(3.4rem,8.1vw,7.6rem);letter-spacing:-.04em;line-height:.97;margin:24px 0;max-width:850px}.hero h1 span{color:var(--lime);display:inline-block;position:relative}.hero h1 span:after{content:'';position:absolute;bottom:-9px;left:0;right:0;height:7px;border-top:3px solid currentColor;border-radius:50%;transform:rotate(-4deg)}.hero-copy{font-size:1rem;max-width:360px;color:#f4eaf8;margin:30px 0}.action-button{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;justify-content:space-between;align-items:center;gap:20px;background:var(--lime);color:var(--deep);border:2px solid var(--lime);border-radius:50px;padding:16px 24px;min-height:58px;font-weight:700;font-size:1rem;line-height:1.35;box-shadow:0 5px 0 rgba(0,0,0,.15);transition:transform .22s,box-shadow .22s,color .22s}.action-button:before{content:'';position:absolute;z-index:-1;inset:-2px;background:var(--deep);border-radius:inherit;transform:translateX(-103%);transition:transform .3s cubic-bezier(.2,.8,.2,1)}.action-button:hover{color:var(--lime);transform:translateY(-3px);box-shadow:0 9px 0 rgba(0,0,0,.15)}.action-button:hover:before{transform:translateX(0)}.action-button .icon{transition:transform .25s}.action-button:hover .icon{transform:translateX(4px)}.action-button:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(0,0,0,.15)}.action-button:disabled{background:#ddd5df;border-color:#ddd5df;color:#75667c;box-shadow:none;transform:none}.action-button:disabled:before{display:none}.hero-delivery{display:flex;align-items:center;gap:8px;font-size:.85rem;margin-top:24px}.hero-delivery .icon{width:18px;height:18px}.hero-stamp{display:none}.hero-bottom{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);width:min(1240px,calc(100% - 36px));padding-top:18px;border-top:1px solid #ffffff45;display:flex;justify-content:space-between;align-items:center;font-size:.85rem}.hero-bottom>span:last-child{font-size:1.8rem;color:var(--lime)}
.trust-strip{background:var(--lime);padding:23px 18px;display:flex;flex-wrap:wrap;justify-content:center;gap:14px 32px}.trust-strip>div{display:flex;align-items:center;gap:9px;font-size:.85rem}.trust-star{display:none}.editorial{padding-block:75px 85px;display:grid;gap:45px;overflow:hidden}.editorial-copy h2{margin:20px 0 24px}.editorial-copy h2 span,.how-heading h2 span{color:var(--purple)}.editorial-copy>p:not(.eyebrow){max-width:420px;color:var(--muted);font-size:1rem}.text-link{display:inline-flex;gap:25px;align-items:center;font-weight:700;border-bottom:2px solid var(--purple);padding:10px 0;margin-top:23px}.text-link span{font-size:1.4rem;color:var(--purple);transition:transform .2s}.text-link:hover span{transform:translate(3px,-3px)}.editorial-art{position:relative;min-height:365px;padding:0 42px 70px 0}.editorial-main{height:300px;border-radius:150px 150px 18px 18px;background:var(--purple);overflow:hidden;transform:rotate(-5deg);position:relative}.editorial-main img,.editorial-small img{transition:transform .6s}.editorial-art:hover img{transform:scale(1.05)}.editorial-main figcaption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#260b3bed);padding:40px 20px 22px;color:var(--cream);font-weight:700;font-size:.85rem}.editorial-small{position:absolute;right:0;bottom:0;width:46%;height:220px;background:var(--deep);border:7px solid var(--cream);border-radius:90px 90px 12px 12px;transform:rotate(8deg);overflow:hidden}.editorial-small figcaption{position:absolute;inset:auto 0 0;padding:18px 10px;background:linear-gradient(transparent,#260b3b);color:var(--cream);font-size:.75rem;font-weight:700}.editorial-flower{position:absolute;top:15px;right:0;color:var(--lime);font-size:6rem;line-height:1;text-shadow:2px 2px var(--deep);transform:rotate(12deg)}
.menu-section{position:relative;background:var(--deep);color:var(--cream);padding:70px 0 80px;overflow:clip}.sequence-progress{position:absolute;inset:0 0 auto;height:5px;background:#ffffff12}.sequence-progress span{display:block;background:var(--lime);height:100%;transform:scaleX(0);transform-origin:left}.menu-heading{display:grid;gap:25px}.menu-heading .eyebrow{color:var(--lime);margin-bottom:20px}.menu-heading h2 span{color:var(--lime)}.menu-heading>p{max-width:290px;color:#d7c9e3}.menu-disclaimer{margin-top:32px;border-left:3px solid var(--lime);padding:12px 16px;background:#ffffff08;font-size:.85rem;color:#dbcee4;max-width:840px}.menu-disclaimer strong{color:var(--cream)}.filter-wrap{margin-top:35px}.category-filters{display:flex;gap:9px;overflow-x:auto;padding:7px 3px 14px;scrollbar-width:thin;scrollbar-color:var(--purple) transparent}.filter-button{background:transparent;color:var(--cream);border:1px solid #ffffff40;border-radius:35px;padding:12px 20px;white-space:nowrap;font-weight:700;font-size:1rem;min-height:46px;transition:color .2s,background .2s,transform .2s}.filter-button:hover{background:#ffffff14;transform:translateY(-2px)}.filter-button[aria-pressed="true"]{background:var(--lime);border-color:var(--lime);color:var(--deep)}.catalog-meta{display:flex;justify-content:space-between;gap:20px;font-size:.75rem;color:#c5b6d2;margin:13px 0 24px}.catalog-meta>span{display:none}.product-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}.product-card{min-width:0}.product-open{display:flex;flex-direction:column;position:relative;width:100%;height:100%;text-align:left;background:#35144d;color:var(--cream);border:1px solid #ffffff1a;border-radius:20px;overflow:hidden;transition:transform .25s,border-color .25s,box-shadow .25s;padding:0}.product-open:hover{transform:translateY(-7px);border-color:var(--lime);box-shadow:0 14px 30px #10051980}.product-photo{position:relative;aspect-ratio:1.2;overflow:hidden;width:100%;background:radial-gradient(ellipse at 60% 40%,#a365d5,#5d2388 65%,#3a1558)}.product-card:nth-child(4n+2) .product-photo{background:radial-gradient(ellipse at 55% 40%,#c0bd7c,#79678e 70%,#523265)}.product-card:nth-child(4n+3) .product-photo{background:radial-gradient(ellipse at 50% 50%,#ce9fbf,#854e9c 70%,#47235c)}.product-photo img{transition:transform .5s cubic-bezier(.2,.7,.2,1)}.product-open:hover img{transform:scale(1.065)}.product-category{position:absolute;top:15px;left:15px;background:var(--cream);color:var(--deep);border-radius:30px;font-size:.75rem;font-weight:700;padding:6px 13px}.image-label{position:absolute;bottom:12px;left:15px;color:white;background:#260b3bc7;padding:3px 9px;border-radius:20px;font-size:.75rem}.product-info{padding:22px;display:flex;flex-direction:column;flex:1;width:100%}.product-info h3{font-size:1.8rem;margin-bottom:12px;line-height:1.1}.product-description{color:#d9cce2;font-size:.85rem;flex:1;line-height:1.55}.product-placeholder{font-size:.75rem;color:#d9cce2;margin-top:14px}.product-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:18px;padding-top:18px;border-top:1px solid #ffffff21}.product-price{font-family:var(--heading);font-size:1.4rem;font-weight:700}.estimated-label{display:block;color:#d9cce2;font-size:.75rem;font-family:var(--body);font-weight:600;margin-top:3px}.product-add{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;background:var(--lime);color:var(--deep);border-radius:50%;font-size:1.8rem;transition:transform .25s}.product-open:hover .product-add{transform:rotate(90deg)}.noscript-note{padding:30px 0}.noscript-note a{text-decoration:underline}
.how-section{padding-block:75px}.how-heading h2{margin-top:20px}.steps{display:grid;gap:16px;margin-top:38px}.step{position:relative;padding:30px 25px;background:#efe7f5;border:1px solid #e5d8ef;border-radius:18px}.step:nth-child(2){background:#e3d4f6}.step:nth-child(3){background:var(--lime);border-color:var(--lime)}.step-number{display:block;font-family:var(--heading);font-size:3.8rem;color:var(--purple);line-height:1;margin-bottom:35px}.step h3{margin-bottom:14px}.step p{font-size:1rem;max-width:290px}.step-arrow{position:absolute;top:30px;right:25px;font-size:2rem}.contact-band{background:var(--purple);color:var(--cream);padding:45px 0}.contact-band .container{display:flex;flex-direction:column;align-items:flex-start;gap:27px}.contact-band h2{font-size:clamp(2rem,4vw,3.2rem);margin-top:12px}.site-footer{padding-block:40px;display:flex;flex-direction:column;gap:26px;font-size:.85rem;color:var(--muted)}.footer-brand{color:var(--deep)}.footer-brand .brand-dot{color:var(--purple)}.site-footer>a:last-child{color:var(--deep)}
.overlay{position:fixed;inset:0;z-index:100;background:rgba(17,4,27,.76);backdrop-filter:blur(7px);overscroll-behavior:contain}.modal-overlay{display:flex;align-items:center;justify-content:center;padding:14px}.product-modal{position:relative;background:var(--cream);width:min(800px,100%);max-height:calc(100dvh - 28px);overflow-y:auto;border-radius:24px;box-shadow:0 25px 90px #10051970;animation:modal-in .25s ease}.icon-button{width:44px;height:44px;display:grid;place-items:center;background:var(--cream);color:var(--deep);border:1px solid var(--line);border-radius:50%;flex-shrink:0;transition:background .2s,transform .2s}.icon-button:hover{background:var(--lime);transform:rotate(8deg)}.close-button{position:absolute;top:14px;right:14px;z-index:2;box-shadow:0 3px 10px #260b3b26}.modal-visual{height:200px;background:radial-gradient(ellipse at center,#ab65d3,#4e176a);position:relative}.modal-content{padding:24px}.modal-content h2{font-size:2.4rem;margin:12px 0 16px;line-height:1.05}.modal-content>p:not(.eyebrow){font-size:.85rem}.placeholder-note{color:var(--muted);margin-top:14px}.modal-price{margin-top:18px}.modal-price strong{font-family:var(--heading);font-size:1.8rem;font-weight:700}.modal-price span{font-size:.75rem;color:var(--muted)}.quantity-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:20px 0;margin-top:12px;border-top:1px solid var(--line);font-weight:700}.quantity-control{display:flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:40px;padding:3px}.quantity-control button{width:42px;height:42px;background:transparent;border-radius:50%;color:var(--deep);font-size:1.4rem}.quantity-control button:hover:not(:disabled){background:#e5d5f7}.quantity-control button:disabled{opacity:.3}.quantity-control output{min-width:30px;text-align:center}.add-button{width:100%;gap:10px;font-size:.85rem;padding-inline:17px}.add-button strong{white-space:nowrap}.small-note{font-size:.75rem!important;color:var(--muted);line-height:1.5;margin-top:12px}.cart-overlay{display:flex;justify-content:flex-end}.cart-panel{width:min(480px,100%);height:100%;background:var(--cream);display:flex;flex-direction:column;box-shadow:-20px 0 80px #10051960;animation:drawer-in .3s ease}.cart-heading{padding:25px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);flex-shrink:0}.cart-heading h2{font-size:2rem;margin-top:10px}.cart-heading h2 span{color:var(--purple)}.cart-heading .eyebrow{font-size:.75rem}.cart-body{overflow-y:auto;padding:8px 20px 30px;overscroll-behavior:contain}.cart-empty{padding:38px 12px;text-align:center}.empty-bag{width:70px;height:70px;display:grid;place-items:center;background:#eee1f8;color:var(--purple);border-radius:50%;margin:0 auto 20px}.empty-bag .icon{width:32px;height:32px}.cart-empty h3{font-size:1.4rem}.cart-empty p{font-size:.85rem;color:var(--muted);margin:12px 0 20px}.empty-menu-button{background:var(--deep);color:var(--cream);padding:12px 20px;min-height:44px;border-radius:40px;font-weight:700}.cart-item{display:grid;grid-template-columns:65px minmax(0,1fr);gap:14px;border-bottom:1px solid var(--line);padding:20px 0}.cart-item-image{width:65px;height:80px;border-radius:10px;overflow:hidden;background:var(--purple)}.cart-item h3{font-size:1.15rem;line-height:1.15;margin-bottom:6px}.cart-item p{font-size:.75rem;color:var(--muted)}.cart-item-bottom{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:center;margin-top:9px}.cart-item-bottom strong{font-size:1rem}.remove-item{color:var(--purple);background:transparent;font-size:.75rem;text-decoration:underline;text-underline-offset:3px;min-height:44px;padding:6px 3px}.remove-item:hover{color:var(--deep)}.cart-total-row{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-top:24px;font-weight:700}.cart-total-row strong{font-family:var(--heading);font-size:1.8rem;font-weight:700}#checkout-form{margin-top:30px;padding-top:24px;border-top:1px solid var(--line)}#checkout-form h3{font-size:1.4rem;margin-bottom:20px}#checkout-form label{display:block;font-size:.85rem;font-weight:700;margin:16px 0 7px}#checkout-form input{width:100%;min-height:50px;padding:12px 14px;background:white;border:1px solid #cec0d6;border-radius:10px;color:var(--deep)}#checkout-form input::placeholder{color:#85758f;font-size:.85rem}.checkout-button{width:100%;margin-top:23px}.checkout-help{max-width:360px}.toast{position:fixed;bottom:22px;left:50%;z-index:150;background:var(--lime);color:var(--deep);border:1px solid var(--deep);border-radius:15px;padding:14px 22px;font-size:.85rem;font-weight:700;width:max-content;max-width:calc(100% - 32px);box-shadow:0 8px 32px #260b3b30;transform:translate(-50%,24px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.toast.is-visible{opacity:1;transform:translate(-50%,0)}
.motion-enabled .reveal{opacity:0;transform:translateY(30px);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0ms)}.motion-enabled .reveal.is-visible{opacity:1;transform:translateY(0)}@keyframes modal-in{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes drawer-in{from{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes count-bump{50%{transform:scale(1.3)}}
@media(min-width:560px){.container{width:min(1240px,calc(100% - 56px))}.site-header{padding-inline:max(28px,calc((100vw - 1240px)/2))}.secondary-nav{display:block}.hero-copy{font-size:1.15rem}.hero-bottom{width:min(1240px,calc(100% - 56px))}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.catalog-meta>span{display:block}.editorial-art{width:90%;max-width:540px;margin-inline:auto;min-height:440px}.editorial-main{height:380px}.editorial-small{height:255px}.editorial-flower{font-size:8rem}.modal-content{padding:30px}.modal-visual{height:240px}.trust-strip{gap:20px 35px}.cart-heading{padding:28px}.cart-body{padding:8px 28px 35px}}
@media(min-width:800px){:root{--header-height:88px}.site-header nav{gap:30px}.cart-label{display:inline;font-size:.85rem;font-weight:700}.cart-trigger{padding:10px 13px 10px 17px}.hero{min-height:860px;min-height:max(800px,100svh)}.hero-content{padding-bottom:15px}.hero-copy{max-width:390px}.hero-stamp{position:absolute;right:7%;bottom:17%;display:flex;flex-direction:column;align-items:center;justify-content:center;width:165px;height:165px;background:var(--lime);color:var(--deep);border-radius:50%;transform:rotate(11deg);outline:1px dashed var(--deep);outline-offset:-9px;gap:7px;box-shadow:0 10px 40px #260b3b40}.hero-stamp strong{font-family:var(--heading);font-size:1.8rem;line-height:1;text-align:center;font-weight:700}.hero-stamp>span{font-size:.75rem;font-weight:700;letter-spacing:.12em}.trust-star{display:block;font-size:1.4rem;line-height:1}.trust-strip{align-items:center;gap:22px 35px}.editorial{grid-template-columns:1fr 1.05fr;align-items:center;padding-block:110px;gap:55px}.editorial-art{width:100%;min-height:470px}.editorial-main{height:400px}.editorial-small{height:280px}.menu-section{padding-block:95px 105px}.menu-heading{grid-template-columns:1fr 300px;align-items:end;gap:50px}.menu-heading>p{padding-bottom:8px}.how-section{padding-block:100px}.steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.step{padding:30px 24px}.step h3{font-size:1.4rem}.contact-band .container{flex-direction:row;align-items:center;justify-content:space-between;gap:35px}.site-footer{flex-direction:row;align-items:center;justify-content:space-between;padding-block:50px}.product-modal{display:grid;grid-template-columns:.9fr 1.1fr}.modal-visual{height:100%;min-height:510px}.modal-content{padding:55px 30px 35px}.modal-content h2{font-size:2.4rem}}
@media(min-width:1100px){.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.product-card:nth-child(5n+1){grid-column:span 2}.product-card:nth-child(5n+1) .product-photo{aspect-ratio:2.55}.product-card:nth-child(5n+1) .product-info h3{font-size:2rem}.product-photo{aspect-ratio:1.2}.product-info{padding:25px}.hero-stamp{right:10%;bottom:18%;width:185px;height:185px}.hero-stamp strong{font-size:1.8rem}.editorial-art{min-height:520px}.editorial-main{height:450px}.editorial-small{height:300px}.editorial{gap:85px}.trust-strip{gap:25px 55px}.step{padding:35px}.step h3{font-size:1.8rem}}
@media(max-width:359px){.site-header nav{gap:10px}.nav-link{font-size:.75rem}.hero h1{font-size:3.15rem}.hero .action-button{font-size:.85rem;padding-inline:18px}.add-button{font-size:.75rem;gap:6px;padding-inline:12px}.modal-content{padding:20px}.cart-heading h2{font-size:1.8rem}.hero-stamp{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.motion-enabled .reveal{opacity:1;transform:none}.action-button:hover,.product-open:hover,.cart-trigger:hover,.filter-button:hover{transform:none}.product-open:hover img,.editorial-art:hover img{transform:none}.sequence-progress{display:none}}
.brand-logo { width: 112px; height: 56px; }
.brand-logo img { width: 100%; height: 100%; object-fit: contain; }
.quiz-progress { height: 5px; margin: 0 -24px 22px; background: #eadff1; }
.quiz-progress span { display: block; height: 100%; background: var(--purple); transition: width .25s ease; }
.quiz-step-label { color: var(--purple); font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform: uppercase; }
.quiz-group { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.quiz-group h3 { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 12px; font-size: 1.15rem; }
.quiz-count { color: var(--muted); font: 700 .75rem var(--body); white-space: nowrap; }
.quiz-options { display: grid; gap: 8px; max-height: 270px; overflow: auto; }
.quiz-option { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; cursor: pointer; }
.quiz-option:has(input:checked) { border-color: var(--purple); color: var(--purple); background: #f4eafa; }
.quiz-option input { accent-color: var(--purple); }
.quiz-option small { margin-left: auto; color: var(--muted); }
.quiz-actions { display: flex; gap: 10px; margin-top: 24px; }
.quiz-actions button { flex: 1; min-height: 46px; border-radius: 8px; font-weight:700; }
.quiz-back { border: 1px solid var(--purple); color: var(--purple); background: transparent; }
.quiz-next { color: #fff; background: var(--purple); }
.quiz-next:disabled { opacity: .45; }
.quiz-summary { padding: 14px; border-radius: 10px; background: #f4eafa; color: var(--muted); font-size: .85rem; line-height: 1.6; }
.quiz-summary strong { color: var(--purple-dark); }
.cart-item { grid-template-columns: 64px minmax(0, 1fr) auto; align-items: start; gap: 12px; }
.cart-item-image { width: 64px; height: 64px; overflow: hidden; border-radius: 12px; background: #eee7f3; }
.cart-item-image img { width: 100%; height: 100%; object-fit: cover; }
.cart-item h3 { margin: 0 0 4px; font-size: 1rem; line-height: 1.15; }
.cart-item p { margin: 0 0 6px; color: var(--muted); font-size: .75rem; line-height: 1.45; }
.cart-item > button { align-self: start; padding: 4px 0; color: var(--purple); background: transparent; font-size:.75rem; font-weight:700; }
.address-title { margin: 26px 0 0; padding-top: 20px; border-top: 1px solid var(--line); font-size: 1.15rem; }
.address-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 10px; }
.cart-panel label span { color: var(--muted); font-weight: 400; }
.address-title + label { margin-top: 14px; }
.address-grid + .small-note, #address-status { margin-top: 8px; }
@media(max-width:559px) { .cart-panel { padding: 18px; } .cart-item { grid-template-columns: 54px minmax(0, 1fr) auto; gap: 9px; } .cart-item-image { width: 54px; height: 54px; } .address-grid { grid-template-columns: 1fr; gap: 0; } }
.cart-quantity { padding: 2px; }
.cart-quantity button { width: 34px; height: 34px; font-size: 1.15rem; }
.cart-quantity output { min-width: 22px; font-weight:700; }
.quiz-summary + .quantity-row { margin-top: 16px; }

/* Cardápio agrupado por categoria */
.product-grid { display: flex; flex-direction: column; gap: 28px; }
.menu-group { display: grid; grid-template-columns: minmax(0, 1fr); background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1); border-radius: 22px; overflow: hidden; }
/* Capa do grupo: 4:3 no celular mostra o copo inteiro (borda+cobertura ~10% ate base ~89% da foto 1200x805) */
.menu-group-photo { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #3a1558; }
.menu-group-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; transform-origin: 50% 60%; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.menu-group:hover .menu-group-photo img { transform: scale(1.04); }
/* Selo compacto (2 linhas) no canto superior direito: area so de fundo, acima dos potinhos (~28% da altura) e fora da faixa central do copo (~33-67% da largura). Em 1 linha ele invadia a faixa do copo em 360px. */
.menu-group-photo .image-label { position: absolute; left: auto; bottom: auto; top: 8px; right: 8px; width: min-content; padding: 4px 9px; border-radius: 10px; line-height: 1.25; text-align: center; pointer-events: none; }
.menu-group-body { padding: 22px 22px 14px; color: var(--cream); min-width: 0; }
.menu-group-copy { display: flex; flex-direction: column; gap: 12px; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.14); }
.menu-group-index { color: var(--lime); font: 700 .75rem var(--body); letter-spacing:.12em; }
.menu-group-copy h3 { font-family: var(--heading); font-size: 2rem; line-height: 1; margin: 6px 0 8px; }
.menu-group-copy p { color: rgba(255,255,255,.72); font-size: 1rem; max-width: 42ch; }
.menu-group-meta { font-size: .75rem; color: rgba(255,255,255,.6); }
.menu-group-meta strong { color: var(--lime); font-size: 1rem; }
.menu-group-meta em { font-style: normal; font-size:.75rem; }
.menu-group-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 28px; }
.menu-subgroup h4 { margin: 18px 0 2px; color: var(--lime); font: 700 .78rem var(--body); letter-spacing:.12em; text-transform: uppercase; }
.menu-row { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 60px; padding: 10px 0; background: transparent; color: var(--cream); border-bottom: 1px solid rgba(255,255,255,.1); text-align: left; cursor: pointer; }
.menu-group-list > .menu-row:last-child, .menu-subgroup .menu-row:last-child { border-bottom: 0; }
.menu-row-name { font-weight:700; font-size: 1rem; }
.menu-row-dots { flex: 1; min-width: 12px; border-bottom: 2px dotted rgba(255,255,255,.18); transform: translateY(4px); }
.menu-row-price { font-family: var(--heading); font-size: 1.15rem; white-space: nowrap; }
.menu-row-add { width: 36px; height: 36px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: var(--lime); color: var(--deep); font-size: 1.15rem; font-weight: 700; transition: transform .2s; }
.menu-row:hover .menu-row-add, .menu-row:focus-visible .menu-row-add { transform: scale(1.12) rotate(90deg); }
.menu-row:hover .menu-row-name { color: var(--lime); }
@media (min-width: 760px) {
  .menu-group { grid-template-columns: 300px minmax(0, 1fr); }
  .menu-group-photo { aspect-ratio: auto; min-height: 250px; }
  .menu-group-photo img { position: absolute; inset: 0; }
  /* Desktop: coluna em retrato amplia a foto e o topo do copo sobe ate o canto; selo volta a 1 linha sobre o chao, abaixo da base do copo */
  .menu-group-photo .image-label { top: auto; bottom: 8px; width: auto; padding: 2px 8px; border-radius: 20px; }
  .menu-group-body { padding: 28px 30px 18px; }
  .menu-group-copy { flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 24px; }
  .menu-group-meta { text-align: right; flex-shrink: 0; }
  .menu-group-list:not(.is-split) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .menu-group-list:not(.is-split) > .menu-row:nth-last-child(2):nth-child(odd) { border-bottom: 0; }
}
@media (min-width: 1100px) {
  .menu-group-list.is-split { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Tipografia e horário de funcionamento */
h1, h2, h3, h4 { font-weight: 800; letter-spacing: -.03em; }
.menu-row-price, .menu-group-meta strong, .cart-total-row strong, .modal-price strong { font-family: var(--heading); font-weight: 700; letter-spacing: -.01em; }
.menu-row-name { font-weight: 700; }
.hero-delivery { flex-wrap: wrap; gap: 8px 12px; font-size: .85rem; }
.hero-delivery-time { display: inline-flex; align-items: center; gap: 8px; }
.hero-delivery-sep { opacity: .5; }
.open-status { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 40px; background: rgba(255,255,255,.12); font-weight: 700; }
.open-dot { width: 8px; height: 8px; border-radius: 50%; background: #ffd27a; box-shadow: 0 0 0 3px rgba(255,210,122,.25); }
.open-status.is-open .open-dot { background: #6ee7a0; box-shadow: 0 0 0 3px rgba(110,231,160,.25); animation: open-pulse 2s ease-in-out infinite; }
@keyframes open-pulse { 50% { box-shadow: 0 0 0 6px rgba(110,231,160,0); } }
@media (prefers-reduced-motion: reduce) { .open-status.is-open .open-dot { animation: none; } }
.closed-note { margin-top: 20px; padding: 12px 14px; border-radius: 10px; background: #fff4e5; color: #7a4a00; font-size: .85rem; line-height: 1.5; }
.contact-note { margin-top: 10px; font-size: 1rem; opacity: .85; }
.site-footer p strong { color: var(--deep); }
h1, h2 { letter-spacing: -.02em; word-spacing: .05em; }
.hero h1 { font-size: clamp(3rem, 7vw, 6.2rem); letter-spacing: -.025em; line-height: 1; }

/* Logo: a imagem tem ~12,5% de borda transparente em cada lado, então ampliamos e recortamos */
.brand-logo { width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: #fff; box-shadow: 0 4px 18px rgba(0,0,0,.25); transition: transform .25s; }
.brand-logo img { width: 134%; height: 134%; max-width: none; margin: -17%; object-fit: contain; }
.brand-logo:hover { transform: scale(1.05) rotate(-3deg); }
@media (min-width: 800px) { .brand-logo { width: 72px; height: 72px; } }

/* Como pedir */
.howto { padding-block: 80px; background: var(--cream); }
.howto-layout { display: grid; gap: 40px; }
.howto-heading h2 { margin: 18px 0 18px; }
.howto-heading h2 span { color: var(--purple); }
.howto-lead { color: var(--muted); font-size: 1.15rem; line-height: 1.55; max-width: 38ch; margin-bottom: 26px; }
.order-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; counter-reset: step; }
.order-step { position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 20px; align-items: start; padding: 26px; background: #fff; border: 1px solid var(--line); border-radius: 20px; box-shadow: 0 10px 30px rgba(38,11,59,.06); transition: transform .25s, box-shadow .25s, border-color .25s; }
.order-step:hover { transform: translateY(-3px); border-color: rgba(128,57,233,.35); box-shadow: 0 16px 40px rgba(38,11,59,.1); }
.order-step:not(:last-child)::after { content: ''; position: absolute; left: 53px; top: 84px; bottom: -16px; border-left: 2px dashed rgba(128,57,233,.3); }
.order-step-icon { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 16px; background: #f1e8fb; color: var(--purple); }
.order-step-icon .icon { width: 26px; height: 26px; }
.order-step:last-child .order-step-icon { background: var(--lime); color: var(--deep); }
.order-step-number { display: block; color: var(--purple); font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 6px; }
.order-step h3 { font-size: 1.4rem; margin-bottom: 6px; }
.order-step p { color: var(--muted); font-size: 1rem; line-height: 1.5; }
@media (min-width: 900px) {
  .howto { padding-block: 120px; }
  .howto-layout { grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: start; }
  .howto-heading { position: sticky; top: calc(var(--header-height) + 40px); }
  .order-step { padding: 30px 32px; gap: 24px; }
  .order-step:not(:last-child)::after { left: 59px; }
}

/* Chamada final */
.cta { padding: 0 0 90px; background: var(--cream); }
.cta-card { position: relative; display: grid; overflow: hidden; border-radius: 28px; background: radial-gradient(circle at 15% 20%, #9a5cf0 0, transparent 45%), linear-gradient(135deg, var(--purple), #4d1784); color: var(--cream); box-shadow: 0 30px 70px rgba(38,11,59,.25); }
.cta-copy { position: relative; z-index: 1; padding: 44px 28px; }
.cta-copy .eyebrow { color: var(--lime); }
.cta-copy h2 { font-size: clamp(2.4rem, 5vw, 4rem); margin: 14px 0 14px; }
.cta-copy > p:not(.eyebrow) { font-size: 1.15rem; opacity: .85; max-width: 36ch; }
.cta-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.cta-whatsapp { display: inline-flex; align-items: center; gap: 10px; min-height: 58px; padding: 16px 24px; border: 2px solid rgba(255,255,255,.4); border-radius: 50px; color: var(--cream); font-weight: 700; transition: background .2s, border-color .2s; }
.cta-whatsapp:hover { background: rgba(255,255,255,.1); border-color: var(--cream); }
.cta-whatsapp .icon { width: 20px; height: 20px; }
.cta-visual { height: 220px; }
.cta-visual img { width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 800px) {
  .cta { padding-bottom: 120px; }
  .cta-card { grid-template-columns: 1.2fr .8fr; min-height: 380px; }
  .cta-copy { padding: 64px 56px; align-self: center; }
  .cta-visual { height: auto; clip-path: ellipse(90% 100% at 100% 50%); }
}

/* Rodapé */
.site-foot { background: var(--deeper); color: rgba(255,250,241,.72); padding-top: 70px; }
.site-foot-grid { display: grid; gap: 36px; padding-bottom: 50px; }
.site-foot-brand p { margin-top: 18px; max-width: 30ch; font-size: 1rem; line-height: 1.55; }
.site-foot-logo { display: block; width: 116px; height: 116px; border-radius: 50%; overflow: hidden; background: #fff; box-shadow: 0 0 0 6px rgba(120, 212, 73,.18); transition: transform .25s; }
.site-foot-logo:hover { transform: rotate(-4deg) scale(1.03); }
.site-foot-logo img { width: 134%; height: 134%; max-width: none; margin: -17%; }
.site-foot-col h3 { display: flex; align-items: center; gap: 8px; font-family: var(--body); font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--lime); margin-bottom: 14px; }
.site-foot-col h3 .icon { width: 16px; height: 16px; }
.site-foot-col p { font-size: 1rem; line-height: 1.6; }
.site-foot-col strong { color: var(--cream); font-weight: 700; }
.site-foot-col a:hover strong { color: var(--lime); }
.site-foot-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-block: 24px; border-top: 1px solid rgba(255,255,255,.1); font-size: .85rem; }
.site-foot-bottom a:hover { color: var(--lime); }
@media (min-width: 800px) {
  .site-foot-grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; align-items: start; }
}
.cta-visual { position: relative; }
.cta-visual img { position: absolute; inset: 0; }

/* Sobre: categorias em mosaico */
.about { padding-block: 80px; background: var(--cream); }
.about-head { display: grid; gap: 28px; margin-bottom: 40px; }
.about-head h2 { margin-top: 18px; }
.about-head h2 span { color: var(--purple); }
.about-intro > p { color: var(--muted); font-size: 1.15rem; line-height: 1.6; max-width: 46ch; }
.about-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 26px 0 0; }
.about-stats > div { padding: 16px 14px; background: #fff; border: 1px solid var(--line); border-radius: 16px; }
.about-stats dt { font-family: var(--heading); font-size: 1.8rem; font-weight: 800; color: var(--deep); letter-spacing: -.02em; line-height: 1; }
.about-stats dd { margin: 6px 0 0; color: var(--muted); font-size: .85rem; line-height: 1.3; }
.about-bento { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 190px; gap: 12px; }
.about-tile { position: relative; overflow: hidden; display: block; padding: 0; border-radius: 22px; background: var(--deep); color: var(--cream); text-align: left; cursor: pointer; isolation: isolate; }
.about-tile:first-child { grid-column: span 2; grid-row: span 2; }
.about-tile img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.about-tile::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(25,6,37,0) 35%, rgba(25,6,37,.85) 100%); transition: background .3s; }
.about-tile:hover img, .about-tile:focus-visible img { transform: scale(1.06); }
.about-tile:hover::before { background: linear-gradient(180deg, rgba(38,11,59,.1) 20%, rgba(38,11,59,.92) 100%); }
.about-tile-body { position: absolute; left: 18px; right: 64px; bottom: 16px; display: flex; flex-direction: column; gap: 2px; }
.about-tile-count { font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--lime); }
.about-tile strong { font-family: var(--heading); font-size: 1.4rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.about-tile:first-child strong { font-size: 2.4rem; }
.about-tile-price { font-size: .85rem; opacity: .85; }
.about-tile-arrow { position: absolute; right: 16px; bottom: 16px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: var(--lime); color: var(--deep); transition: transform .25s; }
.about-tile-arrow .icon { width: 18px; height: 18px; transform: rotate(-45deg); transition: transform .25s; }
.about-tile:hover .about-tile-arrow { transform: scale(1.1); }
.about-tile:hover .about-tile-arrow .icon { transform: rotate(0); }
.about-tile:focus-visible { outline: 3px solid var(--purple); outline-offset: 3px; }
@media (min-width: 900px) {
  .about { padding-block: 120px; }
  .about-head { grid-template-columns: 1fr 1fr; gap: 60px; align-items: end; margin-bottom: 56px; }
  .about-bento { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 230px; gap: 16px; }
  .about-tile-body { left: 24px; bottom: 22px; }
  .about-tile-arrow { right: 22px; bottom: 22px; width: 46px; height: 46px; }
  .about-tile:first-child strong { font-size: 3.15rem; }
}
.about-stats dt { white-space: nowrap; }
.about-tile::before { background: linear-gradient(180deg, rgba(25,6,37,0) 25%, rgba(25,6,37,.9) 100%); }
@media (max-width: 559px) {
  .about-stats { gap: 8px; }
  .about-stats > div { padding: 14px 10px; }
  .about-stats dt { font-size: 1.4rem; }
  .about-stats dd { font-size: .75rem; }
}
.about-head h2, .howto-heading h2, .menu-heading h2 { margin-top: 0; }

/* Hero: arco de produtos (referência Melius / Land-book Motion, escolhida pelo Jev) */
.hero--arc { --card-w: 132px; --r: 560px; --persp: 520px; --ring-y: 50%; display: block; min-height: 720px; min-height: max(700px, 100svh); padding: calc(var(--header-height) + 34px) 0 36px; background: radial-gradient(ellipse 70% 55% at 50% 52%, #5a1f8f 0%, #36104f 45%, #1c0629 100%); }
.hero--arc::after { content: ''; position: absolute; inset: auto 0 0; height: 140px; z-index: -1; background: linear-gradient(0deg, #1c0629, transparent); pointer-events: none; }
.hero-arc { position: absolute; inset: 0; z-index: -2; perspective: var(--persp); perspective-origin: 50% var(--ring-y); overflow: hidden; }
.hero-arc-ring { position: absolute; left: 50%; top: var(--ring-y); width: 0; height: 0; transform-style: preserve-3d; }
.arc-card { --a: 0deg; position: absolute; left: calc(var(--card-w) / -2); top: calc(var(--card-w) * -.66); width: var(--card-w); height: calc(var(--card-w) * 1.32); padding: 0; border-radius: 18px; overflow: hidden; background: #3a1558; box-shadow: 0 18px 40px rgba(10,2,16,.45); transform: rotateY(var(--a)) translateZ(calc(var(--r) * -1)); cursor: pointer; will-change: transform, opacity; }
.arc-card img { width: 100%; height: 100%; object-fit: cover; }
.arc-card span { position: absolute; left: 10px; bottom: 10px; padding: 4px 10px; border-radius: 30px; background: rgba(25,6,37,.72); color: var(--cream); font-size: .75rem; font-weight: 700; backdrop-filter: blur(6px); }
.hero--arc .hero-content { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 24px; min-height: calc(max(700px, 100svh) - var(--header-height) - 70px); text-align: center; pointer-events: none; }
.hero--arc .hero-content a, .hero--arc .hero-content button { pointer-events: auto; }
.hero--arc .hero-top { display: flex; flex-direction: column; align-items: center; }
.hero--arc .eyebrow { justify-content: center; }
.hero--arc h1 { font-size: clamp(2.6rem, 6vw, 5.4rem); line-height: 1; margin: 16px 0 0; max-width: 16ch; text-shadow: 0 4px 30px rgba(25,6,37,.6); }
.hero--arc .hero-bottom-block { display: flex; flex-direction: column; align-items: center; gap: 18px; }
.hero--arc .hero-copy { margin: 0; max-width: 40ch; text-shadow: 0 2px 16px rgba(25,6,37,.8); }
.hero--arc .hero-delivery { justify-content: center; margin-top: 0; }
.hero-intro { animation: hero-rise .7s cubic-bezier(.2,.7,.2,1) both; }
.hero-bottom-block.hero-intro { animation-delay: .25s; }
@keyframes hero-rise { from { opacity: 0; transform: translateY(14px); } }
@media (min-width: 800px) {
  .hero--arc { --card-w: 220px; --r: 1100px; --persp: 900px; --ring-y: 52%; }
  .hero--arc .hero-content { gap: 32px; }
}
@media (prefers-reduced-motion: reduce) { .hero-intro { animation: none; } }
.hero--arc { --card-w: 150px; --ring-y: 54%; }
@media (max-width: 559px) { .hero--arc .hero-delivery-sep { display: none; } .hero--arc .hero-delivery { flex-direction: column; gap: 8px; } }
@media (min-width: 800px) { .hero--arc { --card-w: 240px; --ring-y: 55%; } }
/* Cards do arco maiores */
.hero--arc { --card-w: 190px; --r: 640px; --persp: 620px; --ring-y: 55%; }
.hero--arc h1 { font-size: clamp(2.4rem, 5.2vw, 4.6rem); }
@media (min-width: 800px) { .hero--arc { --card-w: 320px; --r: 1250px; --persp: 1250px; --ring-y: 56%; } }
@media (max-width: 799px) { .hero--arc { --r: 1080px; --persp: 940px; } }

/* Auditoria mobile (2026-09-24) */
/* Campos com 16px: abaixo disso o iPhone dá zoom sozinho ao tocar */
#checkout-form input, #checkout-form select, #checkout-form textarea { font-size: 16px; }
/* Áreas de toque de pelo menos ~44px */
.nav-link { padding-block: 11px; }
.nav-link:after { bottom: 6px; }
.cart-quantity button { width: 40px; height: 40px; }
[data-remove] { min-height: 40px; padding-inline: 6px; }
.site-foot-bottom a { display: inline-block; padding-block: 11px; }
/* Cards de categoria pequenos no celular: seta no canto de cima, texto com a largura toda */
@media (max-width: 799px) {
  .about-tile:not(:first-child) .about-tile-body { left: 14px; right: 14px; bottom: 14px; }
  .about-tile:not(:first-child) .about-tile-arrow { top: 12px; right: 12px; bottom: auto; width: 36px; height: 36px; }
  .about-tile:not(:first-child) strong { font-size: clamp(1.05rem, 5.2vw, 1.4rem); }
  .about-tile:not(:first-child) .about-tile-price { font-size: .8rem; line-height: 1.35; }
}

/* Correções 2026-10-02 — feedback de toque em todo botão/link de ação.
   Usa a propriedade individual `scale` (soma com os transforms de :hover/:active que já existem,
   ex. .action-button:active translateY, sem sobrescrever). Navegador sem `scale` cai no fallback transform: scale(.97). */
:where(a[href], button, [role="button"]) { transition-property: transform, box-shadow, background-color, color, border-color, opacity, scale; transition-duration: .18s; transition-timing-function: ease; }
/* Classes que já tinham `transition` própria: mesma lista de antes + scale (senão o shorthand delas anularia a de cima) */
.cart-trigger { transition: background-color .2s, transform .2s, box-shadow .2s, scale .16s ease; }
.action-button { transition: transform .22s, box-shadow .22s, color .22s, background-color .22s, scale .16s ease; }
.filter-button { transition: color .2s, background-color .2s, transform .2s, box-shadow .2s, scale .16s ease; }
.product-open { transition: transform .25s, border-color .25s, box-shadow .25s, scale .16s ease; }
.icon-button { transition: background-color .2s, transform .2s, box-shadow .2s, scale .16s ease; }
.cta-whatsapp { transition: background-color .2s, border-color .2s, box-shadow .2s, scale .16s ease; }
.brand-logo, .site-foot-logo { transition: transform .25s, box-shadow .2s, scale .16s ease; }
:where(a[href], button, [role="button"]):not(:disabled):active { scale: .97; }
@supports not (scale: 1) {
  :where(a[href], button, [role="button"]):not(:disabled):active { transform: scale(.97); }
}
/* Sombra menor no toque (só onde já existe sombra; .action-button:active já reduz a dela) */
.brand-logo:active { box-shadow: 0 2px 8px rgba(0,0,0,.22); }
.site-foot-logo:active { box-shadow: 0 0 0 3px rgba(120, 212, 73,.18); }
.close-button:active { box-shadow: 0 1px 4px #260b3b26; }
.product-open:active { box-shadow: 0 6px 14px #10051960; }
.about-tile:active, .menu-row:active, .cart-trigger:active, .filter-button:active, .cta-whatsapp:active, .icon-button:active { box-shadow: 0 1px 4px rgba(16,5,25,.18); }
@media (prefers-reduced-motion: reduce) {
  :where(a[href], button, [role="button"]):not(:disabled):active { scale: none; }
  @supports not (scale: 1) { :where(a[href], button, [role="button"]):not(:disabled):active { transform: none; } }
}

/* Correções 2026-10-02 — transição entre seções: topo arredondado sobrepondo a seção anterior.
   Cada seção sobe --sec-r sobre a anterior; a anterior ganha +--sec-r de padding-bottom pra nada ficar escondido.
   (O hero .hc ganha o espaço extra em hero-copo.css.) A .cta tem o mesmo fundo creme da .howto, então não precisa de curva. */
:root { --sec-r: 28px; }
@media (min-width: 800px) { :root { --sec-r: 36px; } }
.trust-strip, .about, .menu-section, .howto, .site-foot { position: relative; z-index: 1; margin-top: calc(-1 * var(--sec-r)); border-radius: var(--sec-r) var(--sec-r) 0 0; }
.trust-strip { padding-bottom: calc(23px + var(--sec-r)); }
.about { padding-bottom: calc(80px + var(--sec-r)); }
.menu-section { padding-bottom: calc(80px + var(--sec-r)); }
.cta { padding-bottom: calc(90px + var(--sec-r)); }
@media (min-width: 800px) {
  .menu-section { padding-bottom: calc(105px + var(--sec-r)); }
  .cta { padding-bottom: calc(120px + var(--sec-r)); }
}
@media (min-width: 900px) {
  .about { padding-bottom: calc(120px + var(--sec-r)); }
}

/* Cardápio real (2026-10-03): a loja só vende açaí em 2 tamanhos, então a seção "sobre" tem 2 cards (300 ml e 500 ml).
   Só layout dos mesmos cards (meio a meio, mesmo tamanho); nenhuma cor, degradê ou animação alterada. */
.about-bento[data-count="2"] .about-tile { grid-column: span 1; grid-row: span 2; }
.about-bento[data-count="2"] .about-tile strong { font-size: 2.4rem; }
@media (min-width: 900px) {
  .about-bento[data-count="2"] .about-tile { grid-column: span 2; }
  .about-bento[data-count="2"] .about-tile strong { font-size: 3.15rem; }
}
@media (max-width: 799px) {
  .about-bento[data-count="2"] .about-tile .about-tile-body { left: 14px; right: 14px; bottom: 14px; }
  .about-bento[data-count="2"] .about-tile .about-tile-arrow { top: 12px; right: 12px; bottom: auto; width: 36px; height: 36px; }
  .about-bento[data-count="2"] .about-tile strong { font-size: clamp(1.4rem, 6.6vw, 2.2rem); }
  .about-bento[data-count="2"] .about-tile .about-tile-price { font-size: .8rem; line-height: 1.35; }
  /* Foto dos 2 cards de tamanho (2026-10-04): copo inteiro no celular. A foto (3:2, copo em ~35-65% da largura e 16-89% da altura)
     ocupa só a parte de cima do card, na proporção real e centralizada; o texto fica no fundo do card, abaixo da base do copo. */
  .about-bento[data-count="2"] .about-tile img { inset: auto; top: 30px; left: 50%; width: min(210%, 360px); height: auto; margin-left: calc(min(210%, 360px) / -2); object-fit: contain;
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 12%, #000 91%, transparent 100%), linear-gradient(90deg, transparent 0, #000 10%, #000 90%, transparent 100%); -webkit-mask-composite: source-in;
    mask-image: linear-gradient(180deg, transparent 0, #000 12%, #000 91%, transparent 100%), linear-gradient(90deg, transparent 0, #000 10%, #000 90%, transparent 100%); mask-composite: intersect; }
  .about-bento[data-count="2"] .about-tile::before { background: linear-gradient(180deg, rgba(25,6,37,0) 66%, rgba(25,6,37,.9) 100%); }
}

/* Ajustes Karen 2026-10-04 (spec plano/karen-ajustes-20261004.md, aplicada pela Fernanda Dev) */
/* 1. Titulos h3/h4: tracking menos fechado e espaco entre palavras visivel */
h3, h4 { letter-spacing: -.01em; word-spacing: .1em; }
.order-step h3 { letter-spacing: -.01em; word-spacing: .12em; }

/* 2. Contraste de textos pequenos */
:root { --muted-forte: #5A4C5D; }
#results-count { color: rgba(250, 245, 252, .86); font-weight: 700; }
.about-stats dd { color: var(--muted-forte); }
.menu-group-meta { color: rgba(250, 245, 252, .86); }
.menu-row-dots { border-bottom: 2px dotted rgba(250, 245, 252, .5); }

/* Pontilhado do cardapio (Fernanda Dev 2026-10-04): como cardapio impresso, sai do fim da ULTIMA linha do nome
   e vai ate o preco, na base do texto. O pontilhado agora e o ::after do nome (o span .menu-row-dots fica oculto):
   NBSP gruda na ultima palavra + 24px minimos reservados na linha (se nao couber, a ultima palavra desce junto);
   a faixa pintada continua alem e e cortada na borda do nome. Preco alinhado pela base da ultima linha do nome. */
.menu-row { flex-wrap: wrap; align-content: center; align-items: baseline; align-items: last baseline; }
/* '+' na mesma linha do preco (2026-10-04): vai para a base da linha do flex (ultima linha do nome + preco);
   top -4px centraliza no texto do preco sem mexer no layout nem no transform do hover/toque */
.menu-row-add { align-self: flex-end; position: relative; top: -4px; }
/* Quebras dos nomes (2026-10-04): sem text-wrap: balance (ele ignorava os 24px reservados do pontilhado);
   as palavras que devem andar juntas sao unidas com NBSP no render (script.js, menuRow) */
.menu-row-name { flex: 1 1 0; min-width: 0; margin-right: -6px; padding-block: 6px; overflow: hidden; overflow: clip; }
.menu-row-price { padding-block: 6px; }
.menu-row-dots { display: none; }
.menu-row-name::after {
  content: "\00a0";
  padding-right: calc(100vw + 24px);
  margin-right: -100vw;
  background: radial-gradient(circle, rgba(250, 245, 252, .5) 1.1px, transparent 1.5px) 2px calc(100% - .2em) / 6px 3px repeat-x;
}
.menu-row:hover .menu-row-name::after { background-image: radial-gradient(circle, rgba(120, 212, 73, .35) 1.1px, transparent 1.5px); }
.cta-copy .eyebrow {
  display: inline-flex; align-items: center;
  padding: 6px 14px; border-radius: 40px;
  background: var(--deep); color: var(--lime);
  box-shadow: inset 0 0 0 1px rgba(120, 212, 73, .35);
}

/* 3. Logo do rodape = tratamento do cabecalho (sem anel extra) */
.site-foot .site-foot-logo { box-shadow: 0 4px 18px rgba(0, 0, 0, .25); }
.site-foot .site-foot-logo:active { box-shadow: 0 2px 8px rgba(0, 0, 0, .22); }

/* 4. Logo do cabecalho maior, sem passar da altura do cabecalho */
.brand-logo { width: 72px; height: 72px; }
@media (min-width: 800px) { .brand-logo { width: 80px; height: 80px; } }

/* 5. Contatos do rodape: componente tocavel */
.site-foot-col p + p { margin-top: 10px; }
.site-foot-col .foot-contact {
  display: flex; align-items: center; gap: 12px;
  width: 100%; max-width: 320px; min-height: 56px;
  padding: 8px 14px 8px 8px; border-radius: 16px;
  background: rgba(250, 245, 252, .06); border: 1px solid rgba(250, 245, 252, .14);
  color: rgba(250, 245, 252, .72); line-height: 1.3;
  transition: background-color .2s, border-color .2s, color .2s, scale .16s ease;
}
@media (max-width: 799px) { .site-foot-col .foot-contact { max-width: none; } }
.foot-contact-icon {
  width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center;
  border-radius: 12px; background: rgba(120, 212, 73, .14); color: var(--lime);
  transition: background-color .2s, color .2s;
}
.foot-contact-icon .icon { width: 20px; height: 20px; }
.foot-contact-text { display: flex; flex-direction: column; flex: 1; min-width: 0; font-size: .85rem; }
.foot-contact-text strong { font-size: 1rem; color: var(--cream); }
.foot-contact-go { width: 18px; height: 18px; color: rgba(250, 245, 252, .55); transform: rotate(-45deg); transition: transform .2s, color .2s; }
.site-foot-col .foot-contact:hover { background: rgba(120, 212, 73, .10); border-color: rgba(120, 212, 73, .55); }
.site-foot-col .foot-contact:hover strong { color: var(--lime); }
.site-foot-col .foot-contact:hover .foot-contact-go { color: var(--lime); transform: rotate(-45deg) translate(2px, 0); }
.site-foot-col .foot-contact:active { background: rgba(120, 212, 73, .18); border-color: var(--lime); }
.site-foot-col .foot-contact:active .foot-contact-icon { background: var(--lime); color: var(--deep); }
.site-foot-col .foot-contact:focus-visible { outline: 3px solid var(--lime); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .foot-contact-go { transition: none; } }

/* 6. Voltar ao topo: seta para cima, alinhada ao texto */
.site-foot-bottom .to-top { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding-block: 0; }
.to-top .icon { width: 18px; height: 18px; transform: rotate(-90deg); transition: transform .2s; }
.to-top:hover .icon, .to-top:focus-visible .icon { transform: rotate(-90deg) translateX(3px); }
.to-top:focus-visible { outline: 3px solid var(--lime); outline-offset: 3px; border-radius: 8px; }
@media (prefers-reduced-motion: reduce) { .to-top .icon { transition: none; } .to-top:hover .icon { transform: rotate(-90deg); } }

/* 7. Estrela em SVG no lugar do caractere (nao vira emoji no iPhone) */
.little-star, .trust-star { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.little-star .icon { width: 16px; height: 16px; stroke-width: 2.2; }
.trust-star { color: var(--lime); }
.trust-star .icon { width: 14px; height: 14px; stroke-width: 2.2; }
@media (max-width: 799px) { .trust-star { display: none; } }

/* Fernanda Dev 2026-10-04 (item G): o padding de baixo do cardapio somava +--sec-r para a secao seguinte
   subir por cima com a curva, mas a .howto nao sobe mais (margin-top 0 + gotas no acabamento.css):
   sobrava faixa roxa vazia entre o ultimo copo e as gotas. Padding volta ao respiro normal. */
.menu-section { padding-bottom: 40px; }
@media (min-width: 800px) { .menu-section { padding-bottom: 72px; } }