@font-face{font-family:'Figtree';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/figtree-latin-400-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}@font-face{font-family:'Figtree';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/figtree-latin-ext-400-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:'Figtree';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/figtree-latin-700-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}@font-face{font-family:'Figtree';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/figtree-latin-ext-700-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}.fls {
    --page: #0f1115; --text: #e8eaed; --muted: #8b929e; --line: #2a2f3a;
    --accent: #7dd3fc; --on-accent: #111111; --soft: #171a21;
    --card: #20242d;
    --heading-font: Figtree, Arial, Helvetica, sans-serif; --body-font: Figtree, Arial, Helvetica, sans-serif;
    --heading-weight: 700; --heading-track: 0;
    --size: 17px; --width: 1120px; --gap: 48px; --pad: 24px;
    --radius: 10px; --card-radius: 12px;
    container-type: inline-size;
    margin: 0; background: var(--page); color: var(--text);
    font-family: var(--body-font); font-size: var(--size); line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}
.fls *, .fls *::before, .fls *::after { box-sizing: border-box; }

/* Sections: one per top-level block, colored by its band. */
.fls .fl-sec {
    --bg: var(--page); --fg: var(--text); --hd: var(--text); --link: var(--accent); --mut: var(--muted); --ln: var(--line);
    --btn: var(--accent); --btn-text: var(--on-accent);
    background: var(--bg); color: var(--fg);
    padding: calc(var(--gap) / 2) 24px;
}
.fls .fl-soft { --bg: var(--soft); }
.fls .fl-brand {
    --bg: #7dd3fc; --fg: #111111; --hd: #111111; --link: #111111;
    --mut: #111111; --ln: #111111; --btn: #111111; --btn-text: #7dd3fc;
}
.fls .fl-edge-top { padding-top: calc(var(--gap) / 2 + 40px); }
.fls .fl-edge-bottom { padding-bottom: calc(var(--gap) / 2 + 40px); }
.fls .fl-first { padding-top: calc(var(--gap) / 2 + 24px); }
.fls .fl-last { padding-bottom: calc(var(--gap) / 2 + 24px); }
.fls .fl-wrap { max-width: var(--width); margin: 0 auto; }
.fls .fl-center { text-align: center; }
.fls .fl-readable { max-width: 44rem; }
.fls .fl-center.fl-readable, .fls .fl-center .fl-readable { margin-left: auto; margin-right: auto; }

/* Text */
.fls .fl-h { margin: 0; font-family: var(--heading-font); font-weight: var(--heading-weight); letter-spacing: var(--heading-track); color: var(--hd); text-wrap: balance; }
.fls .fl-h-normal { font-size: 1.6em; line-height: 1.25; }
.fls .fl-h-large { font-size: 2.4em; line-height: 1.12; }
.fls .fl-h-huge { font-size: 3.6em; line-height: 1.04; }
.fls .fl-text p, .fls .fl-text ul, .fls .fl-text ol { margin: 0 0 1em; }
.fls .fl-text > :last-child { margin-bottom: 0; }
.fls .fl-text ul { list-style: disc; padding-left: 1.4em; }
.fls .fl-text ol { list-style: decimal; padding-left: 1.4em; }
.fls .fl-text li { margin: 0 0 .4em; }
.fls a { color: var(--link); }
.fls .fl-lead { font-size: 1.2em; color: var(--fg); }

/* Buttons: the look's shape (filled, pill, or a plain link for Letter). */
.fls .fl-btn {
    display: inline-block; padding: 14px 28px; border: 0; border-radius: var(--radius);
    background: var(--btn); color: var(--btn-text); font: inherit; font-weight: 700; line-height: 1.2;
    text-decoration: none; cursor: pointer;
}
.fls .fl-btn:hover { filter: brightness(1.08); }
.fls .fl-actions { margin-top: 28px; }

/* Pictures: in every size (srcset), over their thumbnail as a blurred placeholder until they arrive (--blur). */
.fls .fl-img { display: block; height: auto; max-width: 100%; border-radius: var(--card-radius); }
.fls .fl-img[style*="--blur"] { background: var(--blur) center / cover no-repeat; }
.fls .fl-img-left { margin-right: auto; }
.fls .fl-img-center { margin-left: auto; margin-right: auto; }
.fls .fl-img-right { margin-left: auto; }
.fls .fl-pick {
    cursor: pointer; padding: 48px 16px; border: 2px dashed var(--ln); border-radius: var(--card-radius);
    color: var(--mut); font-size: 14px; text-align: center;
}
.fls .fl-pick-slim { padding: 10px 16px; }

.fls .fl-hr { border: 0; border-top: 1px solid var(--ln); margin: 0; }
.fls .fl-space-small { height: 16px; }
.fls .fl-space-large { height: 64px; }

/* Columns: equal widths, a card per column when the look has a card color. */
.fls .fl-cols { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: var(--gap); }
.fls .fl-col { display: flex; flex-direction: column; gap: calc(var(--gap) / 2); min-width: 0; padding: var(--pad); }
.fls .fl-col {
    --bg: var(--card); --fg: var(--text); --hd: var(--text); --link: var(--accent); --mut: var(--muted); --ln: var(--line);
    --btn: var(--accent); --btn-text: var(--on-accent);
    background: var(--bg); color: var(--fg); border-radius: var(--card-radius);
}

/* Hero */
.fls .fl-hero { display: grid; gap: 40px; align-items: center; }
.fls .fl-hero-centered { text-align: center; justify-items: center; }
.fls .fl-hero-centered .fl-hero-text { max-width: 48rem; }
.fls .fl-hero-split { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
.fls .fl-hero .fl-text { margin-top: 20px; }
.fls .fl-cover {
    --fg: #ffffff; --hd: #ffffff; --link: #ffffff; --mut: #e5e7eb;
    background: linear-gradient(rgb(0 0 0 / .5), rgb(0 0 0 / .5)), var(--cover) center / cover no-repeat,
        var(--cover-thumb, none) center / cover no-repeat, #111;
    padding-top: calc(var(--gap) + 96px); padding-bottom: calc(var(--gap) + 96px);
}
.fls .fl-cover .fl-hero { text-align: center; justify-items: center; }

/* Quote */
.fls .fl-quote { margin: 0 auto; max-width: 44rem; text-align: center; }
.fls .fl-quote blockquote { margin: 0; font-family: var(--heading-font); font-size: 1.5em; line-height: 1.35; color: var(--hd); }
.fls .fl-quote figcaption { margin-top: 16px; color: var(--mut); }

/* Question and answer */
.fls .fl-faq { max-width: 44rem; margin: 0 auto; border-bottom: 1px solid var(--ln); padding: 4px 0 18px; }
.fls .fl-faq summary, .fls .fl-faq .fl-q {
    display: flex; justify-content: space-between; gap: 16px; cursor: pointer; list-style: none;
    font-family: var(--heading-font); font-weight: var(--heading-weight); font-size: 1.15em; color: var(--hd);
}
.fls .fl-faq summary::-webkit-details-marker { display: none; }
.fls .fl-faq summary::after { content: "+"; color: var(--mut); }
.fls .fl-faq[open] summary::after { content: "\2013"; }
.fls .fl-faq .fl-text { margin-top: 10px; }

/* Signup forms (fields from templates/embed/_field.php) */
.fls .fl-signup { max-width: 30rem; }
.fls .fl-signup.fl-center { margin: 0 auto; text-align: left; }
.fls .ecf-form { display: grid; gap: 14px; }
.fls .ecf-title { margin: 0; font-family: var(--heading-font); font-weight: var(--heading-weight); font-size: 1.5em; color: var(--hd); }
.fls .ecf-intro, .fls .ecf-consent { margin: 0; color: var(--mut); }
.fls .ecf-consent { font-size: .85em; }
.fls .ecf-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 12px; }
.fls .ecf-field { display: grid; gap: 6px; }
.fls .ecf-label { font-size: .9em; font-weight: 600; }
.fls .ecf-req { color: var(--mut); }
.fls .ecf-input {
    width: 100%; padding: 12px 14px; border: 1px solid var(--ln); border-radius: min(var(--radius), 12px);
    background: #0f1115; color: #e8eaed; font: inherit;
}
.fls .ecf-textarea { resize: vertical; min-height: 8rem; }
.fls .ecf-check { display: flex; gap: 10px; align-items: flex-start; font-size: .95em; }
.fls .ecf-check input { margin-top: .3em; }
.fls .ecf-hp { position: absolute; left: -9999px; }
/* Booking blocks (builder/web/booking.php, booking.js). */
.fls .fl-booking { display: grid; gap: 20px; }
.fls .fl-bk-services { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.fls .fl-bk-services[hidden] { display: none; }
.fls .fl-bk-service {
    display: grid; gap: 4px; padding: 16px 18px; text-align: left; font: inherit; color: var(--fg); cursor: pointer;
    background: transparent; border: 1px solid var(--ln); border-radius: min(var(--card-radius), 16px);
}
.fls .fl-bk-service:hover { border-color: var(--link); }
.fls .fl-bk-service[aria-pressed="true"] { border-color: var(--link); box-shadow: inset 0 0 0 1px var(--link); }
.fls .fl-bk-name { font-weight: 700; }
.fls .fl-bk-meta, .fls .fl-bk-desc, .fls .fl-bk-note { color: var(--mut); font-size: .92em; }
.fls .fl-bk-desc { white-space: pre-line; }
.fls .fl-bk-panel { display: grid; gap: 16px; }
.fls .fl-bk-panel[hidden] { display: none; }
.fls .fl-bk-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.fls .fl-bk-title { font-weight: 700; }
.fls .fl-bk-tz { margin-left: .75em; font-weight: 400; font-size: .85em; color: var(--mut); }
.fls .fl-bk-days { display: flex; flex-wrap: wrap; gap: 8px; }
.fls .fl-bk-daybtn {
    padding: 8px 12px; font: inherit; color: var(--fg); cursor: pointer; background: transparent;
    border: 1px solid var(--ln); border-radius: min(var(--radius), 10px);
}
.fls .fl-bk-daybtn:hover { border-color: var(--link); }
.fls .fl-bk-daybtn[aria-pressed="true"] { border-color: var(--link); box-shadow: inset 0 0 0 1px var(--link); font-weight: 600; }
.fls .fl-bk-nav, .fls .fl-bk-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.fls .fl-bk-step { padding: 6px 2px; font: inherit; color: var(--link); background: none; border: 0; cursor: pointer; }
.fls .fl-bk-day { display: grid; gap: 8px; }
.fls .fl-bk-date { font-weight: 600; }
.fls .fl-bk-times { display: flex; flex-wrap: wrap; gap: 8px; }
.fls .fl-bk-time {
    min-width: 5.5em; padding: 8px 12px; font: inherit; font-variant-numeric: tabular-nums; color: var(--fg); cursor: pointer;
    background: transparent; border: 1px solid var(--ln); border-radius: min(var(--radius), 10px);
}
.fls .fl-bk-time:hover { border-color: var(--link); color: var(--link); }
.fls .fl-bk-form { display: grid; gap: 14px; max-width: 640px; }
.fls .fl-bk-summary { font-weight: 700; }
.fls .fl-bk-error { color: #b91c1c; }
.fls .fl-bk-error[hidden] { display: none; }
.fls .fl-bk-done { padding: 16px 0; font-size: 1.1em; }

/* A contact form sent: the page comes back with #sent-{form} (builder/web/signup.php). */
.fls .fl-sent { display: none; padding: 16px 0; font-size: 1.1em; }
.fls .fl-sent:target { display: block; }
.fls .fl-sent:target + form { display: none; }
.fls .ecf-form .fl-btn { width: 100%; }

/* Latest posts */
.fls .fl-posts { display: grid; gap: var(--gap); }
.fls .fl-posts-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fls .fl-post { display: grid; gap: 8px; align-content: start; color: inherit; text-decoration: none; }
.fls .fl-post .fl-img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.fls .fl-post-title { font-family: var(--heading-font); font-weight: var(--heading-weight); font-size: 1.25em; line-height: 1.25; color: var(--hd); }
.fls .fl-post-date { color: var(--mut); font-size: .85em; }
.fls .fl-posts-list .fl-post { padding-bottom: calc(var(--gap) / 2); border-bottom: 1px solid var(--ln); }
.fls .fl-empty { color: var(--mut); text-align: center; }

/* Header with the menu; narrow screens fold the menu into a <details>. */
.fls .fl-head { padding-top: 20px; padding-bottom: 20px; }
.fls .fl-nav { display: flex; align-items: center; gap: 28px; }
.fls .fl-logo { display: flex; align-items: center; margin-right: auto; color: var(--hd); text-decoration: none;
    font-family: var(--heading-font); font-weight: var(--heading-weight); font-size: 1.25em; letter-spacing: var(--heading-track); }
.fls .fl-logo { gap: 12px; }
.fls .fl-logo img { display: block; height: 40px; width: auto; }
.fls .fl-menu { display: flex; gap: 24px; margin: 0; padding: 0; list-style: none; }
.fls .fl-menu a { color: var(--fg); text-decoration: none; font-weight: 600; }
.fls .fl-menu a:hover { color: var(--link); }
.fls .fl-fold { display: none; position: relative; }
.fls .fl-fold summary { cursor: pointer; list-style: none; font-weight: 600; }
.fls .fl-fold summary::-webkit-details-marker { display: none; }
.fls .fl-fold .fl-menu {
    position: absolute; right: 0; top: calc(100% + 12px); z-index: 10; flex-direction: column; gap: 14px; min-width: 12rem;
    padding: 16px 20px; background: var(--page); border: 1px solid var(--line); border-radius: var(--card-radius);
}

/* Shop (ShopPages, site.js): account and cart icons in the header, product cards and page, cart, checkout.
   html.fl-has-cart is set by the head script before the page shows (from the cart in the browser). */
.fls .fl-icons { display: flex; align-items: center; gap: 14px; }
.fls .fl-icon { position: relative; display: flex; color: var(--fg); }
.fls .fl-icon:hover { color: var(--link); }
.fls .fl-count {
    display: none; position: absolute; top: -6px; right: -9px; min-width: 18px; height: 18px; padding: 0 5px;
    align-items: center; justify-content: center; border-radius: 999px; background: var(--accent); color: var(--on-accent);
    font-size: 11px; font-weight: 700; line-height: 1;
}
.fls .fl-count::after { content: var(--fl-cart, ""); }
.fl-has-cart .fls .fl-count { display: inline-flex; }
.fls .fl-catalog { display: grid; gap: 20px; }
.fls .fl-search { max-width: 28rem; }
.fls .fl-products { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.fls .fl-product-card { display: grid; gap: 12px; align-content: start; }
.fls .fl-product-link { display: grid; gap: 6px; color: inherit; text-decoration: none; }
.fls .fl-product-link .fl-img, .fls .fl-noimg { aspect-ratio: 1; object-fit: cover; width: 100%; }
.fls .fl-noimg { display: block; border-radius: var(--card-radius); background: var(--soft); }
.fls .fl-price { margin: 0; color: var(--mut); font-weight: 600; }
.fls .fl-lead.fl-price { color: var(--fg); }
.fls .fl-add { justify-self: start; padding: 10px 18px; }
.fls .fl-product { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: calc(var(--gap) * 1.5); align-items: start; }
.fls .fl-product-info { display: grid; gap: 16px; }
.fls .fl-product-pic { display: grid; gap: 12px; }
.fls .fl-thumbs { display: flex; flex-wrap: wrap; gap: 8px; }
.fls .fl-thumbs a { display: block; border: 2px solid transparent; border-radius: min(var(--card-radius), 8px); }
.fls .fl-thumbs a[aria-current="true"] { border-color: var(--accent); }
.fls .fl-thumbs img { display: block; width: 64px; height: 64px; object-fit: cover; border-radius: min(var(--card-radius), 6px); }
.fls .fl-brand { margin: 0; color: var(--mut); font-size: .9em; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.fls .fl-specs { display: grid; gap: 6px; margin: 0; }
.fls .fl-specs div { display: flex; gap: 12px; }
.fls .fl-specs dt { min-width: 8rem; color: var(--mut); }
.fls .fl-specs dd { margin: 0; }
.fls .fl-buy { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin-top: 8px; }
.fls .fl-qty { display: grid; gap: 6px; font-size: .9em; font-weight: 600; }
.fls .fl-qty .ecf-input { width: 6rem; }
.fls .fl-lines { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.fls .fl-line { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--ln); }
.fls .fl-line img, .fls .fl-line .fl-noimg { width: 64px; height: 64px; object-fit: cover; border-radius: min(var(--card-radius), 8px); }
.fls .fl-line-name { color: var(--hd); font-weight: 600; text-decoration: none; }
.fls .fl-line-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: var(--mut); font-size: .9em; }
.fls .fl-step { width: 28px; height: 28px; border: 1px solid var(--ln); border-radius: 999px; background: none; color: var(--fg); font: inherit; line-height: 1; cursor: pointer; }
.fls .fl-remove { border: 0; background: none; padding: 0; color: var(--mut); font: inherit; text-decoration: underline; cursor: pointer; }
.fls .fl-total { display: flex; justify-content: space-between; gap: 16px; margin: 16px 0; font-size: 1.1em; }
.fls .fl-cart-foot { display: none; }
.fl-has-cart .fls .fl-cart-foot, .fls .fl-cart-edit .fl-cart-foot { display: block; text-align: right; }
.fl-has-cart .fls .fl-cart-empty { display: none; }
.fls .fl-checkout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: calc(var(--gap) * 1.5); align-items: start; }
.fls .fl-summary { padding: 24px; border-radius: var(--card-radius); background: var(--soft); }
.fls .fl-summary .fl-line { grid-template-columns: 48px minmax(0, 1fr) auto; }
.fls .fl-summary .fl-line img, .fls .fl-summary .fl-line .fl-noimg { width: 48px; height: 48px; }
.fls .fl-msg { margin: 0; color: var(--mut); }
.fls .fl-msg:empty { display: none; }
.fls .fl-signin { max-width: 26rem; }
.fls .fl-toast {
    position: fixed; left: 50%; bottom: 24px; z-index: 50; transform: translateX(-50%); max-width: calc(100% - 32px);
    padding: 12px 18px; border-radius: 12px; background: var(--text); color: var(--page); font-size: .95em; box-shadow: 0 6px 24px rgb(0 0 0 / .2);
}

/* Site layout: page with an optional sidebar (blog), footer. */
.fls .fl-layout { display: grid; grid-template-columns: minmax(0, 1fr) 18rem; gap: var(--gap); max-width: calc(var(--width) + 48px); margin: 0 auto; }
.fls .fl-layout > .fl-side { padding: calc(var(--gap) / 2 + 24px) 24px calc(var(--gap) / 2); display: grid; gap: 20px; align-content: start; }
.fls .fl-side > .fl-sec { padding: 0; }
.fls .fl-side .fl-posts { gap: 16px; }
.fls .fl-side .fl-posts-list .fl-post { padding-bottom: 16px; }
.fls .fl-foot { border-top: 1px solid var(--line); font-size: .9em; }
.fls .fl-article-head { display: grid; gap: 12px; }

@container (max-width: 760px) {
    .fls .fl-cover { --cover: var(--cover-narrow); }
    .fls .fl-cols, .fls .fl-hero-split, .fls .fl-posts-cards, .fls .fl-layout, .fls .fl-product, .fls .fl-checkout { grid-template-columns: minmax(0, 1fr); }
    .fls .fl-products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fls .fl-h-huge { font-size: 2.5em; }
    .fls .fl-h-large { font-size: 1.9em; }
    .fls .fl-wide { display: none; }
    .fls .fl-fold { display: block; }
    .fls .ecf-row { grid-auto-flow: row; }
}