.brand img,.footer-brand img{border-radius:50%}
.topbar{grid-template-columns:1fr auto 1fr}
.topbar nav{grid-column:2}
.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}
.contact-actions{display:flex;gap:1rem;flex-wrap:wrap}
.outline{border:1px solid #fff;color:#fff}
.contact-actions .button{min-width:140px;text-align:center}
@media(max-width:800px){.topbar{grid-template-columns:1fr auto}.topbar nav{grid-column:2}.contact-actions{flex-direction:column;align-items:flex-start}}
.hero{position:relative;display:grid;max-width:none;min-height:clamp(520px,70vw,760px);padding:0;overflow:hidden;isolation:isolate;color:#fff;align-items:end}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.68) 0%,rgba(0,0,0,.42) 50%,rgba(0,0,0,.12) 100%);z-index:-1}
.hero figure{position:absolute;inset:0;max-width:none;aspect-ratio:auto;margin:0;z-index:-2}
.hero figure img{width:100%;height:100%;object-fit:cover;object-position:center}
.hero>div{width:min(760px,92%);padding:clamp(3rem,7vw,7rem) var(--pad);text-shadow:0 2px 20px rgba(0,0,0,.35)}
.hero .kicker{color:#fff}.hero h1{max-width:9ch}.hero .intro{color:#fff}.hero .underlink{color:#fff}.hero .button{text-shadow:none}
@media(max-width:800px){.hero{min-height:680px}.hero::after{background:linear-gradient(0deg,rgba(0,0,0,.76),rgba(0,0,0,.08) 75%)}.hero>div{align-self:end;padding-bottom:4rem}}
.hero{max-width:1100px;min-height:480px;margin:0 auto;background:#111}
.hero figure{inset:50% auto auto 50%;width:min(100%,680px);height:auto;aspect-ratio:680/229;transform:translate(-50%,-50%)}
.hero figure img{object-fit:contain}
.hero::after{background:linear-gradient(90deg,rgba(0,0,0,.06) 0%,rgba(0,0,0,.28) 44%,rgba(0,0,0,.82) 100%)}
.hero>div{width:min(500px,92%);margin-left:auto;padding:clamp(2rem,5vw,5rem);text-align:left}
.hero h1{font-size:clamp(3rem,5vw,5.8rem)}
@media(max-width:800px){.hero{min-height:620px;max-width:680px}.hero figure{top:32%;width:100%}.hero::after{background:linear-gradient(0deg,rgba(0,0,0,.88) 8%,rgba(0,0,0,.12) 75%)}.hero>div{width:100%;margin:0;align-self:end;padding:2rem 1.25rem 3rem}.hero h1{font-size:clamp(2.8rem,13vw,4.5rem)}}
@media(max-width:800px){.hero>div{margin-left:auto;text-align:right}.hero .actions{justify-content:flex-end;align-items:flex-end}.hero h1,.hero .intro{margin-left:auto}}
.hero>div{justify-self:end;text-align:right;margin-left:0}.hero .actions{justify-content:flex-end}.hero h1,.hero .intro{margin-left:auto}
.hero{width:min(100%,1020px);max-width:1020px;min-height:0;aspect-ratio:680/229;margin:0 auto}
.hero figure{inset:0;width:100%;height:100%;aspect-ratio:auto;transform:none}
.hero figure img{width:100%;height:100%;object-fit:cover}
.hero>div{padding:1.5rem 2rem;width:min(470px,58%)}
.hero h1{font-size:clamp(2.3rem,4.7vw,3.5rem);line-height:.9;margin-bottom:1rem}
.hero .intro{font-size:clamp(.92rem,1.6vw,1.1rem);line-height:1.35;margin-bottom:.75rem}
.hero .actions{margin-top:.75rem}.hero .button{padding:.65rem 1rem}
@media(max-width:600px){.hero{aspect-ratio:auto;min-height:520px}.hero figure{height:230px}.hero>div{width:100%;padding:1.5rem;bottom:0}.hero h1{font-size:2.8rem}.hero .actions{flex-direction:row;align-items:center;justify-content:flex-end}}
.topbar{min-height:102px}.brand{width:112px}.brand img{width:76px;height:76px}.brand span{font-size:.72rem}
.hero{height:430px;min-height:430px;aspect-ratio:auto;background:#111}
.hero::after{background:rgba(0,0,0,.08)}
.hero>div{right:28px!important;bottom:28px!important;width:min(430px,calc(100% - 56px))!important;background:rgba(10,10,10,.8);padding:1.5rem 1.6rem!important;text-shadow:none}
.hero h1{font-size:clamp(2.45rem,4vw,3.15rem);line-height:.92;margin:0 0 .85rem;max-width:10ch}
.hero .intro{font-size:1rem;line-height:1.4;margin:0 0 .9rem;max-width:35ch}
.hero .actions{margin:.5rem 0 0;gap:1rem;flex-wrap:wrap}.hero .button{padding:.65rem 1rem}.hero .kicker{margin-bottom:.65rem}
.categories{padding-top:clamp(4rem,6vw,6rem)}.categories .section-head{margin-bottom:clamp(2.5rem,4vw,4rem)}.categories .section-head h2{font-size:clamp(3rem,5vw,5rem)}
@media(max-width:600px){.topbar{min-height:92px}.brand img{width:62px;height:62px}.hero{height:570px;min-height:570px}.hero figure{height:100%}.hero>div{right:16px!important;bottom:16px!important;width:calc(100% - 32px)!important}.hero h1{font-size:2.55rem}.hero .actions{justify-content:flex-end}}
.hero{width:min(100%,765px);max-width:765px;height:auto;min-height:0;aspect-ratio:680/229}
.hero::after{background:linear-gradient(90deg,transparent 35%,rgba(0,0,0,.62) 100%)}
.hero>div{right:18px!important;bottom:14px!important;width:min(350px,47%)!important;background:transparent;padding:0!important;text-shadow:0 2px 10px rgba(0,0,0,.9)}
.hero h1{font-size:clamp(2rem,3.7vw,2.65rem);line-height:.9;margin-bottom:.6rem}.hero .intro{font-size:.88rem;line-height:1.3;margin-bottom:.55rem}.hero .kicker{font-size:.62rem;margin-bottom:.45rem}.hero .actions{margin-top:.4rem;gap:.75rem}.hero .button{padding:.55rem .8rem;font-size:.7rem}.hero .underlink{font-size:.7rem}
@media(max-width:600px){.hero{width:100%;height:520px;min-height:520px;aspect-ratio:auto}.hero::after{background:linear-gradient(0deg,rgba(0,0,0,.8),transparent 78%)}.hero>div{right:16px!important;bottom:18px!important;width:calc(100% - 32px)!important}.hero h1{font-size:2.4rem}.hero .intro{font-size:1rem}}
.hero{height:330px;min-height:330px;aspect-ratio:auto}.hero figure img{object-fit:cover;object-position:center}.hero>div{right:6px!important;bottom:18px!important;width:min(330px,44%)!important}.hero h1{font-size:clamp(2.05rem,3.5vw,2.55rem)}
@media(max-width:600px){.hero{height:560px;min-height:560px}.hero>div{right:12px!important;bottom:16px!important;width:calc(100% - 24px)!important}}
.hero{margin-top:1rem}.hero>div{right:0!important;width:min(300px,40%)!important}.hero h1,.hero .intro,.hero .kicker{text-align:right}
.hero .kicker,.hero h1,.hero .intro{width:100%;max-width:none;margin-left:0;text-align:right}.hero .actions{justify-content:flex-end}
.hero>div{right:24px!important;width:min(320px,40%)!important}
.hero .kicker{margin-bottom:.75rem}.hero h1{line-height:1.04;margin-bottom:1rem}.hero .intro{line-height:1.5;margin-bottom:1rem}.hero .actions{margin-top:.8rem}
.categories{border-top:0}.categories .section-head,.ritual{position:relative}.categories .section-head{padding-top:1.25rem}.categories .section-head::before,.ritual::before{content:"";position:absolute;top:0;left:50%;width:100vw;border-top:1px solid var(--line);transform:translateX(-50%)}
body{overflow-x:hidden}.ritual::before{top:calc(var(--section) - 1rem)}
:root{--major-rule-width:min(calc(100vw - var(--pad) - var(--pad)),var(--max))}.topbar{border-bottom:0}.topbar::after,.categories .section-head::before,.ritual::before,.italian-shelf::before{content:"";position:absolute;left:50%;width:var(--major-rule-width);border-top:1px solid var(--line);transform:translateX(-50%)}.topbar::after{bottom:0}.categories .section-head::before{top:0}.ritual::before{top:calc(var(--section) - 1rem)}.italian-shelf{position:relative;border-top:0}.italian-shelf::before{top:0}
.topbar::after,.categories .section-head::before,.ritual::before,.italian-shelf::before{width:min(92vw,1320px)!important}
.mobile-quick-actions{display:none}@media(max-width:800px){.mobile-quick-actions{position:fixed;right:12px;bottom:18px;z-index:30;display:flex;flex-direction:column;gap:10px}.mobile-quick-actions a{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;color:#fff;background:var(--wine);box-shadow:0 5px 18px rgba(0,0,0,.22);transition:transform .2s ease,box-shadow .2s ease}.mobile-quick-actions a:active{transform:scale(.94)}.mobile-quick-actions a:focus-visible{outline:3px solid #fff;outline-offset:2px}.mobile-quick-actions svg{width:23px;height:23px;fill:currentColor}.mobile-quick-actions .quick-map{background:var(--ink)}.mobile-quick-actions .quick-whatsapp{background:#1f8f5f}}
@media(max-width:800px){.mobile-quick-actions .quick-phone{background:#fff;color:var(--wine)}.mobile-quick-actions .quick-map{background:conic-gradient(from 35deg,#4285f4 0 27%,#34a853 27% 52%,#fbbc04 52% 74%,#ea4335 74% 100%);color:#fff}}
@media(max-width:600px){.hero{margin-top:.75rem}.hero>div{right:8px!important;width:calc(100% - 16px)!important}}
.hero{width:100%;max-width:none;margin:1rem 0 0}.hero figure{width:100%;max-width:none}


/* Mobile refinements: reveal the full shop sign and adapt quick actions on scroll. */
@media(max-width:800px){
  .hero figure img{
    object-position:44% 50%;
    transform:translateY(8px) scale(1.03);
  }
  .mobile-quick-actions{
    flex-direction:row;
    align-items:center;
    gap:10px;
  }
  .mobile-quick-actions.is-scrolled{
    flex-direction:column;
    align-items:center;
  }
}
@media(max-width:600px){
  .hero figure img{object-position:44% 50%;transform:translateY(8px) scale(1.03)}
}


/* Smoothly animate the quick-action buttons between row and column layouts. */
@media(max-width:800px){
  .mobile-quick-actions{
    display:grid;
    grid-template-columns:repeat(3,50px);
    grid-template-rows:50px;
    grid-auto-flow:row;
    column-gap:10px;
    row-gap:10px;
    transition:
      grid-template-columns 650ms cubic-bezier(.22,.8,.25,1),
      grid-template-rows 650ms cubic-bezier(.22,.8,.25,1),
      column-gap 650ms ease,
      row-gap 650ms ease;
  }
  .mobile-quick-actions.is-scrolled{
    grid-template-columns:50px;
    grid-template-rows:repeat(3,50px);
  }
}
@media(prefers-reduced-motion:reduce){
  .mobile-quick-actions{transition:none!important}
}


/* Move each quick-action icon independently, in sequence, on mobile scroll. */
@media(max-width:800px){
  .mobile-quick-actions{
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:10px;
    transition:none;
  }
  .mobile-quick-actions.is-scrolled{
    flex-direction:row;
  }
  .mobile-quick-actions a{
    transition:transform 560ms cubic-bezier(.22,.8,.25,1);
  }
  .mobile-quick-actions a:nth-child(1){transition-delay:0ms}
  .mobile-quick-actions a:nth-child(2){transition-delay:130ms}
  .mobile-quick-actions a:nth-child(3){transition-delay:260ms}
  .mobile-quick-actions.is-scrolled a:nth-child(1){transform:translate(120px,-120px)}
  .mobile-quick-actions.is-scrolled a:nth-child(2){transform:translate(60px,-60px)}
  .mobile-quick-actions.is-scrolled a:nth-child(3){transform:translate(0,0)}
}
@media(prefers-reduced-motion:reduce){
  .mobile-quick-actions a{transition:none!important}
}


/* Final mobile quick-action choreography: each icon travels to its own
   vertical position, one after another, instead of moving as a group. */
@media(max-width:800px){
  .mobile-quick-actions{
    display:block;
    position:fixed;
    right:12px;
    bottom:18px;
    width:170px;
    height:170px;
    flex:none;
    gap:0;
    transition:none;
  }
  .mobile-quick-actions a{
    position:absolute;
    right:0;
    bottom:0;
    transform:none;
    transition:right 560ms cubic-bezier(.22,.8,.25,1),
               bottom 560ms cubic-bezier(.22,.8,.25,1);
  }
  .mobile-quick-actions a:nth-child(1){right:120px;bottom:0;transition-delay:0ms}
  .mobile-quick-actions a:nth-child(2){right:60px;bottom:0;transition-delay:150ms}
  .mobile-quick-actions a:nth-child(3){right:0;bottom:0;transition-delay:300ms}
  .mobile-quick-actions.is-scrolled a:nth-child(1){right:0;bottom:120px}
  .mobile-quick-actions.is-scrolled a:nth-child(2){right:0;bottom:60px}
  .mobile-quick-actions.is-scrolled a:nth-child(3){right:0;bottom:0}
}
@media(prefers-reduced-motion:reduce){
  .mobile-quick-actions a{transition:none!important}
}


/* Raise the complete mobile hero text block above the quick-action icons. */
@media(max-width:600px){
  .hero>div{
    bottom:76px!important;
  }
}


/* Corrected mobile icon choreography: phone and map stay on-screen,
   align with WhatsApp, and move independently into a neat vertical stack. */
@media(max-width:800px){
  .mobile-quick-actions{
    display:block!important;
    position:fixed!important;
    right:12px!important;
    bottom:18px!important;
    width:170px!important;
    height:170px!important;
  }
  .mobile-quick-actions a{
    position:absolute!important;
    width:50px!important;
    height:50px!important;
    margin:0!important;
    transform:none!important;
    transition:
      right 560ms cubic-bezier(.22,.8,.25,1),
      bottom 560ms cubic-bezier(.22,.8,.25,1)!important;
  }
  /* At the top: three buttons in one horizontal row. */
  .mobile-quick-actions a:nth-child(1){right:120px!important;bottom:0!important;transition-delay:0ms!important}
  .mobile-quick-actions a:nth-child(2){right:60px!important;bottom:0!important;transition-delay:150ms!important}
  /* WhatsApp remains anchored in the same bottom-right position. */
  .mobile-quick-actions a:nth-child(3){right:0!important;bottom:0!important;transition:none!important}
  /* On scroll: phone and map move, one after the other, directly above WhatsApp. */
  .mobile-quick-actions.is-scrolled a:nth-child(1){right:0!important;bottom:120px!important}
  .mobile-quick-actions.is-scrolled a:nth-child(2){right:0!important;bottom:60px!important}
}
@media(prefers-reduced-motion:reduce){
  .mobile-quick-actions a{transition:none!important}
}