/* Reflow, legibility and keyboard access; the brand mark is unchanged. */
:root{--header-offset:116px;--mobile-clearance:0px}
html{scroll-padding-top:var(--header-offset);scroll-padding-bottom:calc(var(--mobile-clearance) + 16px)}
body{font-size:1.125rem;overflow-wrap:break-word}
.header-inner{height:auto;min-height:100px;padding-block:10px;flex-wrap:wrap}
.navigation{flex-wrap:wrap}
.hero,.services-layout,.daily-grid,.loyalty-card,.contact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.contact-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.hero>*,.services-layout>*,.daily-grid>*,.loyalty-card>*,.contact-grid>*,.practical-item>div{min-width:0}
h1,h2,h3,.care-statement{overflow-wrap:anywhere}
.hero h1{font-size:clamp(2.35rem,1.4rem + 4.7vw,6rem);line-height:1.08;letter-spacing:-.045em}
.hero h1 span{color:#287d6c}
.button,.text-link,.service-action,.navigation a,.header-phone{font-size:1rem;min-height:48px}
.button{white-space:normal;text-align:center;max-width:100%}
.eyebrow,.small-title,.practical-secondary,.photo-caption span,.daily-image>span,.care-note .eyebrow,.care-signature,.small-note,.footer-bottom,.hours-note,.address-footnote,.whatsapp-card .eyebrow{font-size:.875rem;line-height:1.6}
.topline,.hero-note,.footer-main .text-link,.service-number{font-size:.875rem}
.email-link,.brand-descriptions p,.contact-address>p,.contact-details h3,.whatsapp-card>p:not([class]),.loyalty-benefits>p,.care-note>p:not([class]),dl>div{font-size:1rem}
.photo-caption{overflow-wrap:anywhere}
.practical-link{padding-block:5px;min-height:44px}
.hero-actions,.footer-main,.footer-bottom{flex-wrap:wrap}
.brand-descriptions{grid-template-columns:repeat(2,minmax(0,1fr))}
.service summary{min-height:64px;gap:16px}
.service summary>span:nth-child(2){min-width:0;overflow-wrap:anywhere}
dd{overflow-wrap:anywhere}
.phone-big{overflow-wrap:anywhere}
.whatsapp-card .button{font-size:1rem}
.whatsapp-card .small-note{overflow-wrap:anywhere}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #143a34;outline-offset:3px;box-shadow:0 0 0 3px #fff;border-radius:4px}
dialog{width:min(34rem,calc(100% - 32px));padding:48px 32px 32px;max-height:calc(100dvh - 32px);overscroll-behavior:contain}
dialog h2{font-size:clamp(1.8rem,1.3rem + 3vw,2.6rem)}
.dialog-close{width:48px;height:48px;right:8px;top:8px}
@media(max-width:72rem){
 .contact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .whatsapp-card{display:block;grid-column:1/-1}
 .whatsapp-card>svg{margin-bottom:20px}
 .whatsapp-card>p:not([class]){margin-block:20px}
 .whatsapp-card .button{width:auto}
 .whatsapp-card .small-note{text-align:left}
}
@media(max-width:64rem){
 .container{width:calc(100% - 40px)}
 .header-inner{min-height:82px;gap:12px}
 .header-phone{margin-left:auto;min-width:48px;justify-content:center}
 .header-phone span{display:none}
 .menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:48px;height:48px;border:1px solid #526c66;border-radius:6px;background:#fff;flex:none}
 .menu-toggle span{width:19px;height:2px;background:var(--ink)}
 .navigation{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;padding:12px 24px 20px;flex-direction:column;gap:0;align-items:stretch;border-top:1px solid var(--line);max-height:60dvh;overflow-y:auto;overscroll-behavior:contain}
 .navigation.is-open{display:flex}
 .navigation a{padding:13px 2px;white-space:normal}
 .navigation a.active:after{display:none}
 .hero,.services-layout,.daily-grid,.loyalty-card{grid-template-columns:minmax(0,1fr)}
 .hero{gap:32px;padding-top:32px}
 .hero h1{font-size:clamp(2.35rem,1.4rem + 6.3vw,5rem)}
 .hero-description{max-width:38rem;font-size:1.125rem}
 .hero-actions{flex-direction:row;align-items:center;flex-wrap:wrap}
 .hero-actions .button,.hero-actions .text-link{font-size:1rem}
 .hero-visual{height:auto;min-height:0;margin-right:0}
 .hero-photo{height:auto;max-height:650px;aspect-ratio:1.15;object-fit:cover;object-position:50% 35%}
 .vertical-caption{display:none}
 .hero-note{display:none}
 .practical{grid-template-columns:minmax(0,1fr);padding:24px}
 .practical-location{display:flex}
 .practical-item+.practical-item{padding-left:0;padding-top:20px;border-left:0;border-top:1px solid var(--line)}
 .practical-main,.practical-link{font-size:1.0625rem}
 .services-layout{gap:32px}
 .care-note{min-height:0;overflow:visible}
 .care-note>img{position:static;margin-bottom:20px}
 .care-note .eyebrow{padding-right:0}
 .daily-grid{gap:32px}
 .daily-image{height:auto;min-height:0}
 .daily-image img{height:auto;aspect-ratio:1.3;object-fit:cover}
 .daily h2,.loyalty h2{font-size:clamp(2rem,1.3rem + 3vw,3.4rem)}
 .loyalty-card{gap:32px}
 .loyalty-benefits h3{font-size:1.125rem}
 .daily-copy>p:not(.eyebrow),.loyalty-copy>p:not(.eyebrow){font-size:1.125rem}
}
@media(max-width:40rem){
 body{padding-bottom:calc(var(--mobile-clearance) + 16px)}
 .header-inner{min-height:76px;gap:8px}
 .brand{width:134px;max-width:calc(100% - 112px)}
 .header-phone{padding:8px}
 .section{padding-block:56px}
 .loyalty{padding-bottom:0}
 h2{font-size:clamp(1.9rem,1.2rem + 4vw,2.75rem)}
 .hero h1{font-size:clamp(2.35rem,1.4rem + 6.3vw,4.2rem)}
 .hero-visual{height:auto}
 .hero-photo{aspect-ratio:1;max-height:none}
 .photo-caption{position:static;max-width:none;margin-top:12px;padding:16px;background:var(--pale)}
 .photo-caption strong{font-size:1.125rem}
 .service summary{font-size:1.35rem}
 .service-content{padding-left:0;padding-right:0}
 .care-statement{font-size:clamp(2rem,1rem + 5vw,3rem)}
 .care-note{padding:26px}
 .daily-image>span{position:static;display:block;margin-top:12px;padding:14px 16px;letter-spacing:.06em}
 .daily-copy,.daily-image{order:initial}
 .brand-descriptions{grid-template-columns:minmax(0,1fr)}
 .loyalty-card{padding:28px 24px}
 .loyalty-benefits>div{align-items:flex-start}
 .contact-grid{grid-template-columns:minmax(0,1fr)}
 .whatsapp-card{grid-column:auto;padding:26px}
 .whatsapp-card .button{width:100%}
 .contact-address{padding:26px}
 dl>div{flex-wrap:wrap;gap:4px 16px}
 dd{text-align:left}
 .footer-main .brand{max-width:none}
 .footer-main .text-link{font-size:1rem}
 .footer-bottom{font-size:.875rem}
 .mobile-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;padding-bottom:env(safe-area-inset-bottom);z-index:40;background:#fff;border-top:1px solid #526c66}
 .mobile-actions a{flex-direction:column;gap:4px;min-height:68px;padding:8px 4px;font-size:.875rem;line-height:1.4;text-align:center;overflow-wrap:anywhere}
 .mobile-actions .mobile-whatsapp{background:var(--mint);color:var(--ink)}
 .mobile-actions svg{width:22px;height:22px}
 .mobile-actions a:focus-visible{outline-offset:-5px;box-shadow:none;outline-color:currentColor}
 dialog{padding:52px 24px 28px}
}
@media(max-height:30rem){
 .header{position:relative}
 .mobile-actions{position:static}
 body{padding-bottom:0}
 html{scroll-padding-top:16px;scroll-padding-bottom:16px}
}
@media(forced-colors:active){a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid Highlight;box-shadow:none}.button{border:1px solid ButtonText}.menu-toggle{border-color:ButtonText}}

/* Pharmacy guard turns remain readable with narrow screens and enlarged text. */
.guard-list ul { list-style:none; padding:0; margin:1rem 0; }
.guard-list li { display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; padding:.85rem 0; border-bottom:1px solid #b1c9c1; }
.guard-list time { font-weight:700; }
.guard-note { flex-basis:100%; color:var(--muted); font-size:1rem; }
.guard-list [data-guard-message] { font-size:1rem; line-height:1.6; }
.guard-list .text-link { min-height:48px; display:inline-flex; align-items:center; }
.guard-dropdown { border:1px solid #a4c9bd; border-radius:8px; overflow:hidden; background:#fff; }
.guard-dropdown summary { display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:1rem; cursor:pointer; min-height:88px; padding:1rem; list-style:none; }
.guard-dropdown summary::-webkit-details-marker { display:none; }
.guard-dropdown summary:hover { background:#edf7f2; }
.guard-dropdown[open] summary { border-bottom:1px solid #a4c9bd; background:#edf7f2; }
.guard-summary-icon { display:flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:8px; background:#dff2e9; color:#215f51; }
.guard-summary-icon svg { width:28px; height:28px; }
.guard-summary-copy { display:flex; flex-direction:column; gap:.25rem; }
.guard-summary-copy strong { font-size:1.12rem; line-height:1.4; }
.guard-summary-copy [data-guard-day] { font-size:.95rem; color:var(--muted); }
.guard-action { display:inline-flex; align-items:center; gap:.6rem; padding:.65rem .9rem; border-radius:6px; background:#215f51; color:#fff; font-size:.95rem; font-weight:700; white-space:nowrap; }
.guard-chevron { width:20px; height:20px; }
.guard-dropdown[open] .guard-chevron { transform:rotate(180deg); }
.guard-hide, .guard-dropdown[open] .guard-show { display:none; }
.guard-dropdown[open] .guard-hide { display:inline; }
.guard-dropdown > p, .guard-dropdown > ul { margin-inline:1rem; }
.guard-intro { color:var(--muted); margin-top:.5rem; }
.guard-list [data-city-guards] li { display:grid; gap:.3rem; }
.guard-list [data-city-guards] a { text-decoration:underline; text-underline-offset:3px; width:fit-content; min-height:44px; display:flex; align-items:center; }
.guard-list [data-city-guards] .guard-lakua { padding:1.2rem; margin:.5rem 0; border:2px solid #215f51; border-left-width:6px; border-radius:8px; background:#e0f4ec; }
.guard-lakua-badge { width:fit-content; padding:.2rem .65rem; border-radius:4px; background:#215f51; color:#fff; font-size:.85rem; font-weight:700; }
.opening-status { display:flex; align-items:center; gap:1rem; margin-top:1.5rem; padding:1rem 1.2rem; max-width:460px; border-radius:10px; background:#215f51; color:#fff; box-shadow:0 5px 16px #143a3418; }
.opening-status[data-opening-state="closed"] { background:#666666; }
.opening-status[data-opening-state="unknown"] { background:#70571c; }
.opening-clock { display:flex; align-items:center; justify-content:center; width:48px; height:48px; flex-shrink:0; border:1px solid #ffffff70; border-radius:50%; background:#ffffff15; }
.opening-clock svg { width:30px; height:30px; stroke-width:1.8; }
.opening-copy { display:flex; flex-direction:column; gap:.25rem; min-width:0; }
.opening-badge { display:block; font-size:1.2rem; font-weight:900; line-height:1.35; }
.opening-detail { color:#fff; font-size:.92rem; line-height:1.5; }
.service-icon { width:44px; height:44px; flex-shrink:0; display:flex; align-items:center; justify-content:center; border-radius:10px; background:#e0f4ec; color:#215f51; }
.service-icon svg { width:27px; height:27px; stroke-width:1.7; }
.service-content { padding-left:60px; }
@media(max-width:600px) {
  .opening-status { padding:1rem; gap:.8rem; }
  .opening-badge { font-size:1.12rem; }
  .guard-dropdown summary { grid-template-columns:40px minmax(0,1fr); gap:.65rem .8rem; padding:1rem; }
  .guard-summary-icon { width:40px; height:40px; }
  .guard-action { grid-column:2; justify-self:start; white-space:normal; }
  .guard-summary-copy strong { font-size:1rem; }
  .service-content { padding-left:0; }
}
.contact-photo { width:100%; height:auto; aspect-ratio:1200 / 666; object-fit:cover; border-radius:6px; margin-bottom:1.5rem; }
.daily-image > span { right:auto; width:fit-content; max-width:calc(100% - 50px); }
@media(max-width:600px) { .daily-image > span { max-width:calc(100% - 40px); } }
