/* Foundation theme: the one stylesheet. Started from the approved sample page (VL_DESIGN).
   Brand colours and faces arrive as CSS variables printed from brand.php. Nothing is called from another server.
   Three layouts by width (A14): narrow up to 599 px, middle 600 to 1100 px, wide above 1100 px. */

/* base (A1, A3, A4) */
:root{--gut:24px;--wrap:1200px;--hd:64px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;font-family:var(--body);font-size:17px;line-height:1.6;color:var(--ink);background:var(--page);-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
a{color:var(--deep);font-weight:700}
h1,h2,h3{font-family:var(--disp);letter-spacing:-.015em;line-height:1.08;margin:0 0 14px;text-wrap:balance;color:var(--ink)}
h1{font-size:clamp(34px,5.2vw,64px);font-weight:800}
h2{font-size:clamp(27px,3.2vw,42px);font-weight:800}
h3{font-size:20px;font-weight:700}
p{margin:0 0 14px}
.w{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.eb{font:700 12.5px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--deep);margin:0 0 10px}
.sub{color:var(--mute);max-width:62ch;margin-bottom:28px}
.grad{background:linear-gradient(100deg,var(--ba),var(--bb));-webkit-background-clip:text;background-clip:text;color:transparent}
:focus-visible{outline:3px solid var(--bb);outline-offset:3px;border-radius:8px}
.skip{position:absolute;left:-999px;top:12px;z-index:99;background:#fff;color:var(--ink);padding:10px 14px;border-radius:10px;min-height:44px}
.skip:focus{left:12px}
main:focus{outline:0}

/* header (A8). The sub-menu rules are scoped to the menu, so that a ".sub" line in a page stays visible. */
.hd{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #E8EEF6;transition:transform .3s}
/* Signed in, WordPress's own bar is fixed at the top: the header stops under it (work order 56). Below 601 px that bar
   scrolls away with the page, so the header goes back to the top. No change for a visitor (no class admin-bar). */
.admin-bar .hd{top:32px}
@media screen and (max-width:782px){.admin-bar .hd{top:46px}}
@media screen and (max-width:600px){.admin-bar .hd{top:0}}
.hd.away{transform:translateY(-100%)}
.hd>.w{display:flex;align-items:center;justify-content:space-between;height:var(--hd);gap:18px}
.logo{display:flex;align-items:center;min-height:44px;flex:none}
.logo img{height:42px;width:auto}
.logo-text{font:800 20px var(--disp);color:var(--ink)}
.nav{flex:1;display:flex;justify-content:center}
.m{display:flex;gap:6px;list-style:none;margin:0;padding:0;align-items:center}
.m>li{position:relative}
.m a,.sub-t{display:flex;align-items:center;min-height:44px;padding:0 10px;color:var(--ink);font:600 15px var(--body);text-decoration:none;background:none;border:0;cursor:pointer;border-radius:10px}
.m a:hover,.m a:focus-visible,.sub-t:hover,.sub-t:focus-visible,.m a[aria-current]{color:var(--deep)}
.sub-t::after{content:"";width:7px;height:7px;margin-left:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.m .sub{position:absolute;top:100%;left:0;min-width:270px;max-width:none;list-style:none;margin:0;padding:8px;color:var(--ink);background:#fff;border:1px solid #E8EEF6;border-radius:18px;box-shadow:0 24px 50px -20px rgba(15,34,51,.35);visibility:hidden;opacity:0;transform:translateY(6px);transition:opacity .2s,transform .2s,visibility .2s}
.m .sub a{padding:0 12px;border-radius:12px;font-weight:600;white-space:nowrap}
.m .sub a:hover,.m .sub a:focus-visible{background:var(--wash)}
.m .has-sub:hover>.sub,.m .has-sub:focus-within>.sub,.m .has-sub.open>.sub{visibility:visible;opacity:1;transform:none}
.m .has-sub.shut>.sub{visibility:hidden;opacity:0}
.soon{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:var(--sun);color:var(--ink);font:800 10.5px var(--body);letter-spacing:.06em;text-transform:uppercase;vertical-align:middle}
.acts{display:flex;align-items:center;gap:8px;flex:none}
.lk{display:flex;align-items:center;min-height:44px;padding:0 8px;color:var(--ink);font-weight:600;font-size:14.5px;text-decoration:none}
.lk:hover,.lk:focus-visible{color:var(--deep)}
.mbtn,.mnav{display:none}
/* the language switcher (work order 45): only when a page exists in more than one language */
.langs{display:flex;gap:2px;list-style:none;margin:0 6px 0 0;padding:0}
.langs a{display:flex;align-items:center;min-height:44px;padding:0 8px;border-radius:10px;color:var(--ink);font:600 14px var(--body);text-decoration:none}
.langs a:hover,.langs a:focus-visible{color:var(--deep)}
.langs a[aria-current]{color:var(--deep);text-decoration:underline;text-underline-offset:4px}

/* buttons (A5) */
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:14px 26px;border:0;border-radius:16px;font:700 16px var(--body);color:#fff;text-decoration:none;cursor:pointer;background:linear-gradient(120deg,var(--ba),var(--bb));box-shadow:0 12px 28px -10px var(--a),inset 0 1px 0 rgba(255,255,255,.45);transition:transform .25s,box-shadow .25s}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%);transform:translateX(-120%);transition:transform .7s}
.btn:hover,.btn:focus-visible{transform:translateY(-3px);box-shadow:0 20px 36px -10px var(--a),inset 0 1px 0 rgba(255,255,255,.45)}
.btn:hover::after,.btn:focus-visible::after{transform:translateX(120%)}
.btn.ghost{color:var(--ink);background:linear-gradient(#F6FAFF,#F6FAFF) padding-box,linear-gradient(120deg,var(--a),var(--b)) border-box;border:2px solid transparent;box-shadow:none}
.btn.ghost:hover,.btn.ghost:focus-visible{box-shadow:0 14px 28px -14px var(--a)}
.btn.white{background:#fff;color:var(--ink);box-shadow:0 14px 30px -12px rgba(0,0,0,.45)}
.btn-s{min-height:44px;padding:10px 18px;font-size:14px}
.more{display:flex;align-items:center;justify-content:center;min-height:44px;text-align:center;margin-top:4px;font-size:14.5px}

/* cards (A6) */
.card{display:flex;flex-direction:column;background:var(--glass);border:1px solid #fff;border-radius:22px;overflow:hidden;box-shadow:0 18px 44px -30px var(--b);transition:transform .3s,box-shadow .3s}
.card:hover,.card:focus-within{transform:translateY(-6px);box-shadow:0 30px 54px -28px var(--b)}

/* folds (A9.3, A14.2): open from the middle layout up, closed on a phone */
details.fold>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:14px;min-height:48px;font-weight:700}
details.fold>summary::-webkit-details-marker,details.mf>summary::-webkit-details-marker{display:none}
details.fold>summary::after,details.mf>summary::after{content:"+";font:400 24px var(--disp)}
details[open]>summary::after{content:"\2212"}

/* page content (work order 29, A). The content area spans the full width. Ordinary text keeps its
   readable column inside the 1200 px wrapper, placed from the content area itself, never from the
   screen. A block of the plugin, Beaver Builder content and anything marked full width take the
   whole width by themselves. */
.content{padding-top:56px;padding-bottom:76px}
.entry-head{padding-top:56px}
.entry-body{padding-bottom:76px}
.entry-body>*{margin-left:max(var(--gut),calc((100% - var(--wrap))/2 + var(--gut)));margin-right:var(--gut);max-width:62ch}
.entry-body>.fkit,.entry-body>.full,.entry-body>.alignfull,.entry-body>.fl-builder-content{margin-left:0;margin-right:0;max-width:none}
.entry-body>table,.entry-body>pre{display:block;overflow-x:auto}
.entry-body>*+h2{margin-top:40px}
.entry-body ul,.entry-body ol{padding-left:22px;margin-top:0;margin-bottom:18px}
.entry-body li{margin-bottom:6px}
.entry-body .btn{margin-top:6px;margin-bottom:6px;margin-right:10px}
.entry-body img{border-radius:22px}
.meta{color:var(--mute);font-size:14.5px}
.post-list{list-style:none;padding:0}
.post-list li{padding:10px 0;border-bottom:1px solid #E8EEF6}

/* footer */
.ft{background:var(--ink);color:var(--foot-text);font-size:15px;padding:56px 0 30px}
.ft a{color:#fff;font-weight:600;text-decoration:none}
.ft a:hover,.ft a:focus-visible{text-decoration:underline}
.fam{margin:0 0 44px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.14)}
.fam-l{margin:0 0 8px;font:700 12.5px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--fam-l,var(--a))}
.fam-h{margin:0 0 20px;color:#fff;font-size:clamp(24px,2.6vw,32px)}
.fam-c{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;list-style:none;margin:0;padding:0}
.fam-c li{display:flex;min-width:0}
.fs{flex:1;display:flex;flex-direction:column;gap:6px;min-height:44px;padding:20px 22px;border-radius:22px;border:1px solid rgba(255,255,255,.16);background:color-mix(in srgb,var(--ink),#fff 6%);color:var(--foot-text);text-decoration:none;transition:transform .3s,box-shadow .3s}
a.fs:hover,a.fs:focus-visible{transform:translateY(-6px);border-color:transparent;background:linear-gradient(color-mix(in srgb,var(--ink),#fff 6%),color-mix(in srgb,var(--ink),#fff 6%)) padding-box,linear-gradient(120deg,var(--a),var(--b)) border-box;box-shadow:0 26px 50px -28px var(--a);text-decoration:none}
.fs b{color:#fff;font:700 20px var(--disp);letter-spacing:-.01em}
.fs span{font-size:15px;color:var(--foot-text);font-weight:500}
.fs em{margin-top:auto;padding-top:8px;font-style:normal;font-weight:700;font-size:14.5px;color:#fff}
.fs-ar{display:inline-block;transition:transform .25s}
a.fs:hover .fs-ar,a.fs:focus-visible .fs-ar{transform:translateX(5px)}
.fs-soon{display:inline-block;margin-left:8px;padding:2px 9px;border-radius:999px;background:var(--sun);color:var(--ink);font:800 10.5px var(--body);letter-spacing:.06em;text-transform:uppercase;vertical-align:middle}
.ft-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.ft-col>summary{color:#fff;font:700 15px var(--body);letter-spacing:.1em;text-transform:uppercase;min-height:44px;pointer-events:none}
.ft-col>summary::after{display:none}
.ft-col ul{list-style:none;margin:0;padding:0}
.ft-col li a{display:inline-flex;align-items:center;min-height:44px}
.ft-base{display:grid;grid-template-columns:auto 1fr auto;gap:20px 28px;align-items:center;margin-top:36px;padding-top:28px;border-top:1px solid rgba(255,255,255,.14)}
.ft-logo{display:inline-flex;background:#fff;border-radius:14px;padding:6px 10px;min-height:44px;align-items:center}
.ft-logo img{height:36px;width:auto}
.ft-town{margin:0}
.ft-soc{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.ft-soc a{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.35);font-size:13px;font-weight:800}
.ft-soc a:hover,.ft-soc a:focus-visible{background:rgba(255,255,255,.1);text-decoration:none}
.ft-pay{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ft-pay-l{font-weight:700;color:#fff;margin-right:4px}
.ft-pay-m{padding:4px 10px;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:13px;font-weight:700;color:#fff}
.ft-copy{grid-column:1/-1;margin:0;font-size:13.5px}
.ft-legal{grid-column:1/-1;margin:0;font-size:13px;max-width:none}

/* narrow and middle (up to 1100 px): the menu stays one button until the full menu fits (A14.2) */
@media (max-width:1100px){
.nav,.acts{display:none}
.mbtn{display:flex;align-items:center;gap:8px;min-width:44px;min-height:44px;padding:0 12px;border:1px solid #E3EAF4;border-radius:14px;background:#fff;color:var(--ink);font:700 14.5px var(--body);cursor:pointer}
.bars,.bars::before,.bars::after{display:block;width:18px;height:2px;background:currentColor;border-radius:2px;position:relative}
.bars::before,.bars::after{content:"";position:absolute;left:0}
.bars::before{top:-6px}.bars::after{top:6px}
.mbtn[aria-expanded="true"] .bars{background:transparent}
.mbtn[aria-expanded="true"] .bars::before{top:0;transform:rotate(45deg)}
.mbtn[aria-expanded="true"] .bars::after{top:0;transform:rotate(-45deg)}
.mnav:not([hidden]){display:block;border-top:1px solid #E8EEF6;background:#fff;max-height:calc(100vh - var(--hd));max-height:calc(100dvh - var(--hd));overflow-y:auto;overscroll-behavior:contain}
.mnav .w{display:flex;flex-direction:column;padding-top:8px;padding-bottom:18px}
.mnav a{display:flex;align-items:center;min-height:48px;color:var(--ink);font-weight:600;text-decoration:none;border-bottom:1px solid #F0F4F9}
.mnav .btn{color:#fff;justify-content:center;margin:16px 0 8px;border:0}
.mf>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;min-height:48px;font-weight:700;cursor:pointer;border-bottom:1px solid #F0F4F9}
.mf>div{display:flex;flex-direction:column;padding-left:14px}
.mnav-acts{display:flex;gap:18px}
.mnav-acts a{border:0}
.fam-c{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.ft-cols{grid-template-columns:repeat(2,1fr)}
.ft-base{grid-template-columns:auto 1fr}
.ft-soc{grid-column:1/-1}
}

/* narrow (up to 599 px): the phone layout (A9) */
@media (max-width:599px){
:root{--gut:16px;--hd:56px}
body{font-size:16px}
.logo img{height:36px}
h1{font-size:33px}
.content{padding-top:32px;padding-bottom:40px}
.entry-head{padding-top:32px}
.entry-body{padding-bottom:40px}
.ft{padding:36px 0 26px}
.fam{margin-bottom:28px;padding-bottom:28px}
.fam-c{grid-template-columns:1fr;gap:12px}
.ft-cols{grid-template-columns:1fr;gap:0}
.ft-col{border-bottom:1px solid rgba(255,255,255,.14)}
.ft-col>summary{pointer-events:auto;min-height:52px}
.ft-col>summary::after{display:block;color:#fff}
.ft-col ul{padding-bottom:10px}
.ft-base{grid-template-columns:1fr;gap:16px}
.ft-logo{justify-self:start}
}

/* short screens (A14.8): under 600 px tall the top bar takes at most a tenth of the height, and the open menu scrolls inside itself */
@media (max-height:599px){
:root{--hd:max(44px,min(56px,10vh))}
.logo img{height:min(36px,calc(var(--hd) - 8px))}
}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.btn::after{display:none}}
/* Work order 51, part A.3: the announcement line (printed above the header by work order 50 on every page shown in this
   theme), from home-new's trial block, word for word: from the page's darker first colour to its darker second
   colour, white bold text, centred, an arrow after the link, a round close button; on a phone smaller and left aligned. */
.ann{background:linear-gradient(90deg,var(--ba),var(--bb));color:#fff;font:700 14px/1.35 var(--body)}
.ann[hidden]{display:none}
.ann .w{position:relative;display:flex;align-items:center;justify-content:center;min-height:42px;padding:7px 56px}
.ann p{margin:0;text-align:center}
.ann a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.ann a::after{content:" \2192"}
.ann a:hover,.ann a:focus-visible{text-decoration-thickness:2px}
.ann-x{position:absolute;right:16px;top:50%;transform:translateY(-50%);width:30px;height:30px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:transparent;color:#fff;font-size:18px;line-height:1;cursor:pointer;padding:0}
.ann-x:hover,.ann-x:focus-visible{background:rgba(255,255,255,.18)}
@media(max-width:719px){.ann{font-size:13px}.ann .w{justify-content:flex-start;padding:8px 56px 8px 16px}.ann p{text-align:left}}
/* Work order 54: the booking calendar in a panel (foundation.js): a centred panel on a computer, a sheet that rises from
   the bottom on a phone, over a dimmed page; its colours from the page's range. */
html.bk-open{overflow:hidden}
.bk{width:min(640px,calc(100% - 32px));max-width:min(640px,calc(100% - 32px));max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);padding:0;border:0;border-radius:24px;background:#fff;color:var(--ink);box-shadow:0 30px 80px -30px rgba(15,34,51,.55);overflow:auto}
.bk::backdrop{background:rgba(15,34,51,.55)}
.bk-in{position:relative;padding:28px 26px 22px}
.bk h2{font:800 clamp(22px,3vw,28px)/1.15 var(--disp);margin:0 48px 8px 0;color:var(--ink)}
.bk-l{margin:0 0 16px;color:var(--mute);font-size:16px;line-height:1.5}
.bk-cal{min-height:360px;border-radius:16px;background:linear-gradient(135deg,var(--tint-from,#DDF4F8),var(--tint-to,#E1E6FF));overflow:hidden}
.bk-f{margin:12px 0 0;font-size:13.5px;line-height:1.45;color:var(--mute);text-align:center}
.bk-f a{color:var(--deep);font-weight:700}
.bk-x{position:absolute;top:14px;right:14px;width:40px;height:40px;display:grid;place-items:center;padding:0;border-radius:50%;border:1px solid #D5DFEC;background:#fff;color:var(--ink);font-size:22px;line-height:1;cursor:pointer}
.bk-x:hover{border-color:var(--ba);color:var(--ba)}.bk-x:focus-visible{outline:3px solid var(--ba);outline-offset:2px}
@keyframes bk-up{from{transform:translateY(100%)}}
@media(max-width:719px){.bk{width:100%;max-width:100%;margin:auto 0 0;border-radius:22px 22px 0 0;max-height:92vh;max-height:92dvh}.bk[open]{animation:bk-up .3s ease-out}.bk-in{padding:24px 16px 18px}.bk-cal{min-height:420px}}
@media(prefers-reduced-motion:reduce){.bk[open]{animation:none}}
/* Work order 62: a picture element adds no box of its own, so every rule written for an image inside its frame still applies. */
picture{display:contents}
/* Email collection (work order 75): the sign-up forms. The trap field is out of sight and out of reach. */
.vl-trap{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.vsu{margin:14px 0 0}.vsu-h{font:700 15px var(--body);margin:0 0 8px}
.vsu-l{display:block;font:600 13.5px var(--body);margin:8px 0 4px}
.vsu-i{width:100%;max-width:340px;min-height:44px;padding:8px 12px;border:1.5px solid #DCE6F0;border-radius:12px;font:16px var(--body);background:#fff;color:var(--ink)}
.vsu-who{display:flex;flex-wrap:wrap;gap:6px 16px;margin:10px 0 6px}.vsu-who label{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14.5px}
.vsu-c{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.45;margin:6px 0 12px}.vsu-c input{margin-top:3px;flex:none}
.vsu input[type=checkbox]{width:20px;height:20px}
.vsu-b{min-height:44px;padding:10px 20px;font-size:15px}
.vsu-f{display:block;font-size:12.5px;opacity:.85;margin:10px 0 0}
.vsu-er{color:#B3261E;font-size:13.5px;margin:4px 0}
.vsu-ok{font-weight:700;margin:10px 0 0}
.ft .vsu{max-width:360px}.ft .vsu-h,.ft .vsu-l,.ft .vsu-who,.ft .vsu-c,.ft .vsu-f,.ft .vsu-ok{color:var(--foot-text,#C9D6E4)}.ft .vsu-f a{color:#fff}.ft .vsu-er{color:#FFB4AB}
.vsu-page .vsu-card{max-width:640px;margin:20px auto;background:#fff;border:1px solid #EEF2F7;border-radius:22px;padding:28px;box-shadow:0 18px 44px -34px var(--b)}
.ck-who{margin:8px 0 0}
/* Work order 76: a sign-up form that is hidden after sending stays hidden, whatever a page kind's own rule for forms
   says; the footer's sign-up, out of the fold, one column wide (two columns' grid: one of two; a phone: full width);
   the news box's two choices with the checkout's own tick box. */
.vsu-form[hidden]{display:none!important}
/* The footer's sign-up as one wide band under the four columns (work order 89, decision 181): a column on a phone;
   from 701px two parts, the words on the left (38 per cent), the form on the right in three rows: the field with the
   two choices, the consent box with the button, the fine print with the counter's link. The form's markup is
   unchanged: its wrapper and the form give their parts to the band's grid (display:contents). */
.ft-su{margin-top:28px;padding:26px 0 0;border-top:1px solid rgba(255,255,255,.14)}
.ft-su .vsu{margin:0;max-width:none}
.ft .ft-su .vsu-h{margin:0 0 8px;font:700 20px var(--disp);letter-spacing:-.01em;color:#fff}
.ft .ft-su .vsu-n{margin:0 0 6px;font-size:14px;color:var(--foot-text,#C9D6E4)}
.ft .ft-su .vsu-n+.vsu-n{color:var(--fam-l,var(--a));font-weight:600}
.ft-su .vsu-l{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.ft-su .vsu-i{max-width:none;min-height:48px;margin:12px 0 0}
.ft .ft-su .vsu-who label{color:#fff}
.ft-su .vsu-b{width:100%;min-height:48px}
.ft .ft-su .vsu-f,.ft-su .vl-nc-l{font-size:12.5px;color:var(--foot-text,#C9D6E4);opacity:1}
.ft-su .vl-nc{display:inline-flex;align-items:center;min-height:44px}
/* Work order 90: the fine print and the counter's link on one line when both fit, else the link under it; the dot
   sits in the link's left margin, which is clipped when the link starts a line. */
.ft-su .vsu-f{overflow:hidden}
.ft-su .vsu-fr{display:flex;flex-wrap:wrap;align-items:baseline;row-gap:2px;margin-left:-1.2em}
.ft-su .vsu-ft,.ft-su .vsu-fr>.vl-nc-l{margin:0 0 0 1.2em}
.ft-su .vsu-fr>.vl-nc-l{position:relative;white-space:nowrap}
.ft-su .vsu-fr>.vl-nc-l::before{content:"\00B7";position:absolute;left:-.8em}
@media (min-width:701px){
.ft-su{display:grid;grid-template-columns:38% minmax(0,1fr) auto;column-gap:12px;align-items:center}
.ft-su .vsu,.ft-su .vsu-form{display:contents}
.ft-su .vsu-h{grid-column:1;grid-row:1;margin:0 16px 0 0}
.ft .ft-su .vsu-h+.vsu-n{grid-column:1;grid-row:4;margin:12px 16px 0 0}
.ft .ft-su .vsu-n+.vsu-n{grid-column:1;grid-row:6;margin:12px 16px 0 0}
.ft-su .vsu-i{grid-column:2;grid-row:1;width:100%;margin:0}
.ft-su .vsu-who{grid-column:3;grid-row:1;flex-wrap:nowrap;white-space:nowrap;margin:0}
.ft-su .vsu-er[data-for=email]{grid-column:2/4;grid-row:2;margin:6px 0 0}
.ft-su .vsu-er[data-for=who]{grid-column:2/4;grid-row:3;margin:6px 0 0}
.ft-su .vsu-c{grid-column:2;grid-row:4;margin:12px 0 0}
.ft-su .vsu-b{grid-column:3;grid-row:4;width:auto;margin:12px 0 0;justify-self:stretch}
.ft-su .vsu-er[role=alert]{grid-column:2/4;grid-row:5;margin:6px 0 0}
.ft-su .vsu-f{grid-column:2/4;grid-row:6;margin:12px 0 0}
.ft-su .vsu-ok{grid-column:2/4;grid-row:1;margin:0}
.ft-su .vl-nc{min-height:0}
}
.ck-who label{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-weight:500;cursor:pointer}
.ck-who .cb{width:22px;height:22px;margin:0;accent-color:var(--ba);cursor:pointer;flex:none}
/* Work order 79: the footer's "Do not count my visits", small, under the sign-up's fine print. */
.vl-nc-l{margin:12px 0 0;font-size:12.5px}.ft .vl-nc{color:var(--foot-text,#C9D6E4);text-decoration:underline}
.fl-heard{border:0;padding:0;margin:14px 0}.fl-heard legend{font-weight:700;margin:0 0 6px}.fl-heard select,.fl-heard input{display:block;width:100%;max-width:420px;min-height:44px;border:1.5px solid #DCE6F0;border-radius:12px;padding:8px 12px;margin:0 0 8px;font:16px var(--body);background:#fff}
/* Work order 77: the line under a sign-up form's heading; the confirmed page's buttons; the preference page. */
.vsu-n{margin:0 0 6px;font-size:14px}
.ft .vsu-n{color:var(--foot-text,#C9D6E4)}
.vsu-go{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.vsu-prefs hr{border:0;border-top:1px solid #EEF2F7;margin:22px 0}
.vsu-pform[hidden],.vsu-prefs [hidden]{display:none!important}
/* Work order 95: the cookie page's table (written by the plugin): scrolls sideways on a phone rather than squeezing. */
.cp-wrap{overflow-x:auto;margin:16px 0 24px;-webkit-overflow-scrolling:touch}
.cp-tab{border-collapse:collapse;width:100%;min-width:640px;font-size:14px;line-height:1.45}
.cp-tab th,.cp-tab td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--line,#DCE6F0)}
.cp-tab thead th{background:var(--wash,#EEFBFD);font-weight:700}
.cp-tab .cp-g th{padding-top:18px;font:700 15px var(--disp);color:var(--ink,#0F2233);border-bottom:2px solid var(--line,#DCE6F0)}
.cp-tab code{font-size:13px;white-space:nowrap}
/* Work order 97, the instant feel: a soft cross-fade between pages of the site (view transitions; a browser without
   them simply changes page), 150 ms, none for visitors who ask for less motion. */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:150ms}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}
/* Work order 97: the plain line for a form sent from a page opened more than two days before. */
.vl-old{margin:10px 0;padding:10px 12px;border-radius:12px;background:#FFF4E5;color:#6B3A00;font-size:14px;line-height:1.45}
.vl-old a{color:inherit;font-weight:700;text-decoration:underline}
/* Work order 114: the trail under the header (Shop, the range, the category, the page). One line; on a phone it scrolls
   sideways and never wraps. Each link 44 px high by its padding. */
.trail{background:#fff;border-bottom:1px solid #E8EEF6}
.trail .tr-x{overflow-x:auto;scrollbar-width:none}
.trail ol{display:flex;align-items:center;list-style:none;margin:0;padding:0;white-space:nowrap}
.trail li{display:flex;align-items:center;flex:none;margin:0}
.trail a,.trail .tr-c{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;font-size:14px;font-weight:600;color:var(--mute);text-decoration:none}
.trail .tr-c{color:var(--ink)}
.trail a:hover,.trail a:focus-visible{color:var(--deep);text-decoration:underline}
.trail .tr-s{padding:0 4px;font-size:14px;color:var(--mute)}
/* Work order 123, D: the footer's three family cards never leave one alone. From 600 to 819 px they are two columns
   and the third card takes the whole second row; from 820 to 1100 px, three columns (three 240 px cards fit); under
   600 px, one column as before. */
@media (min-width:600px) and (max-width:819px){.fam-c{grid-template-columns:repeat(2,minmax(0,1fr))}.fam-c>li:nth-child(2n+1):last-child{grid-column:1 / -1}}
@media (min-width:820px) and (max-width:1100px){.fam-c{grid-template-columns:repeat(3,minmax(0,1fr))}}