/* Look AY "Pharmacy": the pharmacy's street furniture and packaging. The LED cross sign with dot-matrix hours, white
   medicine cartons with a colour band and a thumb notch, the weekly pill box for opening hours, the folded patient
   leaflet, the eye chart for opticians, and a cross-shaped phone menu. Tinted page, white cartons, big photos.
   Every class starts with ay- (never g-). Tokens: see design.ts. */

@font-face{font-family:"Manrope AY";font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/manrope-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Manrope AY";font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/manrope-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --pg:#e4f3ea;--pg2:#d3eadc;--card:#ffffff;--ink:#0e2a20;--mute:#3c584c;--line:#a9cbb8;--acc:#0b6b45;--onacc:#ffffff;
  --deep:#0b3a29;--ondeep:#eefaf3;--deepmute:#a9d3be;--led:#3be07f;--ledoff:#1a5240;--b1:#0f8a57;--b2:#f0b429;--b3:#2f6fd0;--tint:#c6e4d2;--brd:#abc4b7;
  --fd:"Manrope AY",system-ui,sans-serif;--ft:"Manrope AY",system-ui,sans-serif;--hw:800;--hs:-.035em;
  --m:clamp(20px,4.45vw,64px);--max:1240px;--sec:clamp(64px,8.4vw,120px);--r:calc(12px*var(--tune-radius,1));
  --sbg:var(--pg);
  --m-accent:var(--acc);--m-header-bg:var(--pg2);--m-head-offset:80px;
  --g-bg:var(--pg);--g-paper:var(--pg);--g-surface:var(--card);--g-ink:var(--ink);--g-muted:var(--mute);--g-line:var(--line);--g-accent:var(--acc);
  --g-radius:calc(12px*var(--tune-radius,1));--g-fd:var(--fd);--g-ft:var(--ft);--g-fw:var(--hw);--g-ls:var(--hs);--g-pad:var(--m);--g-max:calc(var(--max) + 2 * var(--m));--g-top:80px;
}
.ay-f-optic{--hw:300;--hs:-.025em}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:96px}
body{margin:0;background:var(--pg);color:var(--ink);font:400 calc(17px*var(--tune-size,1))/1.6 var(--ft);font-kerning:normal;text-rendering:optimizeLegibility;font-variant-numeric:tabular-nums}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.22em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
h1,h2,h3,p,dl,dd,ol,ul,figure,blockquote{margin:0}
h1,h2,h3,summary,b{overflow-wrap:break-word}
ol,ul{padding:0;list-style:none}
.ay-wrap{width:100%;max-width:calc(var(--max) + 2 * var(--m));margin-inline:auto;padding-inline:var(--m)}
.ay-h1{font:var(--hw) calc(clamp(42px,6.1vw,88px)*var(--tune-size,1))/1.02 var(--fd);letter-spacing:var(--hs);text-wrap:balance}
.ay-h1 span{display:block}
/* the big headline pole: 110–124 px at 1440, about half on a phone, tight leading; never larger than lets the longest
   word (--lw letters) fit its column, so a word never breaks (the column is a size container) */
.ay-big{font-size:min(clamp(54px,8.6vw,124px),calc(100cqi / (var(--lw,8) * .7)));line-height:.96;letter-spacing:calc(var(--hs) - .005em)}
.ay-f-optic .ay-big{font-weight:300}
.ay-h2{font:var(--hw) calc(clamp(30px,3.4vw,48px)*var(--tune-size,1))/1.08 var(--fd);letter-spacing:var(--hs);text-wrap:balance}
.ay-h3{font:800 calc(22px*var(--tune-size,1))/1.2 var(--fd);letter-spacing:-.015em}
.ay-f-optic .ay-h3{font-weight:600}
.ay-lede{font-size:calc(clamp(18px,1.45vw,21px)*var(--tune-size,1));line-height:1.5;color:var(--mute);text-wrap:pretty;max-width:34ch}
.ay-small{font-size:calc(14px*var(--tune-size,1));line-height:1.5;color:var(--mute)}
.ay-btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 26px;background:var(--acc);color:var(--onacc);font:700 calc(16px*var(--tune-size,1))/1 var(--ft);text-decoration:none;border:0;border-radius:calc(10px*var(--tune-radius,1));cursor:pointer;text-align:center;line-height:1.15}
.ay-btn:hover{text-decoration:underline;text-underline-offset:.25em}
.ay-phone{display:inline-flex;flex-direction:column;justify-content:center;min-height:54px;font:800 clamp(22px,2vw,28px)/1.1 var(--fd);letter-spacing:-.02em;text-decoration:none;white-space:nowrap}
.ay-phone small{font:600 calc(13px*var(--tune-size,1))/1.3 var(--ft);letter-spacing:0;color:var(--mute);margin-bottom:3px}
a.ay-phone:hover,.ay-phone a:hover{text-decoration:underline;text-decoration-thickness:2px}
.ay-phone a{color:inherit;text-decoration:none}
.ay-act{display:flex;align-items:center;flex-wrap:wrap;gap:16px 32px}
.ay-more{margin-top:36px;font-weight:700}
.ay-more a{text-decoration:none;border-bottom:2px solid var(--acc);padding-bottom:3px}
.ay-sec-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:end;margin-bottom:calc(44px*var(--tune-space,1))}
.ay-sec-head .ay-h2{grid-column:1/7}
.ay-sec-head p{grid-column:8/13;color:var(--mute);font-size:calc(18px*var(--tune-size,1));line-height:1.5;text-wrap:pretty}

/* ---------- the sign (Sign.astro) ---------- */
.ay-sign{display:flex;flex-direction:column;align-items:center;gap:28px}
.ay-cross{display:block;width:100%;height:auto;overflow:visible}
.ay-tick{display:block;height:auto;overflow:visible}
.ay-off{fill:var(--ledoff)}
.ay-tick .ay-off{opacity:.45}
.ay-r,.ay-on{fill:var(--led)}
.ay-lit,.ay-on{filter:drop-shadow(0 0 .22px var(--led))}
.ay-sign-hero .ay-cross{width:min(62%,280px)}
.ay-sign-hero .ay-tick{width:min(100%,calc(var(--cols) * 6.4px))}
.ay-sign-post .ay-cross{width:68%}
.ay-sign-post .ay-tick{width:84%}
.ay-sign-post{gap:14px}
.ay-sign-band .ay-cross{width:150px}
.ay-sign-band .ay-tick{width:min(100%,calc(var(--cols) * 4px))}
.ay-sign-band{gap:18px}
.ay-markx{display:block;width:22px;height:22px;flex:none;fill:var(--acc)}

/* ---------- header and the cross menu ---------- */
.ay-head{position:sticky;top:0;z-index:20;background:var(--pg2);border-bottom:1px solid var(--line);overflow-x:clip}
.ay-head-in{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:32px;min-height:80px}
/* the mark is a lit box on a wall bracket: a rod runs in from the left edge of the screen straight into the side of
   the box (no chains or hangers: look T owns the hanging sign), centred on the header's middle line */
.ay-mark{justify-self:start;display:flex;align-items:center;gap:16px;font:800 19px/1 var(--fd);letter-spacing:-.02em;text-decoration:none;white-space:nowrap}
.ay-f-optic .ay-mark{font-weight:700}
.ay-blade{position:relative;display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:calc(8px*var(--tune-radius,1));background:var(--deep);box-shadow:inset 0 0 0 2px color-mix(in oklab,var(--deep),#ffffff 14%)}
.ay-blade::before{content:"";position:absolute;right:100%;top:50%;width:clamp(24px,6vw,96px);height:4px;margin-top:-2px;background:var(--ink)}
.ay-blade::after{content:"";position:absolute;right:100%;top:50%;width:5px;height:16px;margin-top:-8px;border-radius:calc(2px*var(--tune-radius,1)) 0 0 calc(2px*var(--tune-radius,1));background:var(--ink)}
.ay-markx-plate{width:28px;height:28px;fill:var(--led)}
.ay-markx-plate .ay-off{fill:var(--ledoff)}
/* the links sit on one counter strip: a white top with a coloured kick plate along its foot, the phone number last */
.ay-nav{justify-self:end;margin-top:4px;display:flex;align-items:stretch;min-height:48px;padding:0 6px;border-radius:calc(10px*var(--tune-radius,1));background:var(--card);box-shadow:0 1px 0 var(--line);font-weight:600;font-size:calc(16px*var(--tune-size,1))}
.ay-nav a{display:flex;align-items:center;padding:0 20px 4px;text-decoration:none;position:relative}
.ay-nav a+a::before{content:"";position:absolute;left:0;top:12px;bottom:16px;width:1px;background:var(--line)}
.ay-nav a::after{content:"";position:absolute;left:20px;right:20px;bottom:12px;height:2px;background:var(--acc);opacity:0}
.ay-nav a:hover::after,.ay-nav a[aria-current]::after{opacity:1}
.ay-nav-tel{font-weight:800;letter-spacing:-.01em}
.ay-head-end{display:flex;align-items:center}
.ay-head-end .langs{font-size:calc(14px*var(--tune-size,1))}
.ay-menu{display:none}
.ay-menu summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;border:2px solid var(--ink);border-radius:calc(10px*var(--tune-radius,1));font:700 calc(15px*var(--tune-size,1))/1 var(--ft)}
.ay-menu summary::-webkit-details-marker{display:none}
.ay-menu summary::before{content:"";width:12px;height:12px;background:linear-gradient(currentColor,currentColor) center/12px 2.5px no-repeat,linear-gradient(currentColor,currentColor) center/2.5px 12px no-repeat}
.ay-menu-c,.ay-menu[open] .ay-menu-o{display:none}
.ay-menu[open] .ay-menu-c{display:inline}
.ay-menu[open] summary::before{transform:rotate(45deg)}
.ay-sheet{position:fixed;left:0;right:0;top:80px;bottom:0;overflow:auto;background:var(--pg);padding:32px var(--m) calc(40px*var(--tune-space,1));display:flex;flex-direction:column;align-items:center;gap:28px}
.ay-plus{display:grid;width:min(100%,400px);grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(96px,auto))}
.ay-arm{display:flex;align-items:center;justify-content:center;padding:12px 8px;text-align:center;background:var(--acc);color:var(--onacc);font:700 calc(16px*var(--tune-size,1))/1.2 var(--ft);text-decoration:none;overflow-wrap:anywhere;hyphens:auto}
.ay-arm[aria-current]{background:var(--ink);color:var(--pg)}
.ay-arm-n{grid-area:1/2;border-radius:calc(16px*var(--tune-radius,1)) calc(16px*var(--tune-radius,1)) 0 0}
.ay-arm-w{grid-area:2/1;border-radius:calc(16px*var(--tune-radius,1)) 0 0 calc(16px*var(--tune-radius,1))}
.ay-arm-e{grid-area:2/3;border-radius:0 calc(16px*var(--tune-radius,1)) calc(16px*var(--tune-radius,1)) 0}
.ay-arm-s{grid-area:3/2;border-radius:0 0 calc(16px*var(--tune-radius,1)) calc(16px*var(--tune-radius,1))}
.ay-plus-mid{grid-area:2/2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:var(--deep);color:var(--led);font:800 calc(15px*var(--tune-size,1))/1.2 var(--fd);text-align:center}
.ay-plus-mid small{font:600 calc(12px*var(--tune-size,1))/1.2 var(--ft);color:var(--deepmute)}
.ay-plus-mid .ay-markx{fill:var(--led)}
.ay-sheet-end{display:flex;align-items:center;gap:28px;font-weight:600}
.ay-sheet-end .langs{font-size:calc(16px*var(--tune-size,1))}

/* ---------- hero: sign ----------
   a split: the words bottom-left on the page tint, the photo filling the right half to the screen edge, and the
   lightbox sign mounted on the photo's top corner on a short wall rod, like the real street sign */
.ay-hero-sign{position:relative;display:grid;align-items:end;min-height:clamp(600px,calc(100svh - 80px),880px)}
.ay-split-ph{position:absolute;top:0;bottom:0;left:calc(50% - 40px);right:0;overflow:hidden;background:var(--tint)}
.ay-split-ph>img{width:100%;height:100%;object-fit:cover}
.ay-mount{position:absolute;top:clamp(32px,4vw,56px);right:max(var(--m),calc((100vw - var(--max)) / 2));width:clamp(200px,17vw,248px)}
.ay-mount::before{content:"";position:absolute;left:100%;top:50%;width:100vw;height:6px;margin-top:-3px;background:var(--ink)}
.ay-box-sign{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 22px 24px;background:var(--deep);border-radius:calc(18px*var(--tune-radius,1));box-shadow:inset 0 0 0 4px color-mix(in oklab,var(--deep) 86%,#000),0 24px 48px -28px #000}
.ay-box-sign .ay-sign{gap:20px;width:100%}
.ay-box-sign .ay-cross{width:62%}
.ay-box-sign .ay-tick{width:100%}
.ay-split-in{position:relative;padding-block:calc(clamp(48px,6vw,88px)*var(--tune-space,1))}
/* the words end 56 px before the photo: half the screen, less the wrap's outer margin and padding */
.ay-split-words{container-type:inline-size;width:calc(50vw - 96px - (100vw - min(100vw,var(--max) + 2 * var(--m))) / 2 - var(--m));display:grid;grid-template-columns:minmax(0,1fr);gap:28px;justify-items:start}
.ay-split-words>*{max-width:100%}

/* ---------- cartons (services, collect, the window card, the closing box) ---------- */
.ay-carton{position:relative;display:flex;flex-direction:column;gap:10px;padding:calc(44px*var(--tune-space,1)) 28px 26px;background:var(--card);border-radius:var(--r);box-shadow:0 1px 0 var(--line),0 18px 36px -28px color-mix(in oklab,var(--ink) 60%,transparent);--band:var(--b1)}
.ay-carton::before{content:"";position:absolute;left:0;right:0;top:0;height:16px;border-radius:var(--r) var(--r) 0 0;background:var(--band)}
.ay-carton::after{content:"";position:absolute;left:50%;top:-1px;width:30px;height:15px;margin-left:-15px;border-radius:0 0 calc(15px*var(--tune-radius,1)) calc(15px*var(--tune-radius,1));background:var(--sbg)}
.ay-band-1{--band:var(--b1)}.ay-band-2{--band:var(--b2)}.ay-band-3{--band:var(--b3)}
.ay-lead h3,.ay-carton h3{font:800 calc(21px*var(--tune-size,1))/1.2 var(--fd);letter-spacing:-.015em}
.ay-f-optic .ay-lead h3,.ay-carton h3{font-weight:700}
.ay-strength{font:800 calc(clamp(28px,2.6vw,36px)*var(--tune-size,1))/1.05 var(--fd);letter-spacing:-.03em;margin-top:4px}
.ay-f-optic .ay-strength{font-weight:500}
.ay-dose{font-size:calc(14px*var(--tune-size,1));font-weight:600;color:var(--mute);margin-top:-4px}
.ay-carton-t{color:var(--mute);font-size:calc(16px*var(--tune-size,1));line-height:1.55;text-wrap:pretty}
.ay-collect{justify-content:flex-start}
.ay-collect-tel{margin-top:auto;padding-top:12px}
.ay-collect p{color:var(--mute);line-height:1.5}
.ay-collect-tel a{font:800 24px/1.1 var(--fd);color:var(--ink);letter-spacing:-.02em;text-decoration:none;white-space:nowrap}

/* ---------- hero: window ----------
   the shop photo fills the first screen, the sign projects from its top corner on a bracket, the words sit
   bottom-left on the photo over a soft dark fade */
.ay-hero-window{position:relative;display:grid;align-items:end;min-height:clamp(600px,calc(100svh - 80px),900px);color:#fff;background:var(--deep)}
.ay-win-photo{position:absolute;inset:0}
.ay-win-photo img{width:100%;height:100%;object-fit:cover}
.ay-win-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0000 30%,rgb(4 14 10/.72))}
.ay-bracket{position:absolute;top:0;right:max(var(--m),calc((100% - var(--max)) / 2));width:clamp(132px,14vw,196px);padding-top:calc(clamp(28px,3vw,44px)*var(--tune-space,1))}
.ay-bracket::before{content:"";position:absolute;top:0;left:50%;width:6px;height:clamp(28px,3vw,44px);margin-left:-3px;background:var(--deep)}
.ay-bracket .ay-sign{padding:18% 12% 14%;background:var(--deep);border-radius:calc(16px*var(--tune-radius,1));box-shadow:inset 0 0 0 5px color-mix(in oklab,var(--deep) 80%,#000),0 20px 40px -24px #000}
.ay-win-in{position:relative;container-type:inline-size;display:grid;grid-template-columns:minmax(0,1fr);gap:24px;justify-items:start;padding-block:calc(clamp(48px,6vw,88px)*var(--tune-space,1))}
.ay-win-in>*{max-width:min(100%,820px)}
.ay-win-in .ay-lede{color:#fff;max-width:40ch}
.ay-win-in .ay-phone,.ay-win-in .ay-phone small{color:#fff}
.ay-win-in .ay-phone small{opacity:.88}

/* ---------- hero: eye chart ----------
   the headline set like an eye chart (spaced letters, short centred rows, one size) on the page, the action under
   it, and the shop photo filling the rest of the first screen edge to edge */
.ay-hero-chart{display:flex;flex-direction:column;min-height:clamp(620px,calc(100svh - 80px),940px)}
.ay-chart-top{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;padding-block:clamp(24px,2.4vw,36px) calc(clamp(28px,2.6vw,40px)*var(--tune-space,1))}
.ay-chart{container-type:inline-size;width:100%;display:flex;flex-direction:column;align-items:center;font-family:var(--fd);font-weight:calc(var(--hw) - 100);letter-spacing:.05em;line-height:.98;font-size:min(clamp(52px,8vw,116px),calc(100cqi / (var(--n) * .64)))}
.ay-f-optic .ay-chart{font-weight:300}
.ay-cl{position:relative;display:block;white-space:nowrap;font-size:inherit}
.ay-cl-t{display:block}
.ay-ghost{position:absolute;inset:0;opacity:0;pointer-events:none}
.ay-ghost-a{color:#d8402f}.ay-ghost-b{color:#1f9a57}
.ay-chart-lede{margin:clamp(16px,1.6vw,22px) auto 0;max-width:min(100%,960px)}
.ay-chart-act{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px 32px;margin-top:clamp(20px,2vw,28px)}
.ay-tlink{font-size:calc(17px*var(--tune-size,1));color:var(--mute)}
.ay-tlink a{font-weight:800;color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:.25em;white-space:nowrap}
.ay-tlink a:hover{text-decoration-color:currentColor}
/* chartdeep: the eye chart on the deep sign colour, light text, the button turned light like the sign's */
.ay-hero-deep{background:var(--deep);color:var(--ondeep)}
.ay-hero-deep .ay-chart,.ay-hero-deep .ay-tlink a{color:var(--ondeep)}
.ay-hero-deep .ay-chart-lede,.ay-hero-deep .ay-tlink{color:var(--deepmute)}
.ay-hero-deep .ay-tlink a{text-decoration-color:var(--deepmute)}
.ay-hero-deep .ay-chart-top{padding-block:calc(clamp(36px,4vw,64px)*var(--tune-space,1)) calc(clamp(36px,4vw,60px)*var(--tune-space,1))}
.ay-chart-photo{flex:1 0 auto;position:relative;min-height:clamp(300px,34vw,520px);background:var(--tint)}
.ay-chart-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ---------- services ---------- */
.ay-svc{padding:var(--sec) 0}
.ay-hero-sign+.ay-svc,.ay-hero-window+.ay-svc{padding-top:calc(clamp(64px,7vw,104px)*var(--tune-space,1))}
/* the main service as one big carton with a photo, the rest as a ruled price list */
.ay-svc-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:start}
.ay-lead{grid-column:1/6;padding:16px 0 0;gap:0;overflow:hidden}
.ay-lead::after{z-index:1}
.ay-lead-ph img{width:100%;aspect-ratio:4/3;object-fit:cover}
.ay-lead-t{display:flex;flex-direction:column;gap:10px;padding:28px clamp(24px,2.4vw,36px) 32px}
.ay-lead h3{font-size:calc(clamp(24px,2vw,28px)*var(--tune-size,1))}
.ay-lead .ay-strength{font-size:calc(clamp(36px,3.4vw,48px)*var(--tune-size,1))}
.ay-plist{grid-column:7/13;border-top:2px solid var(--ink)}
.ay-svc-grid-full .ay-plist{grid-column:1/13}
.ay-plist li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 32px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line)}
.ay-pl-t{display:grid;grid-template-columns:minmax(0,1fr);gap:6px}
.ay-plist h3{font:800 calc(20px*var(--tune-size,1))/1.25 var(--fd);letter-spacing:-.015em}
.ay-f-optic .ay-plist h3{font-weight:700}
.ay-pl-t p{color:var(--mute);font-size:calc(16px*var(--tune-size,1));line-height:1.55;text-wrap:pretty}
.ay-svc-grid-full .ay-pl-t p:not(.ay-small){color:var(--ink);max-width:68ch}
.ay-pl-p{display:grid;grid-template-columns:minmax(0,auto);justify-items:end;gap:2px;text-align:right;max-width:100%}
.ay-pl-p b,.ay-pl-p small{overflow-wrap:anywhere}
.ay-pl-p b{font:800 calc(24px*var(--tune-size,1))/1.1 var(--fd);letter-spacing:-.02em}
.ay-f-optic .ay-pl-p b{font-weight:500}
.ay-pl-p small{font-size:calc(14px*var(--tune-size,1));font-weight:600;color:var(--mute)}
.ay-leaflet{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--card);border-radius:calc(6px*var(--tune-radius,1));box-shadow:0 1px 0 var(--line),0 18px 36px -28px color-mix(in oklab,var(--ink) 60%,transparent)}
/* a tri-fold leaflet: the outer panels fold in towards the middle one, so they shade towards their folds */
.ay-leaf{display:flex;flex-direction:column;gap:14px;padding:calc(clamp(28px,2.6vw,40px)*var(--tune-space,1)) clamp(22px,2.2vw,32px)}
.ay-leaf:nth-child(3n+1){background:linear-gradient(90deg,transparent 74%,color-mix(in oklab,var(--ink) 6%,transparent))}
.ay-leaf:nth-child(3n){background:linear-gradient(270deg,transparent 74%,color-mix(in oklab,var(--ink) 6%,transparent))}
.ay-leaf:not(:nth-child(3n+1)){border-left:1px solid color-mix(in oklab,var(--ink) 10%,transparent)}
.ay-leaf:nth-child(n+4){border-top:1px dashed color-mix(in oklab,var(--ink) 16%,transparent)}
.ay-leaf h3{font:800 calc(20px*var(--tune-size,1))/1.2 var(--fd);letter-spacing:-.015em;padding-bottom:12px;border-bottom:3px solid var(--acc)}
.ay-f-optic .ay-leaf h3{font-weight:700}
.ay-leaf-t{font-size:calc(16px*var(--tune-size,1));line-height:1.55;color:var(--mute)}
.ay-leaflet-full .ay-leaf-t{color:var(--ink)}
.ay-leaf-f{margin-top:auto;display:grid;grid-template-columns:minmax(0,1fr);gap:6px;font-size:calc(15px*var(--tune-size,1))}
.ay-leaf-f div{display:flex;justify-content:space-between;gap:12px;border-top:1px dotted var(--line);padding-top:6px}
.ay-leaf-f dt{color:var(--mute)}
.ay-leaf-f dd{font-weight:800;text-align:right}

/* ---------- collect band: a full-bleed counter photo with the collect-here carton on it ---------- */
.ay-collect-band{display:grid;margin-bottom:var(--sec)}
.ay-band-ph{grid-area:1/1;height:clamp(440px,44vw,640px);background:var(--tint)}
.ay-band-ph img{width:100%;height:100%;object-fit:cover}
.ay-collect-row{grid-area:1/1;align-self:center;display:flex;justify-content:flex-end}
.ay-collect-row .ay-collect{width:min(100%,420px);padding:calc(52px*var(--tune-space,1)) 36px 32px}
.ay-collect-solo .ay-collect-row{justify-content:center}
.ay-collect-band:not(.ay-collect-solo) .ay-collect::after{display:none}

/* ---------- steps: a dosage line, a dot on the rule for each step ---------- */
.ay-steps{padding:0 0 var(--sec)}
.ay-steps ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px;margin-top:calc(48px*var(--tune-space,1));border-top:2px solid var(--ink)}
.ay-steps li{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:10px;align-content:start;padding-top:36px}
.ay-steps li::before{content:"";position:absolute;left:0;top:-9px;width:16px;height:16px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 5px var(--pg)}
.ay-step-n{font:800 calc(15px*var(--tune-size,1))/1 var(--fd);letter-spacing:.08em;color:var(--acc)}
.ay-steps h3{font:800 calc(clamp(22px,1.9vw,26px)*var(--tune-size,1))/1.2 var(--fd);letter-spacing:-.015em}
.ay-f-optic .ay-steps h3{font-weight:600}
.ay-steps p{color:var(--mute);max-width:34ch}

/* ---------- reviews ---------- */
.ay-rev{padding:var(--sec) 0}
/* cards: the first quote set large on its own carton, the others as a ruled column beside it */
.ay-rev-cards ul{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:auto;gap:0 24px;margin-top:calc(44px*var(--tune-space,1));align-items:start}
.ay-quote{display:flex;flex-direction:column;gap:20px}
.ay-quote blockquote{font-size:calc(19px*var(--tune-size,1));line-height:1.5}
.ay-rev-cards .ay-quote:first-child{grid-column:1/8;grid-row:1/span 3;padding:clamp(32px,3.4vw,52px);background:var(--card);border-radius:var(--r);box-shadow:0 1px 0 var(--line),0 18px 36px -28px color-mix(in oklab,var(--ink) 60%,transparent)}
.ay-rev-cards .ay-quote:first-child blockquote{font:var(--hw) calc(clamp(24px,2.4vw,34px)*var(--tune-size,1))/1.3 var(--fd);letter-spacing:-.02em;text-wrap:balance}
.ay-f-optic .ay-rev-cards .ay-quote:first-child blockquote{font-weight:300}
.ay-rev-cards .ay-quote:not(:first-child){grid-column:8/13;padding:24px 0;border-bottom:1px solid var(--line)}
.ay-rev-cards .ay-quote:nth-child(2){border-top:2px solid var(--ink)}
.ay-quote em{font-style:normal;font-weight:700}
.ay-by{margin-top:auto;font-size:calc(14px*var(--tune-size,1));font-weight:600;color:var(--mute)}
.ay-rev-one .ay-wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px 48px;align-items:baseline}
.ay-rev-one ul{margin-top:0}
.ay-rev-one .ay-quote{background:none;box-shadow:none;padding:0;max-width:900px}
.ay-rev-one blockquote{font:var(--hw) calc(clamp(26px,2.9vw,40px)*var(--tune-size,1))/1.25 var(--fd);letter-spacing:-.02em;text-wrap:balance}
.ay-f-optic .ay-rev-one blockquote{font-weight:300}

/* ---------- hours: the weekly pill box, on the deep sign colour ---------- */
.ay-hours{padding:var(--sec) 0;background:var(--deep);color:var(--ondeep);--sbg:var(--deep)}
.ay-hours-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:end;margin-bottom:calc(44px*var(--tune-space,1))}
.ay-hours-head .ay-h2{grid-column:1/7}
.ay-hours-where{grid-column:8/13;display:grid;grid-template-columns:minmax(0,1fr);gap:2px;font-size:calc(18px*var(--tune-size,1));color:var(--deepmute)}
.ay-hours-where a{font-weight:800;color:var(--ondeep);text-decoration:none}
.ay-box{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;padding:12px;background:color-mix(in oklab,var(--deep),#ffffff 9%);border-radius:calc(24px*var(--tune-radius,1))}
.ay-lid{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:168px;padding:30px 8px 20px;background:var(--card);color:var(--ink);border-radius:calc(14px*var(--tune-radius,1));text-align:center;--lid:var(--b1)}
.ay-lid::before{content:"";position:absolute;left:0;right:0;top:0;height:14px;border-radius:calc(14px*var(--tune-radius,1)) calc(14px*var(--tune-radius,1)) 0 0;background:var(--lid)}
.ay-lid-2,.ay-lid-5{--lid:var(--b2)}.ay-lid-3,.ay-lid-6{--lid:var(--b3)}
.ay-lid b{font-size:calc(15px*var(--tune-size,1));font-weight:700;overflow-wrap:anywhere}
.ay-lid span{display:flex;flex-direction:column;align-items:center;font:800 calc(22px*var(--tune-size,1))/1.15 var(--fd);letter-spacing:-.02em}
.ay-lid i{font-style:normal;font-weight:400;color:var(--mute);line-height:.9}
.ay-shut{background:transparent;color:var(--ondeep);box-shadow:inset 0 0 0 2px color-mix(in oklab,var(--deep),#ffffff 22%)}
.ay-shut::before{background:color-mix(in oklab,var(--deep),#ffffff 22%)}
.ay-shut span{font:600 calc(15px*var(--tune-size,1))/1.2 var(--ft);color:var(--deepmute)}
.ay-week .wk ol{display:grid;gap:10px}
.ay-week .wk li{display:grid;grid-template-columns:140px 1fr 140px;align-items:center;gap:18px}
.ay-week .wk-n{font-weight:700}
.ay-week .wk-bar{position:relative;height:18px;border-radius:calc(9px*var(--tune-radius,1));background:color-mix(in oklab,var(--deep),#ffffff 12%)}
.ay-week .wk-bar i{position:absolute;top:0;bottom:0;border-radius:calc(9px*var(--tune-radius,1));background:var(--led)}
.ay-week .wk-t{font-weight:700;text-align:right}
.ay-week .off .wk-t{color:var(--deepmute);font-weight:500}
.ay-week .wk-scale{display:flex;justify-content:space-between;margin:10px 158px 0;font-size:calc(15px*var(--tune-size,1));color:var(--deepmute)}

/* ---------- closing ---------- */
.ay-close{padding:var(--sec) 0}
.ay-close-sign{background:var(--deep);color:var(--ondeep)}
.ay-close-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:center}
.ay-close-in .ay-sign{grid-column:1/5}
.ay-close-words{grid-column:5/13;display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.ay-close-words p{color:var(--deepmute);font-size:calc(19px*var(--tune-size,1));max-width:44ch}
.ay-close-act{display:flex;align-items:center;flex-wrap:wrap;gap:16px 32px;margin-top:8px}
.ay-close-act .ay-phone{font-size:calc(clamp(28px,3vw,40px)*var(--tune-size,1));color:var(--ondeep)}
.ay-btn-led{background:var(--ondeep);color:var(--deep)}
.ay-bigbox{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px 24px;padding:calc(clamp(56px,5vw,72px)*var(--tune-space,1)) clamp(24px,4vw,56px) calc(clamp(28px,3vw,40px)*var(--tune-space,1));background:var(--card);border-radius:calc(18px*var(--tune-radius,1));box-shadow:0 1px 0 var(--line),0 30px 60px -44px color-mix(in oklab,var(--ink) 70%,transparent)}
.ay-bigbox::before{content:"";position:absolute;left:0;right:0;top:0;height:20px;border-radius:calc(18px*var(--tune-radius,1)) calc(18px*var(--tune-radius,1)) 0 0;background:var(--b1)}
.ay-bigbox::after{content:"";position:absolute;left:50%;top:-1px;width:40px;height:20px;margin-left:-20px;border-radius:0 0 calc(20px*var(--tune-radius,1)) calc(20px*var(--tune-radius,1));background:var(--sbg)}
.ay-bigbox-main{grid-column:1/7;display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-content:start;justify-items:start}
.ay-bigbox-main>*{max-width:100%}
.ay-bigbox-facts{grid-column:8/13;display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-content:start}
.ay-bigbox-facts dt,.ay-facts dt{font-size:calc(14px*var(--tune-size,1));font-weight:600;color:var(--mute)}
.ay-bigbox-facts dd{font-size:calc(18px*var(--tune-size,1));font-weight:700;display:grid}
.ay-bigbox-facts a{text-decoration:none}

/* ---------- page heads ---------- */
.ay-ph{padding:calc(clamp(48px,6vw,88px)*var(--tune-space,1)) 0 calc(clamp(40px,5vw,64px)*var(--tune-space,1));border-bottom:1px solid var(--line)}
.ay-ph-in{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;justify-items:start}
.ay-ph-in>*{max-width:100%}
.ay-ph-h{font-size:calc(clamp(40px,5.4vw,76px)*var(--tune-size,1))}
.ay-ph .ay-lede{max-width:46ch}
.ay-svc-full{padding-top:calc(clamp(48px,5vw,72px)*var(--tune-space,1))}

/* ---------- FAQ ---------- */
.ay-faq{padding:0 0 var(--sec)}
.ay-faq .ay-h2{margin-bottom:32px}
.ay-faq-list{display:grid;gap:10px;max-width:900px}
.ay-faq details{background:var(--card);border-radius:var(--r)}
.ay-faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;font-weight:700;font-size:calc(18px*var(--tune-size,1))}
.ay-faq summary::-webkit-details-marker{display:none}
.ay-plusi{flex:none;width:28px;height:28px;border-radius:calc(8px*var(--tune-radius,1));background:linear-gradient(var(--onacc),var(--onacc)) center/12px 2.5px no-repeat,linear-gradient(var(--onacc),var(--onacc)) center/2.5px 12px no-repeat,var(--acc)}
.ay-faq details[open] .ay-plusi{background:linear-gradient(var(--onacc),var(--onacc)) center/12px 2.5px no-repeat,var(--acc)}
.ay-faq details p{padding:0 24px 22px;color:var(--mute);max-width:70ch}
.ay-faq-open dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 40px}
.ay-faq-open dl>div{padding-top:18px;border-top:3px solid var(--acc)}
.ay-faq-open dt{font-weight:800;font-size:calc(18px*var(--tune-size,1));margin-bottom:8px}
.ay-faq-open dd{color:var(--mute)}

/* ---------- team ---------- */
.ay-teamph{margin-top:calc(clamp(32px,4vw,56px)*var(--tune-space,1))}
.ay-teamph img{width:100%;aspect-ratio:16/7;object-fit:cover;border-radius:calc(22px*var(--tune-radius,1))}
.ay-team{padding:calc(clamp(48px,5vw,80px)*var(--tune-space,1)) 0}
.ay-team-badges ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.ay-badge{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr);gap:16px 18px;align-content:start;padding:calc(40px*var(--tune-space,1)) 28px 28px;background:var(--card);border-radius:var(--r);box-shadow:0 1px 0 var(--line)}
.ay-badge::before{content:"";position:absolute;left:0;right:0;top:0;height:12px;border-radius:var(--r) var(--r) 0 0;background:var(--band)}
.ay-ini{display:grid;place-items:center;width:64px;height:64px;border-radius:calc(14px*var(--tune-radius,1));background:var(--deep);color:var(--led);font:800 calc(28px*var(--tune-size,1))/1 var(--fd)}
.ay-badge-t{align-self:center;display:grid;grid-template-columns:minmax(0,1fr);gap:4px}
.ay-person{font:800 calc(20px*var(--tune-size,1))/1.2 var(--fd);letter-spacing:-.015em}
.ay-f-optic .ay-person{font-weight:700}
.ay-role{font-size:calc(15px*var(--tune-size,1));font-weight:600;color:var(--mute)}
.ay-bio{grid-column:1/3;color:var(--mute);line-height:1.55}
.ay-team-list ul{display:grid;gap:0;border-top:1px solid var(--line)}
.ay-team-list .ay-badge{grid-template-columns:64px minmax(0,4fr) minmax(0,7fr);align-items:center;gap:24px;padding:24px 0;background:none;box-shadow:none;border-radius:0;border-bottom:1px solid var(--line)}
.ay-team-list .ay-badge::before{display:none}
.ay-team-list .ay-bio{grid-column:auto}

/* ---------- contact ---------- */
.ay-contact{padding:calc(clamp(48px,5vw,80px)*var(--tune-space,1)) 0 var(--sec)}
.ay-contact-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}
.ay-reach{grid-column:1/6;display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-content:start}
.ay-reach-l{color:var(--mute);max-width:40ch}
.ay-facts{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin-top:8px}
.ay-facts dd{font-size:calc(20px*var(--tune-size,1));font-weight:700}
.ay-facts a{text-decoration:none}
.ay-form{grid-column:7/13;display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding:36px clamp(20px,3vw,36px);background:var(--card);border-radius:var(--r);box-shadow:0 1px 0 var(--line)}
.ay-form label{display:grid;gap:6px;font-size:calc(15px*var(--tune-size,1));font-weight:600}
.ay-form input,.ay-form textarea,.ay-form select{font:inherit;font-weight:400;font-size:calc(17px*var(--tune-size,1));padding:12px 14px;border:2px solid var(--line);border-radius:calc(10px*var(--tune-radius,1));background:var(--card);color:var(--ink);width:100%}
.ay-form input:focus,.ay-form textarea:focus,.ay-form select:focus{border-color:var(--acc);outline:none}
.ay-form .ay-btn{justify-self:start;margin-top:6px}
.ay-contact-card .ay-reach{grid-column:1/13;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px}
.ay-contact-card .ay-reach>.ay-h2,.ay-contact-card .ay-reach-l{grid-column:1/7}
.ay-contact-card .ay-facts{grid-column:1/13;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding:36px 32px;background:var(--card);border-radius:var(--r);box-shadow:0 1px 0 var(--line)}
.ay-legalline{padding:28px 0 calc(48px*var(--tune-space,1));font-size:calc(14px*var(--tune-size,1));color:var(--mute)}

/* ---------- gallery, legal, footer ---------- */
.ay-gal{padding:var(--sec) 0 0}
.ay-gal .g-title{font-size:calc(clamp(34px,4.2vw,60px)*var(--tune-size,1))}
/* the shared gallery's grid boxes give long words no room to break (g-head, g-ss-cap); keep them inside */
.ay-gal .g-head,.ay-gal .g-ss-cap{grid-template-columns:minmax(0,1fr)}
.ay-gal .g-title,.ay-gal .g-ss-cap b{overflow-wrap:break-word}
.ay-legal{padding-top:calc(48px*var(--tune-space,1));padding-bottom:var(--sec);max-width:calc(820px + 2 * var(--m))}
.ay-legal h1{font:var(--hw) calc(clamp(34px,4vw,52px)*var(--tune-size,1))/1.1 var(--fd);letter-spacing:var(--hs);margin-bottom:24px;overflow-wrap:break-word}
.ay-legal h2{font:800 calc(22px*var(--tune-size,1))/1.25 var(--fd);margin:32px 0 10px}
.ay-legal p,.ay-legal ul{margin-bottom:12px}
.ay-legal ul{list-style:disc;padding-left:22px}
.ay-foot{background:var(--pg2);border-top:1px solid var(--line);padding:calc(56px*var(--tune-space,1)) 0 calc(40px*var(--tune-space,1));font-size:calc(15px*var(--tune-size,1))}
.ay-foot-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:28px 24px}
.ay-foot-id{grid-column:1/5;display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-content:start}
.ay-foot-name{display:flex;align-items:center;gap:10px;font:800 calc(20px*var(--tune-size,1))/1.2 var(--fd);letter-spacing:-.02em}
.ay-foot-col{grid-column:span 3;display:grid;grid-template-columns:minmax(0,1fr);gap:4px;align-content:start}
.ay-foot-col a{text-decoration:none}
.ay-foot-col a:hover{text-decoration:underline}
.ay-foot-k{font-weight:700}
.ay-foot-legal{grid-column:span 2;gap:10px}
.ay-foot-legal ul{display:grid;gap:4px}
.ay-fic{font-size:calc(13px*var(--tune-size,1));color:var(--mute)}

/* ---------- tablets ---------- */
@media (max-width:1100px){
  .ay-leaflet{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ay-leaf:nth-child(n){background:none;border-left:0;border-top:0}
  .ay-leaf:nth-child(2n){border-left:1px solid color-mix(in oklab,var(--ink) 10%,transparent)}
  .ay-leaf:nth-child(n+3){border-top:1px dashed color-mix(in oklab,var(--ink) 16%,transparent)}
  .ay-box{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ay-foot-id{grid-column:1/13}
  .ay-foot-col{grid-column:span 4}
  .ay-foot-legal{grid-column:span 4}
  .ay-team-badges ul{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .ay-rev-one .ay-wrap{grid-template-columns:minmax(0,1fr)}
  .ay-rev-cards .ay-quote:first-child,.ay-rev-cards .ay-quote:not(:first-child){grid-column:1/13;grid-row:auto}
  .ay-rev-cards .ay-quote:nth-child(2){margin-top:24px}
  .ay-head-in{grid-template-columns:minmax(0,1fr) auto;min-height:64px;gap:16px}
  .ay-nav,.ay-head-end{display:none}
  .ay-blade{width:36px;height:36px;border-radius:calc(7px*var(--tune-radius,1))}
  .ay-blade::after{height:12px;margin-top:-6px}
  .ay-markx-plate{width:22px;height:22px}
  .ay-mark{gap:12px}
  .ay-menu{display:block}
  .ay-sheet{top:64px}
  :root{--m-head-offset:64px;--g-top:64px}
  .ay-close-in,.ay-sec-head,.ay-hours-head,.ay-contact-grid,.ay-svc-grid{grid-template-columns:minmax(0,1fr)}
  .ay-close-in>*,.ay-sec-head>*,.ay-hours-head>*,.ay-contact-grid>*,.ay-svc-grid>*{grid-column:1/-1!important}
  /* sign hero: the photo on top with the sign on its corner, the words under it */
  .ay-hero-sign{display:block;min-height:0}
  .ay-split-ph{position:relative;left:auto;height:clamp(300px,56vw,460px)}
  .ay-mount{top:20px;width:clamp(112px,20vw,168px)}
  .ay-box-sign{padding:16px 12px 14px;border-radius:calc(14px*var(--tune-radius,1));box-shadow:inset 0 0 0 3px color-mix(in oklab,var(--deep) 86%,#000),0 16px 32px -20px #000}
  .ay-box-sign .ay-sign{gap:12px}
  .ay-split-in{padding-block:28px calc(40px*var(--tune-space,1))}
  .ay-split-words{width:auto;gap:20px}
  .ay-hero-window{min-height:clamp(560px,calc(100svh - 64px),760px)}
  .ay-hero-chart{min-height:clamp(560px,calc(100svh - 64px),900px)}
  .ay-lede{max-width:none}
  .ay-collect-band{display:block}
  .ay-band-ph{height:clamp(280px,60vw,440px)}
  .ay-lead-ph img{aspect-ratio:16/10}
  .ay-collect-row{position:relative;margin-top:-72px;justify-content:center}
  .ay-sec-head{margin-bottom:32px;gap:14px}
  .ay-steps ol{grid-template-columns:minmax(0,1fr);gap:32px;border-top:0;border-left:2px solid var(--ink);margin-left:7px}
  .ay-steps li{padding:0 0 0 32px}
  .ay-steps li::before{left:-9px;top:2px}
  .ay-close-in .ay-sign{flex-direction:row;justify-content:flex-start;gap:24px}
  .ay-sign-band .ay-cross{width:96px}
  .ay-bigbox-main,.ay-bigbox-facts{grid-column:1/13}
  .ay-faq-open dl{grid-template-columns:minmax(0,1fr)}
  .ay-form{margin-top:16px}
  .ay-contact-card .ay-facts{grid-template-columns:minmax(0,1fr)}
  .ay-week .wk li{grid-template-columns:110px 1fr 110px;gap:12px}
  .ay-week .wk-scale{margin:10px 122px 0}
}
@media (max-width:640px){
  .ay-team-badges ul{grid-template-columns:minmax(0,1fr)}
  .ay-leaflet{grid-template-columns:minmax(0,1fr)}
  .ay-leaf:nth-child(2n){border-left:0}
  .ay-leaf:nth-child(n+2){border-top:1px dashed color-mix(in oklab,var(--ink) 16%,transparent)}
  .ay-box{grid-template-columns:minmax(0,1fr);gap:8px;padding:10px;border-radius:calc(20px*var(--tune-radius,1))}
  .ay-lid{flex-direction:row;justify-content:space-between;min-height:58px;padding:12px 18px 12px 34px}
  .ay-lid::before{right:auto;bottom:0;width:14px;height:auto;border-radius:calc(14px*var(--tune-radius,1)) 0 0 calc(14px*var(--tune-radius,1))}
  .ay-lid span{flex-direction:row;gap:4px;font-size:calc(19px*var(--tune-size,1))}
  .ay-lid i{line-height:inherit}
  .ay-plist li{grid-template-columns:minmax(0,1fr);gap:10px}
  .ay-pl-p{display:flex;align-items:baseline;gap:12px;justify-items:start;text-align:left}
  .ay-chart-act{flex-direction:column;align-items:stretch;gap:14px;width:100%}
  .ay-chart-act .ay-btn{width:100%}
  .ay-collect-row .ay-collect{padding:calc(48px*var(--tune-space,1)) 24px 28px}
  .ay-act{flex-direction:column;align-items:stretch;gap:16px;justify-self:stretch}
  .ay-act .ay-btn{width:100%}
  .ay-act .ay-phone{align-items:center;text-align:center}
  .ay-foot-col,.ay-foot-legal{grid-column:1/13}
  .ay-team-list .ay-badge{grid-template-columns:56px minmax(0,1fr)}
  .ay-team-list .ay-bio{grid-column:1/3}
  .ay-week .wk li{grid-template-columns:minmax(0,1fr) auto;row-gap:6px}
  .ay-week .wk-bar{grid-column:1/3;grid-row:2}
  .ay-week .wk-scale{margin:10px 0 0}
  .ay-bracket{width:104px}
}

/* ---------- motion ---------- */
@media (prefers-reduced-motion:no-preference){
  .ay-nav a::after{transition:opacity .2s}
  @media (hover:hover){
    .ay-carton,.ay-badge{transition:transform .25s cubic-bezier(.2,.7,.2,1)}
    .ay-carton:hover,.ay-badge:hover{transform:translateY(-4px)}
    .ay-arm{transition:filter .15s}
  }
}

/* ---------- Advanced hero moment ----------
   sign and window: "switch-on". The LED cross lights up ring by ring from its middle, then the dot-matrix hours
   flicker on like a real pharmacy sign; the sign box settles 10 px (window: the sign drops onto its bracket and the
   words rise).
   chart: "into focus". Each eye-chart line starts doubled (a red and a green ghost either side of it) and the ghosts
   slide into the letters and fade, line after line, like a lens clicking into place. Transform and opacity only;
   the headline is readable from the first frame and every layer ends exactly where the still page has it. */
@media (prefers-reduced-motion:no-preference){
  .m-js .ay-hero .ay-r{animation:ay-on .42s cubic-bezier(.2,.7,.2,1) backwards}
  .m-js .ay-hero .ay-r0{animation-delay:.2s}.m-js .ay-hero .ay-r1{animation-delay:.3s}.m-js .ay-hero .ay-r2{animation-delay:.4s}
  .m-js .ay-hero .ay-r3{animation-delay:.5s}.m-js .ay-hero .ay-r4{animation-delay:.6s}.m-js .ay-hero .ay-r5{animation-delay:.7s}
  .m-js .ay-hero .ay-on{animation:ay-flicker .6s 1s linear backwards}
  .m-js .ay-hero-sign .ay-box-sign{animation:ay-settle .9s cubic-bezier(.2,.7,.2,1) backwards}
  .m-js .ay-hero-sign .ay-split-words{animation:ay-rise .8s .15s cubic-bezier(.2,.7,.2,1) backwards}
  .m-js .ay-hero-window .ay-win-in{animation:ay-lift .9s .15s cubic-bezier(.2,.7,.2,1) backwards}
  .m-js .ay-hero-window .ay-bracket{animation:ay-drop .8s cubic-bezier(.2,.7,.2,1) backwards}
  .m-js .ay-ghost{animation:ay-ghost-a .9s cubic-bezier(.3,.6,.2,1) backwards}
  .m-js .ay-ghost-b{animation-name:ay-ghost-b}
  .m-js .ay-cl-1 .ay-ghost{animation-delay:.3s}.m-js .ay-cl-2 .ay-ghost{animation-delay:.48s}
  .m-js .ay-cl-3 .ay-ghost{animation-delay:.66s}
}
@keyframes ay-on{from{opacity:0}to{opacity:1}}
@keyframes ay-flicker{0%{opacity:0}30%{opacity:1}45%{opacity:.25}60%{opacity:1}75%{opacity:.6}100%{opacity:1}}
@keyframes ay-settle{from{transform:translateY(10px)}to{transform:none}}
@keyframes ay-rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes ay-lift{from{transform:translateY(36px)}to{transform:none}}
@keyframes ay-drop{from{transform:translateY(-24px);opacity:0}to{transform:none;opacity:1}}
@keyframes ay-ghost-a{from{opacity:.6;transform:translateX(-.12em)}to{opacity:0;transform:none}}
@keyframes ay-ghost-b{from{opacity:.6;transform:translateX(.12em)}to{opacity:0;transform:none}}
@media (min-width:1000px){.ay-plist li{padding:31px 0}.ay-pl-t{gap:8px}}