/*
Theme Name: Hagby
Description: Native block theme for Friskvård & Massage Hagby.
Version: 0.2.87
Requires at least: 7.1
Requires PHP: 8.3
Text Domain: hagby
*/
@font-face{font-family:Manrope;src:url('assets/fonts/Manrope-VariableFont_wght.woff2') format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:Literata;src:url('assets/fonts/Literata72pt-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Literata;src:url('assets/fonts/Literata72pt-RegularItalic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}

/* Sizes come from theme.json: one spacing scale, one type scale. */
:root{
  --link-hover-light:var(--wp--preset--color--white);
  --link-hover:color-mix(in srgb,var(--wp--preset--color--forest) 65%,var(--wp--preset--color--leaf));
  --gutter:var(--wp--custom--gutter);
  --wide:var(--wp--style--global--wide-size);
  --measure:42rem;
  --radius:var(--wp--custom--radius--small);
  --control:2.875rem;
  --radius-organic:var(--wp--custom--radius--large);
  --s2:var(--wp--preset--spacing--20);--s3:var(--wp--preset--spacing--30);--s4:var(--wp--preset--spacing--40);
  --s5:var(--wp--preset--spacing--50);--s6:var(--wp--preset--spacing--60);--s7:var(--wp--preset--spacing--70);--s8:var(--wp--preset--spacing--80);
  --fs-xs:var(--wp--preset--font-size--x-small);--fs-s:var(--wp--preset--font-size--small);--fs-m:var(--wp--preset--font-size--medium);
  --fs-l:var(--wp--preset--font-size--large);--fs-xl:var(--wp--preset--font-size--x-large);--fs-2xl:var(--wp--preset--font-size--xx-large);
  --fs-display:var(--wp--preset--font-size--display);--fs-hero:var(--wp--preset--font-size--hero);
}
*{box-sizing:border-box}
body{margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
/* Taps act at once (no double-tap zoom wait); the tap flash is the site's own sage. */
a,button,summary,input[type=submit]{touch-action:manipulation;-webkit-tap-highlight-color:color-mix(in srgb,var(--wp--preset--color--sage) 60%,transparent)}
/* Dates line up as figures. */
.wp-block-post-date,.post-nav,.hero-phone{font-variant-numeric:tabular-nums}
img{max-width:100%;height:auto}
:where(a,button,input,textarea):focus-visible{outline:3px solid var(--wp--preset--color--leaf);outline-offset:4px}
a{text-underline-offset:4px;text-decoration-thickness:1px}
p{max-width:70ch;text-wrap:pretty}
/* Headings never auto-hyphenate: with balanced lines it split words that fit ("Väl-kommen").
   Long treatment names carry soft hyphens at their compound joints instead. */
h1,h2,h3{overflow-wrap:break-word;hyphens:manual;text-wrap:balance}

/* Page bands sit flush; each band owns its own padding. */
.wp-site-blocks>*,main.wp-block-group>*{margin-block:0}
.site-header,.hero,.section,.visit-band,.site-footer,.page-banner,.content-section{padding-inline:var(--gutter)}
.header-inner,.hero-inner,.section-inner,.visit-inner,.footer-inner,.page-banner-inner,.reading-layout{max-width:var(--wide);margin-inline:auto!important}
/* Grid children are placed by the grid, not by block-gap flow margins. */
.hero-inner>*,.about-grid>*,.service-grid>*,.reading-layout>*{margin-block:0!important}

/* Header: compact, brand left, menu and booking together on the right. */
/* It stays in reach while reading; anchors scroll clear of it. */
.wp-site-blocks>header{position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:50}
html{--sticky-top:calc(6rem + var(--wp-admin--admin-bar--height,0px));--chips-height:3.75rem;scroll-padding-top:var(--sticky-top);color-scheme:light;accent-color:var(--wp--preset--color--forest)}
::selection{background:var(--wp--preset--color--sage);color:var(--wp--preset--color--ink)}
.site-header{position:relative;isolation:isolate;border-bottom:1px solid var(--wp--preset--color--line);padding-block:.875rem}
/* Solid paper: page text scrolling beneath must never read through it. The colour sits on a pseudo-element
   so the fixed phone-menu overlay is not trapped inside the header's box. */
.site-header::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--wp--preset--color--paper)}
.header-inner{gap:var(--s5)!important;position:relative}
.header-search+.header-booking{margin-left:calc(var(--s3) - var(--s5))!important}
.brand{gap:var(--s3)!important;flex-shrink:0;align-items:center!important}
.brand figure{margin:0;width:58px;flex-shrink:0}
.brand figure a{display:block}
.brand img{width:58px;height:auto;aspect-ratio:1325/1187;display:block}
.brand p{font-size:1.0625rem;font-weight:650;line-height:1.2;margin:0!important;letter-spacing:-.02em}
.brand p a{text-decoration:none}
.brand p strong{display:block;font-weight:650;font-size:1.5rem;line-height:1.1;letter-spacing:-.03em}
.main-nav{margin-left:auto!important;font-size:var(--fs-s);font-weight:550}
.main-nav .wp-block-navigation__container{gap:.25rem;flex-wrap:nowrap}
.main-nav a{text-decoration:none}
/* Desktop menu: plain text items; a soft button-radius highlight on hover and on the current section. */
.main-nav .wp-block-navigation-item__content{display:block;padding:.5rem .875rem;white-space:nowrap;border-radius:6px;transition:background-color var(--motion-base,260ms) ease}
@media (hover:hover){.main-nav .wp-block-navigation-item__content:hover{background:var(--wp--preset--color--mist)}}
.main-nav .wp-block-navigation-item__content[aria-current=page]{background:var(--wp--preset--color--sage);color:var(--wp--preset--color--forest);font-weight:650}
.nav-treatments{--menu-icon:url('assets/icons/leaf.svg')}
.nav-about{--menu-icon:url('assets/icons/person.svg')}
.nav-blog{--menu-icon:url('assets/icons/heart.svg')}
.nav-contact{--menu-icon:url('assets/icons/contact.svg')}
.nav-gallery{--menu-icon:url('assets/icons/image.svg')}
.nav-references{--menu-icon:url('assets/icons/quote.svg')}
.nav-gift{--menu-icon:url('assets/icons/gift.svg')}
.mobile-booking{--menu-icon:url('assets/icons/bookmark.svg')}
.main-nav .mobile-booking{display:none}
.header-booking{margin:0!important;flex-shrink:0}
.header-booking a{white-space:nowrap;display:inline-flex;align-items:center;height:var(--control);padding-block:0}
.header-booking a::before{content:'';display:inline-block;width:13px;height:14px;background:currentColor;mask:url('assets/icons/bookmark.svg') center/contain no-repeat;-webkit-mask:url('assets/icons/bookmark.svg') center/contain no-repeat;vertical-align:-2px;margin-right:9px}

/* Search: an icon button that opens a field (core search block). */
.header-search{margin:0!important;position:relative;z-index:2;flex-shrink:0}
.header-search .wp-block-search__inside-wrapper{border:0;padding:0;gap:var(--s2);align-items:center}
.header-search.wp-block-search__searchfield-hidden .wp-block-search__inside-wrapper{gap:0}
.header-search .wp-block-search__input{position:absolute;right:calc(var(--control) + var(--s2));top:50%;translate:0 -50%;box-shadow:0 .5rem 1.5rem -1rem rgb(40 74 54 / .5);height:var(--control);border:1px solid var(--wp--preset--color--line);border-radius:999px;padding:0 var(--s3);background:var(--wp--preset--color--white);font:inherit;font-size:var(--fs-s);color:var(--wp--preset--color--ink);width:14rem}
/* The round button and the booking button share one height and edge line. */
.header-search .wp-block-search__button{display:grid;place-items:center;width:var(--control);height:var(--control);padding:0;margin:0;border-radius:50%;background:transparent;color:var(--wp--preset--color--forest);border:1px solid var(--wp--preset--color--line);cursor:pointer}
@media (hover:hover){.header-search .wp-block-search__button:hover{background:var(--wp--preset--color--sage)}}
.header-search .wp-block-search__button svg{width:22px;height:22px;min-width:0;min-height:0;fill:currentColor}
.header-search .wp-block-search__input:focus-visible{outline:2px solid var(--wp--preset--color--leaf);outline-offset:2px}
.page-search .wp-block-search__button svg{width:22px;height:22px;fill:currentColor}
.page-search{margin-top:var(--s5)!important;max-width:32rem}
.page-search .wp-block-search__inside-wrapper{border:1px solid var(--wp--preset--color--line);border-radius:999px;background:var(--wp--preset--color--white);padding:4px 4px 4px var(--s3)}
.page-search .wp-block-search__input{border:0;background:transparent;font:inherit;color:var(--wp--preset--color--ink)}
@supports selector(:has(*)){
  .page-search .wp-block-search__input:focus-visible{outline:0}
  .page-search .wp-block-search__inside-wrapper:has(.wp-block-search__input:focus-visible){outline:2px solid var(--wp--preset--color--leaf);outline-offset:2px}
}
.page-search .wp-block-search__button{display:grid;place-items:center;width:2.75rem;height:2.75rem;padding:0;margin:0;border-radius:50%;background:var(--wp--preset--color--forest);color:var(--wp--preset--color--white);border:0}
.search-results .blog-grid .wp-block-post-title{font-size:var(--fs-xl)}

/* Homepage hero: the refrain leads; Ingela in the clinic doorway is cropped 4:5 around her face. */
.hero{background:var(--wp--preset--color--sage);padding-block:var(--s8)}
.hero-inner{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,600px);gap:var(--s7)!important;align-items:center}
.hero-copy h1{font-size:var(--fs-hero);letter-spacing:-.03em;line-height:1.08;margin:0 0 var(--s5)}
.hero-copy>p{font-size:var(--fs-l);line-height:1.65;max-width:36ch;margin:0 0 var(--s5)}
.hero-copy .wp-block-buttons{gap:var(--s3);align-items:center}
.hero-copy .secondary a,.more-reviews .secondary a{background:transparent!important;color:var(--wp--preset--color--forest)!important;box-shadow:inset 0 0 0 1px var(--wp--preset--color--forest)}
@media (hover:hover){.hero-copy .secondary a:hover,.more-reviews .secondary a:hover{background:var(--wp--preset--color--forest)!important;color:var(--wp--preset--color--white)!important}}
.more-reviews{display:flex;justify-content:center;margin-top:var(--s5)!important}
/* The caption starts where the photo's rounded bottom-left corner ends (same token). */
.hero-location{font-size:var(--fs-xs)!important;margin:calc(var(--s3) * .375) 0 0!important;padding-left:var(--radius-organic);color:var(--wp--preset--color--muted);display:flex;align-items:flex-start;gap:9px}
.hero-location::before{content:'';height:8px;width:8px;margin-top:calc((1lh - 8px) / 2);background:var(--wp--preset--color--leaf);border-radius:50%;flex-shrink:0}
.hero-phone{font-size:var(--fs-m)!important;font-weight:600;margin:var(--s5) 0 0!important}
.hero-phone a{display:inline-flex;align-items:center;gap:var(--s2);text-decoration:none}
.hero-phone a::before{content:'';width:18px;height:18px;background:var(--wp--preset--color--leaf);mask:url('assets/icons/phone.svg') center/contain no-repeat;-webkit-mask:url('assets/icons/phone.svg') center/contain no-repeat}
@media (hover:hover){.hero-phone a:hover{text-decoration:underline}}
.hero-photo{margin:0!important;max-width:460px;justify-self:center;display:grid;align-content:start;grid-template-columns:minmax(0,1fr)}
.hero-photo img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:40% 35%;border-radius:var(--radius) var(--radius) var(--radius) var(--radius-organic)}

/* Sections */
.section{padding-block:var(--s8)}
.section h2{margin:0 0 var(--s5)}
.section-heading{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:var(--s4);margin-bottom:var(--s6)!important}
.section-heading h2{margin:0}
.section-heading p{margin:0;font-size:var(--fs-s);white-space:nowrap}

.about-band{background:var(--wp--preset--color--paper)}
.about-grid{display:grid!important;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--s8)!important;align-items:center}
.about-photo{margin:0!important;max-width:38rem;overflow:hidden;display:grid;align-content:start;grid-template-columns:minmax(0,1fr);border-radius:var(--radius) var(--radius) var(--radius) var(--radius-organic)}
.about-photo img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;object-position:85% 60%}
.about-copy h2{margin-top:0}
.about-copy p{max-width:52ch}
.about-copy .signature{font-family:var(--wp--preset--font-family--heading);font-size:var(--fs-xl);color:var(--wp--preset--color--forest);margin-top:var(--s5)}

.qualifications-section{background:var(--wp--preset--color--white)}
/* Heading and list on the left; the marks gathered on one panel on the right. */
.qualifications-section .section-inner{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:auto 1fr;gap:var(--s5) var(--s8);align-items:start}
.qualifications-section .section-inner>*{margin-block:0!important}
.qualifications-section h2{grid-column:1}
.qualifications-list{grid-column:1;list-style:none;padding:0;margin:0;font-size:var(--fs-m);line-height:1.4}
.qualifications-list li{display:flex;align-items:center;gap:var(--s3);padding-block:.7rem;border-bottom:1px solid var(--wp--preset--color--line)}
.qualifications-list li:first-child{border-top:1px solid var(--wp--preset--color--line)}
.qualifications-list li::before{content:'';flex:0 0 16px;height:16px;background:var(--wp--preset--color--leaf);mask:url('assets/icons/leaf.svg') center/contain no-repeat;-webkit-mask:url('assets/icons/leaf.svg') center/contain no-repeat}
.credentials-grid{grid-column:2;grid-row:1 / span 2;align-self:center;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s5) var(--s4);background:var(--wp--preset--color--mist);padding:var(--s6) var(--s5);border-radius:var(--radius) var(--radius-organic) var(--radius) var(--radius)}
.credentials-grid figure{margin:0;text-align:center;flex:0 0 7.5rem}
.credentials-grid img{display:block;width:100%;height:6rem;object-fit:contain;mix-blend-mode:multiply}
.credentials-grid figcaption{line-height:1.45;margin:var(--s3) auto 0;max-width:16ch}
.credential-link{display:block;border-radius:var(--radius)}
.credential-link img{transition:transform var(--motion-base,260ms) ease}
.credential-link:focus-visible img{transform:translateY(-.25rem)}
@media (hover:hover){.credential-link:hover img{transform:translateY(-.25rem)}}
@media (hover:hover){.credential-link:hover~figcaption{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.2em}}
.credential-link:focus-visible{outline:3px solid var(--wp--preset--color--leaf);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.credential-link img{transition:none}.credential-link:hover img,.credential-link:focus-visible img{transform:none}}

.services-band{background:var(--wp--preset--color--mist);overflow:hidden}
.services-band .section-heading{align-items:center}
/* Treatments scroll sideways, one card per treatment; the next card always peeks in.
   Padding gives the hover lift, shadow and focus ring room inside the scroller. */
.service-grid{display:grid!important;grid-auto-flow:column;grid-auto-columns:clamp(15rem, 27%, 19rem);gap:var(--s5)!important;list-style:none;margin:0!important;padding:var(--s2) var(--gutter) var(--s4)!important;margin-inline:calc(-1 * var(--gutter))!important;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);scrollbar-width:thin;scrollbar-color:var(--wp--preset--color--line) transparent}
.service-item{scroll-snap-align:start;background:var(--wp--preset--color--white);display:flex;flex-direction:column;min-width:0;margin:0!important;padding-bottom:var(--s5);border-radius:var(--radius) var(--radius) var(--radius) calc(var(--radius-organic) * .6);overflow:hidden}
.service-photo{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:var(--wp--preset--color--forest)}
/* No photo yet: the original site's line art, as on the green visit band (lazy, assets/js/pattern.js). */
.service-photo-pattern{position:relative;isolation:isolate}
.service-photo-pattern::before{content:'';position:absolute;inset:0;background:var(--pattern-at,center)/640px auto repeat;filter:invert(1) brightness(.8) contrast(12);mix-blend-mode:screen;opacity:.22}
.pattern-ready .service-photo-pattern::before{background-image:url('/wp-content/uploads/2018/06/ptb_cta-new.jpg')}
/* The same line art standing in for a featured image (treatments without a licensed photo). */
.wp-block-post-featured-image .service-photo{aspect-ratio:3/2}
.service-item .wp-block-post-featured-image{margin:0;overflow:hidden}
.service-item .wp-block-post-featured-image img{display:block;width:100%}
.treatment-photo .service-photo{border-radius:var(--radius) var(--radius) var(--radius) var(--hagby-shape-radius);overflow:hidden}
.service-item:nth-child(3n+1){--pattern-at:12% 30%}
.service-item:nth-child(3n+2){--pattern-at:58% 70%}
.service-item:nth-child(3n){--pattern-at:88% 15%}
.service-item h3{margin:0;padding:var(--s4) var(--s5) 0;font-size:var(--fs-l);line-height:1.3;hyphens:manual}
.service-item h3 a{text-decoration:none;color:var(--wp--preset--color--forest)}
.service-item p{font-size:var(--fs-s);line-height:1.6;margin:var(--s2) var(--s5) 0;padding:0;color:var(--wp--preset--color--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
.carousel-controls{display:flex;gap:var(--s2);margin-left:auto}
.carousel-controls[hidden]{display:none}
.carousel-button{display:grid;place-items:center;width:var(--control);height:var(--control);padding:0;border-radius:50%;border:1px solid var(--wp--preset--color--line);background:var(--wp--preset--color--white);color:var(--wp--preset--color--forest);cursor:pointer}
.carousel-button svg{width:22px;height:22px;fill:currentColor}
.carousel-previous svg{rotate:180deg}
@media (hover:hover){.carousel-button:hover:not(:disabled){background:var(--wp--preset--color--sage)}}
.carousel-button:disabled{opacity:.4;cursor:default}
.carousel-button:focus-visible{outline:2px solid var(--wp--preset--color--leaf);outline-offset:2px}
/* Cards are one link each: the card's own link covers it, and the whole card answers hover and focus. */
.service-item,.treatment-grid li{position:relative}
.service-item h3 a::after,.treatment-grid li h3 a::after{content:'';position:absolute;inset:0;border-radius:inherit}
@media (hover:hover){.service-item:hover,.treatment-grid li:hover{box-shadow:0 1.5rem 2.5rem -1.75rem rgb(40 74 54 / .45)}}
@media (hover:hover){.treatment-grid li:hover{border-bottom-color:var(--wp--preset--color--leaf)}}
@media (hover:hover){.service-item:hover h3 a,.treatment-grid li:hover .wp-block-read-more{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.2em}}
.service-item:has(a:focus-visible),.treatment-grid li:has(a:focus-visible){outline:3px solid var(--wp--preset--color--leaf);outline-offset:-3px}
.service-item a:focus-visible,.treatment-grid li a:focus-visible{outline:none}

.blog-grid{gap:var(--s6) var(--s5)!important;padding:0;list-style:none}
.blog-grid>li{border-top:1px solid var(--wp--preset--color--line);padding-top:var(--s4);min-width:0}
.blog-grid .wp-block-post-date{font-size:var(--fs-xs);color:var(--wp--preset--color--muted);margin:0 0 var(--s2)}
.blog-grid .wp-block-post-title{font-size:var(--fs-xl);line-height:1.3;margin:0 0 var(--s3)}
.blog-grid .wp-block-post-title a{text-decoration:none}
@media (hover:hover){.blog-grid .wp-block-post-title a:hover{text-decoration:underline}}
.blog-grid .wp-block-post-excerpt{font-size:var(--fs-s)}
.blog-grid .wp-block-post-excerpt__excerpt{margin:0}
.blog-grid .wp-block-post-excerpt__more-link{font-weight:600}

.visit-band{position:relative;isolation:isolate;overflow:hidden;background:var(--wp--preset--color--forest);color:var(--wp--preset--color--paper);padding-block:var(--s7)}
/* Shared by the visit band and the closing refrain (.line-art-band). The original site's line-art pattern (uploads 2018/06/ptb_cta-new.jpg): inverted and
   thresholded so only its lines remain, screened faintly onto the green. Loaded only
   when the band nears the viewport (assets/js/pattern.js); static, so no motion. */
.visit-band::before,.line-art-band::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:center/975px auto repeat;filter:invert(1) brightness(.8) contrast(12);mix-blend-mode:screen;opacity:.16}
.visit-band.pattern-ready::before,.line-art-band.pattern-ready::before{background-image:url('/wp-content/uploads/2018/06/ptb_cta-new.jpg')}
.visit-inner{gap:var(--s5);justify-content:space-between;align-items:center!important}
.visit-band h2{color:var(--wp--preset--color--paper);margin:0 0 var(--s2)}
.visit-band p{margin:0;font-size:var(--fs-s)}
.visit-band p:not(.payment-chips) a{color:inherit;text-underline-offset:.2em;text-decoration-color:color-mix(in srgb,currentColor 50%,transparent)}
.visit-band .wp-block-button__link{background:var(--wp--preset--color--paper);color:var(--wp--preset--color--forest)}
/* The buttons wrapper goes with the plain button: left empty it would stay a flex item and its gap would hold the card back from the column's right edge. */
.visit-band .visit-button,.visit-band .wp-block-buttons:has(.visit-button){display:none}
.visit-band p.visit-map-wrap{position:relative;flex:0 1 26.25rem;width:100%;max-width:26.25rem;min-width:0;margin-inline-start:auto;font-size:0}
.visit-map{--hagby-shape-radius:var(--radius-organic);position:relative;display:block;overflow:hidden;aspect-ratio:2/1;border-radius:var(--radius) var(--radius) var(--radius) var(--hagby-shape-radius);background:var(--wp--preset--color--paper);color:var(--wp--preset--color--forest);text-decoration:none}
.visit-map img{display:block;width:100%;height:100%;object-fit:cover}
.visit-map-button{position:absolute;right:var(--s4);bottom:var(--s4);display:inline-flex;align-items:center;min-height:2.75rem;padding:0 var(--s4);background:var(--wp--preset--color--white);color:var(--wp--preset--color--forest);font-size:var(--fs-s);font-weight:600;box-shadow:0 1px 6px rgb(0 0 0 / .18)}
/* The OSM credit is a light caption on the green band just under the card, right-aligned to the card's right edge (Marcus, 2026-10-23); nothing sits inside the map but the pin and the button. */
.visit-map-credit{display:block;position:absolute;top:100%;right:0;margin-top:var(--s2);white-space:nowrap;text-align:right;font-size:.75rem;line-height:1.5;color:var(--wp--preset--color--paper)}
@media (hover:hover){.visit-map:hover .visit-map-button{background:var(--wp--preset--color--forest);color:var(--wp--preset--color--white)}}
@media(max-width:1120px){.visit-map-wrap{display:none}.visit-band .visit-button{display:block}.visit-band .wp-block-buttons:has(.visit-button){display:flex}}
.visit-map:has(:focus-visible),.visit-map:focus-visible{outline:3px solid var(--wp--preset--color--paper);outline-offset:3px}
.visit-map:focus-visible .visit-map-button{background:var(--wp--preset--color--forest);color:var(--wp--preset--color--white)}
@media (hover:hover){.visit-band .wp-block-button__link:hover{background:var(--wp--preset--color--white)}}

.site-footer{padding-block:var(--s5);background:var(--wp--preset--color--sage);font-size:var(--fs-xs);color:var(--wp--preset--color--muted)}
.footer-inner{gap:var(--s6)!important;align-items:flex-start!important}
.footer-brand{display:flex;align-items:center;gap:var(--s3)}
.footer-brand>*{margin:0!important}
.footer-brand img{display:block;width:auto;height:96px;aspect-ratio:2902/2600}
.footer-inner strong{display:block;color:var(--wp--preset--color--forest);font-size:var(--fs-m)}
.footer-inner p{margin:0;line-height:1.7}
.footer-inner a{color:inherit}
.footer-social{margin-top:var(--s3)!important;padding:0;font-size:var(--fs-s)!important}
.footer-social .wp-social-link{background:none!important;color:var(--wp--preset--color--forest)!important}
.footer-social .wp-block-social-link-anchor{padding:0!important;font-weight:600}
.footer-social .wp-block-social-link-anchor svg{width:22px;height:22px}
.footer-social .wp-social-link span:not(.screen-reader-text){font-size:var(--fs-xs);margin-inline:var(--s2) 0}
.footer-note{margin-left:auto!important;max-width:30ch}
.contact-address{--menu-icon:url('assets/icons/contact.svg')}
.contact-phone{--menu-icon:url('assets/icons/phone.svg')}
.contact-email{--menu-icon:url('assets/icons/mail.svg')}
.footer-nav .wp-block-navigation__container{display:grid;grid-template-columns:repeat(2,auto);gap:0 var(--s5);font-size:var(--fs-xs)}
.footer-nav .wp-block-navigation-item__content,.footer-inner .contact-line{display:flex;align-items:center;gap:var(--s2);min-height:1.75rem}
.footer-nav .wp-block-navigation-item__content{color:var(--wp--preset--color--forest);font-weight:600}
@media (hover:hover){.footer-nav .wp-block-navigation-item__content:hover{text-decoration:underline;text-underline-offset:.2em}}
.footer-nav .wp-block-navigation-item__content::before,.footer-inner .contact-line::before{content:'';flex-shrink:0;width:16px;height:16px;background:var(--wp--preset--color--leaf);mask:var(--menu-icon) center/contain no-repeat;-webkit-mask:var(--menu-icon) center/contain no-repeat}
.footer-legal{max-width:var(--wide);margin:var(--s4) auto 0!important;padding-top:var(--s3);border-top:1px solid var(--wp--preset--color--line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--s2) var(--s5)}
.footer-legal p{margin:0!important}

/* Inner pages */
.page-banner{background:var(--wp--preset--color--sage);padding-block:var(--s6);position:relative;isolation:isolate;overflow:hidden}
/* One botanical sprig (assets/images/sprig.8ff666315b.svg, a single hand-built stem with tapering leaves in one stroke weight) climbs in from the right edge. Full-strength forest stroke (no opacity). Static, decorative, behind the
   text and confined to the right third; hidden below 1100px (the lead text would reach it) and for more contrast. */
.page-banner::after{content:'';position:absolute;z-index:-1;pointer-events:none;top:0;bottom:0;right:0;width:min(34%,28rem);background:url('assets/images/sprig.8ff666315b.svg') right bottom/auto min(max(100%,9rem),17.5rem) no-repeat}
@media(max-width:1099px){.page-banner::after{display:none}}
@media(prefers-contrast:more){.page-banner::after{display:none}}
/* A header that carries its own photo (treatments, Behandlingar, Referenser) is decorated by the photo; the sprig would peek out under its corner. */
.page-banner.has-banner-photo::after{display:none}
.page-banner h1{margin:0;max-width:22ch}
/* Treatments: the photo shares the title band so the description starts above the fold. */
.treatment-banner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,26rem);gap:var(--s7);align-items:center}
.treatment-banner>*{margin-block:0!important}
.treatment-banner-title>*{margin-block:0!important}
.treatment-banner-title h1{margin-block:var(--s2) var(--s4)!important}
.treatment-contact{font-size:var(--fs-l)!important;max-width:34ch!important;margin-bottom:var(--s5)!important}
.treatment-banner .preview-note{font-size:var(--fs-xs);color:var(--wp--preset--color--muted);margin-top:var(--s3)!important}
.reading-layout.single-column{grid-template-columns:minmax(0,var(--measure))}
.treatment-photo{--hagby-shape-radius:var(--radius-organic);margin:0}
.treatment-photo img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--radius) var(--radius) var(--radius) var(--hagby-shape-radius)}
.page-banner p{margin:var(--s4) 0 0;max-width:56ch;font-size:var(--fs-l)}
.breadcrumb,.page-banner .breadcrumb{font-size:var(--fs-xs);margin:0 0 var(--s3)!important}
.content-section{padding-block:var(--s6) var(--s8)}
.reading-layout{display:grid!important;grid-template-columns:minmax(0,var(--measure)) 20rem;justify-content:space-between;gap:var(--s7)!important;align-items:start}
.reading-content{min-width:0}
/* "Så går det till": a quiet panel after her text, then the booking button. */
.treatment-facts{background:var(--wp--preset--color--mist);border-radius:var(--radius);padding:var(--s5);margin-top:var(--s7)}
.reading-content .treatment-facts h2{font-size:var(--fs-xl);margin:0 0 var(--s3)}
.treatment-facts p{margin:0}
.treatment-facts dl{margin:var(--s4) 0 0;display:grid;gap:var(--s3)}
.treatment-facts dl>div{display:grid;grid-template-columns:minmax(0,9rem) minmax(0,1fr);gap:var(--s3);padding-top:var(--s3);border-top:1px solid var(--wp--preset--color--line)}
.treatment-facts dt{font-weight:600;color:var(--wp--preset--color--forest)}
.treatment-facts dd{margin:0;line-height:1.6}
.act-alp-logo{margin:var(--s4) 0}.act-alp-logo img{display:block;width:150px;max-width:40%;height:auto}
.treatment-facts .facts-list{margin:0;padding-left:1.2em}.treatment-facts .facts-list li+li{margin-top:var(--s2,.5rem)}
.treatment-disclaimer{font-size:var(--fs-s);font-style:italic;margin:var(--s5) 0 0}
.treatment-facts .facts-gap{font-style:italic;color:var(--wp--preset--color--forest);background:var(--wp--preset--color--white);border-radius:.25rem;padding:0 .35em}
@media (max-width:600px){.treatment-facts dl>div{grid-template-columns:1fr;gap:var(--s1,.25rem)}.treatment-facts .treatment-book-end .wp-block-button,.treatment-facts .treatment-book-end .wp-block-button__link{display:block;width:100%;text-align:center}}
/* The Boka button closes the box as its last row. */
.treatment-facts .treatment-book-end{margin-top:var(--s4);padding-top:var(--s4);border-top:1px solid var(--wp--preset--color--line)}
.treatment-facts .booking-helper{max-width:none}
.treatment-book-end{margin-top:var(--s7)}
.treatment-book-end .wp-block-buttons{margin:0}
.treatment-book-end .booking-helper{font-size:var(--fs-s);color:var(--wp--preset--color--muted);margin:var(--s3) 0 0}
.reading-content>:first-child{margin-top:0}
.reading-content h2{font-size:var(--fs-xl);line-height:1.3;margin-top:var(--s6)}
.reading-content h3,.reading-content .was-h3{font-size:var(--fs-l)}
.reading-content p,.reading-content li{line-height:1.85}
.reading-content img{border-radius:var(--radius)}
.reading-content>.wp-block-post-featured-image{margin:0 0 var(--s6);overflow:hidden;border-radius:var(--radius)}
.reading-content>.wp-block-post-featured-image img,.reading-content>.wp-block-image img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.reading-content>.wp-block-image{margin:0 0 var(--s6)}
.reading-content li{padding-left:5px;margin-bottom:var(--s2)}
/* The original's checklists: a quiet panel, introduced by its own lead-in line. */
.reading-content .list-lead{font-family:var(--wp--preset--font-family--heading);font-size:var(--fs-l);line-height:1.4;color:var(--wp--preset--color--forest);margin:var(--s6) 0 var(--s3)}
.reading-content .wp-block-post-content ul{background:var(--wp--preset--color--mist);border-radius:var(--radius);padding:var(--s4) var(--s5);margin:0 0 var(--s6);list-style:none}
.reading-content .wp-block-post-content ul:has(li:nth-child(8)){columns:2;column-gap:var(--s6)}
.reading-content .wp-block-post-content ul li{position:relative;padding:var(--wp--preset--spacing--10) 0 var(--wp--preset--spacing--10) 1.625rem;margin:0;line-height:1.55;break-inside:avoid}
.reading-content .wp-block-post-content ul li::before{content:'';position:absolute;left:0;top:.6em;width:.875rem;height:.875rem;background:var(--wp--preset--color--leaf);mask:url('assets/icons/leaf.svg') center/contain no-repeat;-webkit-mask:url('assets/icons/leaf.svg') center/contain no-repeat}
/* Prices: duration and price in two aligned columns, figures at equal width. */
.reading-content .wp-block-post-content ul.price-list{background:none;border-block:1px solid var(--wp--preset--color--line);border-radius:0;padding:0;max-width:22rem;margin-top:var(--s4);font-variant-numeric:tabular-nums}
.reading-content .wp-block-post-content .price-list li{display:flex;justify-content:space-between;gap:var(--s5);padding:var(--s3) 0;border-top:1px solid var(--wp--preset--color--line)}
.reading-content .wp-block-post-content .price-list li:first-child{border-top:0}
.reading-content .wp-block-post-content .price-list li::before{content:none}
.reading-content .wp-block-post-content .price-list li span:last-child{font-weight:600;color:var(--wp--preset--color--forest)}
/* Treatments close on Ingela's refrain, set off from the text above. */
.refrain{font-family:var(--wp--preset--font-family--heading);font-size:var(--fs-xl);line-height:1.3;color:var(--wp--preset--color--forest)}
/* The refrain closes treatment pages and Referenser as a compact forest band with the line art. */
.refrain.line-art-band{position:relative;isolation:isolate;overflow:hidden;background:var(--wp--preset--color--forest);color:var(--wp--preset--color--paper);border-radius:var(--radius);padding:var(--s5) var(--s6);margin:var(--s7) 0 0;max-width:none}
.reading-content .refrain{max-width:none;margin:var(--s7) 0 0;padding-top:var(--s5);border-top:1px solid var(--wp--preset--color--line)}
.reading-content .refrain.line-art-band{border-top:0;padding:var(--s5) var(--s6);margin-top:var(--s7)}
.booking-aside{background:var(--wp--preset--color--sage);padding:var(--s5);border-radius:var(--radius);position:sticky;top:var(--sticky-top)}
.booking-aside h2{font-size:var(--fs-xl);margin:0 0 var(--s3)}
.booking-aside p{font-size:var(--fs-s);margin:0 0 var(--s4)}
.booking-aside .preview-note{font-size:var(--fs-xs);color:var(--wp--preset--color--muted);margin:var(--s3) 0 0}
/* Treatment pages: every treatment in the right column, the current one marked. It
   stays in view while reading; on phones it follows the text as a wrapped list. */
.treatment-nav{position:sticky;top:var(--sticky-top);padding-left:var(--s3);border-left:1px solid var(--wp--preset--color--line)}
.treatment-nav h2{font-size:var(--fs-l);margin:0 0 var(--s3);padding-left:.75rem}
.treatment-nav ul{list-style:none;margin:0;padding:0;font-size:var(--fs-s)}
.treatment-nav a{display:block;padding:.375rem .75rem;border-radius:var(--radius);text-decoration:none;color:var(--wp--preset--color--forest);hyphens:manual;transition:background-color var(--motion-base,260ms) ease}
@media (hover:hover){.treatment-nav a:hover{background:var(--wp--preset--color--mist)}}
.treatment-nav a[aria-current=page]{background:var(--wp--preset--color--sage);font-weight:650}
.treatment-grid{gap:var(--s5)!important;padding:0}
/* Chip menu: a salvia band under the hero that stays below the header while the sections scroll past. */
.category-bar{position:sticky;top:calc(var(--sticky-top) - 1rem);z-index:40;background:var(--wp--preset--color--paper);border-bottom:1px solid var(--wp--preset--color--line);padding-inline:var(--gutter)}
/* The band meets the header's lower edge (--sticky-top less the 1rem of air the booking box keeps), so its pills sit centred between that edge and the bottom line. A few px of paper cover rounding where header heights differ. */
@media(min-width:781px){.category-bar{top:calc(var(--sticky-top) - 1rem + 1px)}}/* the desktop header is 2px taller than the phone one */
.category-bar::before{content:'';position:absolute;inset:-4px 0 auto;height:4px;background:var(--wp--preset--color--paper)}
.category-chip-list{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--s3);max-width:var(--wide);height:var(--chips-height);margin:0 auto!important;padding:0!important;list-style:none;overflow-x:auto;scrollbar-width:none}
.category-chip-list::-webkit-scrollbar{display:none}
.category-chip-list li{flex:none}
.category-chip-list a{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 var(--s4);border-radius:999px;background:var(--wp--preset--color--sage);color:var(--wp--preset--color--forest);text-decoration:none;white-space:nowrap;font-size:var(--fs-s);font-weight:600;box-shadow:inset 0 0 0 1px var(--wp--preset--color--line);transition:background-color var(--motion-base,260ms) ease,color var(--motion-base,260ms) ease,box-shadow var(--motion-base,260ms) ease}
.category-chip-list a:hover{background:var(--wp--preset--color--white);box-shadow:inset 0 0 0 2px var(--wp--preset--color--leaf)}
.category-chip-list a[aria-current]{background:var(--wp--preset--color--forest);color:var(--wp--preset--color--white);box-shadow:none}
.category-chip-list a:focus-visible{outline-offset:-2px}
.category-chip-list a[aria-current]:focus-visible{outline:2px solid var(--wp--preset--color--white);outline-offset:-5px}
.treatment-categories.section{padding-block:var(--s6) var(--s8)}
.treatment-category+.treatment-category{margin-top:var(--s8)}
.treatment-category>h2{margin:0 0 var(--s5);scroll-margin-top:var(--chips-height)}
.treatment-grid li{background:var(--wp--preset--color--white);padding:0 0 var(--s5);list-style:none;border-bottom:2px solid var(--wp--preset--color--line);display:flex;flex-direction:column;gap:var(--s3);overflow:hidden;border-radius:var(--radius) var(--radius) 0 0}
.treatment-grid li>*{margin:0;padding-inline:var(--s5)}
.treatment-grid .wp-block-post-featured-image{padding:0;margin-bottom:var(--s2)}
.treatment-grid .wp-block-post-featured-image img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.treatment-grid h3{font-size:var(--fs-xl);margin:0}
.treatment-grid h3 a{text-decoration:none}
/* A category with one treatment shows it as one wide row (photo left, text right) instead of a lone narrow card. */
@media(min-width:781px){.treatment-grid:has(>li:only-child){grid-template-columns:minmax(0,1fr)!important}
.treatment-grid:has(>li:only-child) li{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:1fr auto auto 1fr;column-gap:var(--s6);padding:0;border-radius:var(--radius) var(--radius) 0 0}
.treatment-grid:has(>li:only-child) .wp-block-post-featured-image{grid-column:1;grid-row:1/-1;margin:0}
.treatment-grid:has(>li:only-child) li>:not(.wp-block-post-featured-image){grid-column:2;padding-inline:0 var(--s6)}
.treatment-grid:has(>li:only-child) h3{grid-row:2;margin-bottom:var(--s3)}
.treatment-grid:has(>li:only-child) .treatment-line{grid-row:3;-webkit-line-clamp:4;line-clamp:4}
.treatment-grid:has(>li:only-child) .wp-block-read-more{grid-row:4;align-self:start;margin-top:var(--s4)}}
.treatment-grid .wp-block-read-more{margin-top:auto;font-size:var(--fs-s);font-weight:600}
/* The card's line, as on the homepage card: muted, at most three lines. */
.treatment-grid .treatment-line{font-size:var(--fs-s);line-height:1.6;color:var(--wp--preset--color--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
.treatment-grid .treatment-line:empty{display:none}

/* Kontakt: the details as one card, the map as its footer. */
.contact-layout .wp-block-post-content{background:var(--wp--preset--color--white);border:1px solid var(--wp--preset--color--line);border-radius:var(--radius) var(--radius-organic) var(--radius) var(--radius);padding:var(--s6);overflow:hidden}
.contact-layout .wp-block-post-content>*{margin-block:0}
.contact-layout :is(h4,.was-h4){font-family:var(--wp--preset--font-family--body);font-size:var(--fs-s);font-weight:600;color:var(--wp--preset--color--muted)}
.contact-layout h3{font-size:var(--fs-2xl);margin-top:var(--s2)!important}
.contact-layout p:not(:has(img)):not(.photo-credit){display:flex;gap:var(--s3);margin-top:var(--s4)!important;line-height:1.6}
.contact-layout p:not(:has(img)):not(.photo-credit)::before{content:'';flex:0 0 18px;height:18px;margin-top:.2em;background:var(--wp--preset--color--leaf);mask:url('assets/icons/contact.svg') center/contain no-repeat;-webkit-mask:url('assets/icons/contact.svg') center/contain no-repeat}
.contact-layout p:has(.mail-link)::before{mask-image:url('assets/icons/mail.svg');-webkit-mask-image:url('assets/icons/mail.svg')}
/* The map closes the card: the site's own OpenStreetMap image, its credit on the
   image, then the two ways onward. */
/* One card: the rows, the map and its buttons share the card's padding, background and a single rhythm. */
.contact-layout .wp-block-post-content>.contact-map{margin-top:var(--s5)}
.contact-map-view{position:relative;overflow:hidden;border:1px solid var(--wp--preset--color--line);border-radius:var(--radius)}
.contact-map-image{display:block}
.contact-map-image img,.contact-map-frame{display:block;width:100%;height:auto;aspect-ratio:2/1;border:0;border-radius:0}
.contact-map-frame{min-height:20rem}
/* The OpenStreetMap credit sits on the map, in its bottom-right corner. */
.contact-layout .contact-map-credit{position:absolute;right:0;bottom:0;margin:0!important;display:block!important;max-width:none;padding:.125rem .5rem;border-top-left-radius:var(--radius);background:color-mix(in srgb,var(--wp--preset--color--white) 88%,transparent);font-size:var(--fs-xs);line-height:1.5;color:var(--wp--preset--color--ink)}
.contact-layout .contact-map-credit::before{content:none!important}
.contact-map-credit a{color:inherit}
.contact-map-actions{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s4)}
.contact-map-actions>*{flex:1 1 auto}
.contact-map-actions .wp-element-button{display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;padding:0 var(--s5);text-decoration:none}
.contact-map-load{min-height:2.75rem;padding:0 var(--s5);border:0;border-radius:var(--radius);background:transparent;box-shadow:inset 0 0 0 1px var(--wp--preset--color--forest);color:var(--wp--preset--color--forest);font:inherit;font-size:var(--fs-s);font-weight:600;cursor:pointer;transition:background-color var(--motion-base,260ms) ease,color var(--motion-base,260ms) ease}
@media (hover:hover){.contact-map-load:hover:not(:disabled){background:var(--wp--preset--color--forest);color:var(--wp--preset--color--white)}}
.contact-map-load:disabled{opacity:.55;cursor:not-allowed}
.contact-layout p.contact-map-note:not(:has(img)):not(.photo-credit){margin:8px 0 0!important;display:block!important;font-size:var(--fs-xs);color:var(--wp--preset--color--muted)}
.contact-layout .contact-map-note::before{content:none!important}
@media(max-width:600px){.contact-map-image img{aspect-ratio:6/5}.contact-map-frame{aspect-ratio:4/5}}

/* Om mig: the original portrait heads the side column, above the booking box. */
.about-side{display:flex;flex-direction:column;gap:var(--s5);align-self:stretch}
.about-side>*{margin-block:0!important}
.about-portrait{margin:0;overflow:hidden;border-radius:var(--radius) var(--radius-organic) var(--radius) var(--radius)}
.about-portrait img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%}
/* Om mig: Ingela's opening line as a pull quote. */
.about-layout .wp-block-post-content>h2:first-child+p{font-family:var(--wp--preset--font-family--heading);font-size:var(--fs-2xl);line-height:1.25;letter-spacing:-.01em;color:var(--wp--preset--color--forest);max-width:22ch;text-wrap:balance;margin-block:var(--s4) var(--s6);text-indent:-.42em;hanging-punctuation:first}
/* Her own quotation marks hang in the margin. */
@supports (hanging-punctuation:first){.about-layout .wp-block-post-content>h2:first-child+p{text-indent:0}}
/* The leaf divides longer text: centred between two hairlines, never alone under a heading or quote. */
.leaf-divider,.wp-block-separator.leaf-divider{display:block;position:relative;opacity:1;width:min(12rem,60%);height:1.375rem;margin:var(--s7) auto;border:0;background:linear-gradient(var(--wp--preset--color--line),var(--wp--preset--color--line)) left center/calc(50% - 1.5rem) 1px no-repeat,linear-gradient(var(--wp--preset--color--line),var(--wp--preset--color--line)) right center/calc(50% - 1.5rem) 1px no-repeat}
.leaf-divider::before{content:'';position:absolute;inset:0;margin:auto;width:1.375rem;height:1.375rem;background:var(--wp--preset--color--leaf);mask:url('assets/icons/leaf.svg') center/contain no-repeat;-webkit-mask:url('assets/icons/leaf.svg') center/contain no-repeat}
.wp-block-post-content p>img:not(.emoji){display:block;max-width:100%;height:auto;margin:var(--s5) 0 0;border-radius:var(--radius)}
/* Om mig badge wall: every badge in the same box (circles and rounded squares alike), a centred wrap so the last row is never a lone orphan.
   Five a row on the article column, four on a tablet column, two on a phone (ten badges); the award card is the panel's own row below. */
.credential-row{container-type:inline-size;display:grid;justify-items:center;gap:var(--s5);margin-block:var(--s6)}
.credential-marks{--badge-box:5.5rem;--badge-gap:var(--s4);--per-row:2;box-sizing:border-box;width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--s5) var(--badge-gap);background:var(--wp--preset--color--mist);padding:var(--s5) var(--s4);border-radius:var(--radius) var(--radius-organic) var(--radius) var(--radius)}
.credential-marks>*{display:flex;align-items:center;justify-content:center;flex:0 0 calc((100% - (var(--per-row) - 1) * var(--badge-gap)) / var(--per-row));height:var(--badge-box);border-radius:var(--radius)}
.credential-marks picture{display:contents}
.credential-marks img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;mix-blend-mode:multiply;border-radius:0}
/* The rounded-square badges fill their whole frame, so at the same height they read heavier than the circles: draw them slightly smaller. */
.credential-marks img[src*="badge-klimakterieterapeut"],.credential-marks img[src*="badge-fibroterapeut"]{height:4.75rem;max-height:4.75rem}
@container (min-width:24rem){.credential-marks{--per-row:4}}
@container (min-width:34rem){.credential-marks{--per-row:5}}
.credential-membership{box-sizing:border-box;width:100%;display:flex;align-items:center;justify-content:center;gap:var(--s3);margin:0;text-align:left;line-height:1.5}
.credential-membership .credential-link{flex:none}
.credential-membership img{display:block;width:6rem;height:6rem;border-radius:50%;object-fit:cover;flex:none}
@media (max-width:600px){.credential-membership img{width:4.5rem;height:4.5rem}}
.credential-award{box-sizing:border-box;width:100%;display:flex;align-items:center;gap:var(--s5);background:var(--wp--preset--color--white);border:1px solid var(--wp--preset--color--line);border-radius:var(--radius);padding:var(--s4)}
.credential-award-photo{flex:0 0 auto;width:6rem;display:block}
.credential-award-photo img{display:block;width:100%;height:auto;border-radius:var(--radius)}
.credential-award-text{min-width:0}
.credential-award-text p{margin:0;line-height:1.4}
.credential-award-label{font-size:var(--fs-s);text-transform:uppercase;letter-spacing:.08em;color:var(--wp--preset--color--muted)}
.credential-award-title{font-family:var(--wp--preset--font-family--heading);font-size:var(--fs-l);line-height:1.3;color:var(--wp--preset--color--forest);margin-block:var(--s2)!important}
.credential-award-by{font-size:var(--fs-s);color:var(--wp--preset--color--muted)}
@container (min-width:34rem){.credential-award-photo{width:8.5rem}}

/* Blog article: one reading column for heading and body. */
.post-heading,.article-body{max-width:calc(var(--measure) + 2 * var(--gutter));margin-inline:auto!important;padding-inline:var(--gutter)}
.post-heading{padding-block:var(--s7) var(--s5)}
.post-heading h1{margin:var(--s3) 0}
.post-heading .wp-block-post-date,.post-heading .byline{font-size:var(--fs-s);color:var(--wp--preset--color--muted);margin:0}
.article-body{padding-bottom:var(--s8);line-height:1.85}
.article-body img{max-height:32rem;width:auto;object-fit:contain;border-radius:var(--radius)}
.article-body .wp-block-post-content>p{margin-block:0 var(--s5)}
.article-body .wp-block-post-content>p:first-child{font-size:var(--fs-l);line-height:1.7;color:var(--wp--preset--color--forest)}
.post-nav{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5)!important;margin-top:var(--s6)!important}
.post-nav>*{margin:0!important;display:flex;flex-direction:column;gap:var(--wp--preset--spacing--10);font-size:var(--fs-s);color:var(--wp--preset--color--muted)}
.post-nav .post-navigation-link-next{grid-column:2;text-align:right}
.post-nav a{font-family:var(--wp--preset--font-family--heading);font-size:var(--fs-l);line-height:1.35;text-decoration:none}
@media (hover:hover){.post-nav a:hover{text-decoration:underline}}

/* Referenser: each customer's words as its own card, signed with their name. */
.testimonials-layout{max-width:var(--wide);margin-inline:auto!important}
.testimonials-layout .wp-block-post-content{columns:1;column-gap:var(--s5)}
@media (min-width:48rem){.testimonials-layout .wp-block-post-content{columns:2}}
@media (min-width:72rem){.testimonials-layout .wp-block-post-content{columns:3}}
.testimonials-layout .wp-block-post-content figure{break-inside:avoid;display:flex;flex-direction:column;background:var(--wp--preset--color--white);border:1px solid var(--wp--preset--color--line);border-radius:var(--radius);padding:var(--s5);margin:0 0 var(--s5)}
.testimonials-layout .wp-block-post-content figcaption{order:-1;display:flex;align-items:center;gap:var(--s3);margin:0 0 var(--s4);font-size:var(--fs-m);font-weight:700;color:var(--wp--preset--color--ink)}
.testimonials-layout .review-avatar{flex:0 0 2.75rem;display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;background:var(--wp--preset--color--sage);color:var(--wp--preset--color--forest);font-family:var(--wp--preset--font-family--heading);font-size:var(--fs-l);font-weight:600;line-height:1}
.testimonials-layout .wp-block-post-content blockquote{margin:0}
.testimonials-layout .wp-block-post-content blockquote p{max-width:none;margin:0;line-height:1.75}
.js-reviews .review-card:not(.is-open) blockquote p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:7;line-clamp:7;overflow:hidden}
.testimonials-layout .review-toggle{align-self:flex-start;margin:var(--s3) 0 0;padding:.5rem 0;min-height:2.75rem;background:none;border:0;font:inherit;font-size:var(--fs-s);font-weight:600;color:var(--wp--preset--color--forest);text-decoration:underline;text-underline-offset:.2em;cursor:pointer}
@media (hover:hover){.testimonials-layout .review-toggle:hover{color:var(--wp--preset--color--leaf)}}
.testimonials-layout .wp-block-post-content strong{font-weight:inherit}
.testimonials-layout .wp-block-post-content>.refrain{column-span:all;text-align:center;margin:var(--s5) 0 0;padding-top:var(--s6);border-top:1px solid var(--wp--preset--color--line)}
.testimonials-layout .wp-block-post-content>.refrain.line-art-band{border-top:0;padding:var(--s5) var(--s6)}
.testimonials-layout .reviews-more{max-width:none;text-align:center;margin:var(--s5) 0 0!important;font-size:var(--fs-s);color:var(--wp--preset--color--muted)}
.reviews-more a{color:var(--wp--preset--color--forest);text-underline-offset:.2em}

/* Galleri: the original photos, uncropped, in balanced columns. */
.photo-gallery{max-width:var(--wide);margin-inline:auto!important}
/* The newest photos fill justified rows in their order: each is as wide as its shape asks (--ar, width/height), so portrait and landscape share a row at one height. */
.gallery-new{display:flex;flex-wrap:wrap;gap:var(--s4);margin:0 0 var(--s4)}
.gallery-new::after{content:"";flex:10000 1 0}
.gallery-new .gallery-new-photo{margin:0;flex:calc(var(--ar)*100) 1 calc(var(--ar)*var(--row,280px))}
@media (max-width:600px){.gallery-new{--row:240px}}
.gallery-new .gallery-new-photo img{display:block;width:100%;height:auto;border-radius:var(--radius)}
/* The Galleri's one credit line for all its tiles: quiet, with the studio as a plain underlined link. */
.photo-credit{margin:calc(-1*var(--s2)) 0 var(--s5);font-size:var(--fs-s);color:var(--wp--preset--color--muted)}
.photo-credit a{display:inline;color:inherit;text-decoration:underline;text-underline-offset:.15em}
/* Every other credit (inc/photo-credits.php adds it from the image file) is one small label inside the photo's bottom-right corner, away from the shaped bottom-left curve. The dark floor keeps white 85% text at 4.5:1 even over a white pixel. */
.has-photo-credit{position:relative}
.has-photo-credit>.photo-credit{position:absolute;right:0;bottom:0;margin:0;padding:1.5rem var(--s3) var(--s2) 3rem;font-size:.75rem;line-height:1.2;text-align:right;color:rgba(255,255,255,.85);text-shadow:0 1px 2px rgba(0,0,0,.6);background:radial-gradient(ellipse farthest-side at 100% 100%,rgba(0,0,0,.6) 0 70%,transparent);border-radius:0 0 var(--radius) 0}
.has-photo-credit>.photo-credit a{color:inherit}
/* The two home photos are grids with a caption row under the image: the label shares the image's cell instead of the figure's bottom edge. */
.hero-photo>img,.about-photo>img,.hero-photo>.photo-credit,.about-photo>.photo-credit{grid-area:1/1}
.hero-photo>.photo-credit,.about-photo>.photo-credit{position:static;align-self:end;justify-self:end}
/* Ingela's new photos on the other pages (spring 2026, the Galleri's assets). A portrait fills a 4:5 frame, face high. */
.treatment-photo.treatment-photo-portrait img{aspect-ratio:4/5!important;object-position:center 12%}
.treatment-photo-portrait{justify-self:end;width:100%;max-width:22rem}
@media (max-width:780px){.treatment-photo-portrait{justify-self:start;max-width:18rem}}
.contact-photos{display:flex;gap:var(--s4);margin-top:var(--s5)}
.contact-photos .contact-photo{margin:0;flex:calc(var(--ar)*100) 1 0;min-width:0}
.contact-photos .contact-photo img{display:block;width:100%;height:auto;border-radius:var(--radius)}
.contact-photos .contact-photo a.lightbox-link{display:block;overflow:hidden;border-radius:var(--radius)}
@media(max-width:600px){.contact-photos{flex-direction:column;align-items:flex-start}.contact-photos .contact-photo{flex:none;width:100%}.contact-photos .contact-photo:first-child{width:60%}}
.booking-gift-layout{display:grid;gap:var(--s5)}
.booking-gift-layout>*{margin:0!important}
.booking-gift-photo img{display:block;width:100%;aspect-ratio:16/9;max-height:22rem;object-fit:cover;object-position:50% 40%;border-radius:var(--radius)}
@media(min-width:900px){.booking-gift-layout{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}.booking-gift-photo{position:relative;min-height:22rem}.booking-gift-photo img{position:absolute;inset:0;height:100%;max-height:none;aspect-ratio:auto;object-position:100% 50%}}
.photo-gallery .wp-block-post-content{columns:3 16rem;column-gap:var(--s4)}
.photo-gallery .wp-block-post-content p{display:contents}
.photo-gallery .wp-block-post-content img{display:block;width:100%;height:auto;margin:0 0 var(--s4);break-inside:avoid;border-radius:var(--radius)}
.wp-block-query-pagination{padding-top:var(--s6)}
.wp-block-query-pagination-numbers{display:flex;gap:var(--s2)}
.wp-block-query-pagination .page-numbers{display:grid;place-items:center;min-width:2.5rem;height:2.5rem;padding:0 var(--s2);border-radius:999px;text-decoration:none}
.wp-block-query-pagination a.page-numbers{border:1px solid var(--wp--preset--color--line)}
@media (hover:hover){.wp-block-query-pagination a.page-numbers:hover{background:var(--wp--preset--color--mist)}}
.wp-block-query-pagination .page-numbers.current{background:var(--wp--preset--color--sage);color:var(--wp--preset--color--forest);font-weight:600}
.wp-block-query-pagination-next,.wp-block-query-pagination-previous{align-self:center}
/* Boka nu: the banner books; below it, how to pay and where to read on. */
.booking-hero>*{margin-block:0!important}
.booking-hero h1{margin-bottom:var(--s3)!important}
.booking-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s4) var(--s6);margin-top:var(--s5)!important}
.booking-actions>*{margin:0!important}
.booking-hero .wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;gap:.625rem;padding:1rem 1.75rem;font-size:var(--fs-m)}
.booking-hero .wp-block-button__link[aria-disabled=true]{cursor:not-allowed;opacity:.7}
/* The button names where the booking happens. Bokadirekt publishes no partner logo, so in text. */
.button-via{font-weight:400;margin-left:-.375rem}
.booking-hero .wp-block-button__link::before{content:'';width:15px;height:16px;background:currentColor;mask:url('assets/icons/bookmark.svg') center/contain no-repeat;-webkit-mask:url('assets/icons/bookmark.svg') center/contain no-repeat}
.page-banner .booking-actions p.booking-hours{display:flex;align-items:center;gap:var(--s2);margin:0;font-size:var(--fs-s)}
.booking-actions .booking-hours::before{content:'';flex-shrink:0;width:18px;height:18px;background:var(--wp--preset--color--leaf);mask:url('assets/icons/clock.svg') center/contain no-repeat;-webkit-mask:url('assets/icons/clock.svg') center/contain no-repeat}
.page-banner .booking-hero p.preview-note{margin-top:var(--s3)!important;font-size:var(--fs-xs);color:var(--wp--preset--color--muted)}
.booking-body{max-width:var(--wide);margin-inline:auto!important;display:grid;gap:var(--s7)}
.booking-body>*,.booking-payment>*,.booking-options>*,.booking-next>*{margin:0!important}
.booking-payment h2{font-size:var(--fs-xl);margin-bottom:var(--s5)!important}
.booking-terms{display:grid;gap:var(--s3)}
.booking-terms h2{margin-bottom:var(--s2)!important}
/* Ingela's two ways to pay, stacked in one card beside her photo; her OBS belongs with the gift cards. */
.booking-options{display:grid;grid-template-columns:1fr;align-content:center;padding:var(--s4) var(--s5);background:var(--wp--preset--color--white);border:1px solid var(--wp--preset--color--line);border-radius:var(--radius)}
.booking-option{display:grid;align-content:start;row-gap:var(--s3);padding:var(--s4) 0}
.booking-option-gift{padding-top:0}
.booking-option-epassi{padding-bottom:0;border-top:1px solid var(--wp--preset--color--line)}
.booking-helper{font-size:var(--fs-s);color:var(--wp--preset--color--muted)}
.booking-option>*{margin:0!important}
.booking-option h3{align-self:flex-start;display:flex;align-items:center;min-height:2.5rem}
/* Plain card headings: a gift icon with "Presentkort", and Epassi's own logo. */
.booking-gift-card{gap:var(--s3);font-size:var(--fs-l);font-weight:400}
.booking-gift-card::before{content:'';flex-shrink:0;width:1.75rem;height:1.75rem;background:var(--wp--preset--color--leaf);mask:url('assets/icons/gift.svg') center/contain no-repeat;-webkit-mask:url('assets/icons/gift.svg') center/contain no-repeat}
.booking-option-epassi h3 a{display:flex;align-items:center}
.booking-option-epassi .epassi-logo{display:block;width:auto;height:1.75rem}
.booking-obs{font-size:var(--fs-s);color:var(--wp--preset--color--muted)}
/* Next steps: the two pages to read on, and her number. */
.booking-next{padding-top:var(--s6);border-top:1px solid var(--wp--preset--color--line)}
.booking-link-phone{--menu-icon:url('assets/icons/phone.svg')}
.booking-links{display:flex;flex-wrap:wrap;gap:var(--s3);padding:0;list-style:none}
.booking-links li{margin:0}
.booking-links a{display:inline-flex;align-items:center;gap:var(--s3);min-height:3rem;padding:0 var(--s5);background:var(--wp--preset--color--white);border:1px solid var(--wp--preset--color--line);border-radius:var(--radius);color:var(--wp--preset--color--forest);font-weight:600;text-decoration:none;transition:border-color var(--motion-base,260ms) ease}
@media (hover:hover){.booking-links a:hover{border-color:var(--wp--preset--color--forest)}}
.booking-links a::before{content:'';flex-shrink:0;width:18px;height:18px;background:var(--wp--preset--color--leaf);mask:var(--menu-icon) center/contain no-repeat;-webkit-mask:var(--menu-icon) center/contain no-repeat}
@media(max-width:600px){.booking-actions .wp-block-buttons,.booking-actions .wp-block-button,.booking-hero .wp-block-button__link,.booking-links li,.booking-links a{width:100%}}
/* Phones swipe; the heading keeps its link beside it. */
@media(max-width:600px){.services-band .section-heading{flex-direction:row!important;align-items:center}.services-band .carousel-controls{display:none}}
@media(max-width:400px){.header-inner{gap:var(--s3)!important}}
/* Payment methods: one chip component (.payment-chip) in two layouts. Boka nu sets four in a tinted box (.payment-box); the Behandlingar
   header (light) and the home visit band (dark green) set the same chips compact in a plain row (.payment-chips-compact), no box, so it
   does not compete with the booking button. Swish's and Epassi's colour logotypes stay unaltered on white tiles (their guidelines; neither
   kit offers a connected merchant a dark-ground variant), the card and cash marks are neutral icons. Payment chips that are plain information get no hover. */
.payment-chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s3);margin-top:var(--s4)!important;font-size:var(--fs-xs)}
.payment-label{font-weight:600;font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--wp--preset--color--muted)}
.payment-chip{--chip-h:2.75rem;--chip-px:1rem;--chip-swish:2rem;--chip-icon:1.375rem;--chip-epassi:1.25rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:var(--chip-h);padding:.25rem var(--chip-px);background:var(--wp--preset--color--white);border:1px solid var(--wp--preset--color--line);border-radius:var(--radius);font-size:var(--fs-xs);font-weight:500;line-height:1.2;color:var(--wp--preset--color--ink)!important;text-decoration:none;white-space:nowrap}
.payment-chip.payment-swish img{display:block;width:auto;height:var(--chip-swish)}
.payment-chip.payment-plain svg{flex:none;width:var(--chip-icon);height:var(--chip-icon)}
.payment-chip.payment-epassi img{display:block;width:auto;height:var(--chip-epassi)}
.payment-chip.payment-epassi>span:not(.screen-reader-text){position:static;width:auto;height:auto;overflow:visible;clip:auto;color:var(--wp--preset--color--muted)}
a.payment-chip:focus-visible{outline:2px solid var(--wp--preset--color--forest);outline-offset:2px;box-shadow:inset 0 0 0 2px var(--wp--preset--color--leaf)}
/* Only a chip that is a link answers hover and focus (the home band's four, Boka nu's Epassi); a chip that is plain information keeps the default cursor. */
.payment-chip:not(a){cursor:default}
@media (hover:hover){a.payment-chip:hover{box-shadow:inset 0 0 0 2px var(--wp--preset--color--leaf)}}
/* Boka nu: the official Swish logotype is vertical only and may not be taken apart (swish.nu marketing toolbox), so it keeps its own
   proportions inside a chip like the rest. Not clickable except Epassi. */
.payment-box{display:grid;gap:var(--s3);padding:var(--s4);background:var(--wp--preset--color--mist);border:1px solid var(--wp--preset--color--line);border-radius:var(--radius)}
.payment-box>*{margin:0!important}
.payment-box-label{font-weight:600;font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--wp--preset--color--muted)}
.payment-box .payment-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}
@media(min-width:600px){.payment-box{width:fit-content;max-width:100%}.payment-box .payment-chips{display:flex;flex-wrap:wrap}.payment-box .payment-chip{--chip-px:1rem}}
@media(max-width:430px){.payment-box .payment-chip{--chip-px:.5rem;gap:.375rem}.payment-box .payment-epassi{font-size:.75rem}.payment-box .payment-epassi img{height:1.0625rem}}
/* Compact row: label, then four chips of one 2.125rem height; 2x2 under the label on a phone. */
.payment-chips-compact{gap:var(--s2)}
.payment-chips-compact .payment-chip{--chip-h:2.125rem;--chip-px:.75rem;--chip-swish:1.5rem;--chip-icon:1.125rem;--chip-epassi:.9375rem;gap:.375rem;padding-block:.125rem}
.payment-chips-compact .payment-label{margin-right:.25rem}
@media(max-width:599px){.payment-chips-compact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.payment-chips-compact .payment-label{grid-column:1/-1;margin:0}.payment-chips-compact .payment-epassi{font-size:.75rem}}
.payment-gift-link{margin-top:var(--s2)!important;font-size:var(--fs-s)}
.visit-band .payment-label{color:color-mix(in srgb,var(--wp--preset--color--paper) 85%,transparent)}
.visit-band .payment-chip{border-color:transparent}
.visit-band a.payment-chip:focus-visible{outline-color:var(--wp--preset--color--paper)}
.visit-band a:focus-visible{outline-color:var(--wp--preset--color--paper)}

@media(max-width:1050px){
  .main-nav{font-size:.8125rem}
  .main-nav .wp-block-navigation__container{gap:var(--s4)}
  .brand p{font-size:.875rem}
  .brand p strong{font-size:1.3125rem}
  .brand figure,.brand img{width:48px}
  .reading-layout{grid-template-columns:minmax(0,1fr) 16.875rem}
}
/* Opening search condenses the desktop menu to its icons to make room for the
   field; the labels stay available to screen readers. Without :has() the field
   keeps opening over the menu (the base rule above). */
/* The six-item menu becomes the menu button before it would wrap. */
@media(max-width:1120px){
  .main-nav .mobile-booking{display:block}
  .main-nav .wp-block-navigation__responsive-container:not(.is-menu-open){display:none}
  .main-nav .wp-block-navigation__responsive-container-open{display:flex}
  .main-nav.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open{--navigation-layout-justification-setting:flex-start;--navigation-layout-justify:flex-start;padding:var(--s6) var(--gutter);background:var(--wp--preset--color--sage);color:var(--wp--preset--color--forest)}
  .main-nav.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container{gap:var(--s5);align-items:flex-start;font-size:var(--fs-xl)}
  .main-nav.wp-block-navigation:not(.has-background) .is-menu-open .wp-block-navigation-item__content{display:flex;flex-direction:row;align-items:center;gap:var(--s3);padding-inline:0}
  /* A tap must not flash the desktop hover fill (mist) or the tap highlight over the sage menu. */
  .main-nav .is-menu-open .wp-block-navigation-item__content{transition:none;-webkit-tap-highlight-color:transparent}
  .main-nav .is-menu-open .wp-block-navigation-item__content:hover:not([aria-current=page]),.main-nav .is-menu-open .wp-block-navigation-item__content:active:not([aria-current=page]){background:transparent}
  .main-nav .wp-block-navigation-item__content::before{content:'';display:block;flex-shrink:0;width:20px;height:20px;background:var(--wp--preset--color--leaf);mask:var(--menu-icon) center/contain no-repeat;-webkit-mask:var(--menu-icon) center/contain no-repeat}
}
@media(max-width:900px){
  .hero-inner,.about-grid,.qualifications-section .section-inner,.treatment-banner{grid-template-columns:minmax(0,1fr)}
  .treatment-banner{gap:var(--s5)}
  .credentials-grid{grid-column:1;grid-row:auto}
  .qualifications-section .section-inner{row-gap:var(--s6)}
  .about-photo img{aspect-ratio:3/2;object-position:70% 60%}
  .service-grid{grid-auto-columns:min(78%, 22rem)}
}
@media(max-width:780px){
  .reading-content .wp-block-post-content ul:has(li:nth-child(8)){columns:1}
  .post-nav{grid-template-columns:minmax(0,1fr)}
  .post-nav .post-navigation-link-next{grid-column:1;text-align:left}
  .site-header{padding-block:var(--s3)}
  .treatment-photo img{aspect-ratio:16/9!important}
  .header-inner{flex-wrap:nowrap!important}
  .site-header .header-booking{display:none}
  .header-search{order:2;margin-left:auto!important;position:static}
  .main-nav{order:3;margin-left:var(--s2)!important}
  /* Open, the field takes the brand's place in the row instead of floating over the button. */
  .header-inner:has(.header-search:not(.wp-block-search__searchfield-hidden)) .brand{display:none!important}
  .header-search:not(.wp-block-search__searchfield-hidden){flex:1;min-width:0}
  .header-search:not(.wp-block-search__searchfield-hidden) .wp-block-search__input{position:static;translate:none;flex:1;min-width:0;width:auto}
  .brand p{font-size:.8125rem}
  .brand figure,.brand img{width:42px}
  .hero{padding-block:var(--s6) var(--s7)}
  .section-heading{flex-direction:column;gap:var(--s2)}
  .credentials-grid{gap:var(--s4) var(--s3)}
  .credentials-grid figure{flex-basis:6.5rem}
  .credentials-grid img{height:5rem}
  .blog-grid,.treatment-grid{grid-template-columns:minmax(0,1fr)!important}
  /* Homepage Aktuellt on phones: three lines of each excerpt, closer together, so the
     six posts read as a list to choose from rather than six openings to scroll past. */
  .latest-posts .blog-grid{row-gap:var(--s5)!important}
  .latest-posts .blog-grid .wp-block-post-title{font-size:var(--fs-l);margin-bottom:var(--s2)}
  .latest-posts .wp-block-post-excerpt__excerpt{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
  .latest-posts .wp-block-post-excerpt__more-text{margin-top:var(--s2)}
  .visit-inner{flex-direction:column;align-items:flex-start!important}
  .footer-inner{flex-direction:column}
  .footer-brand img{height:60px}
  .footer-note{margin-left:0!important;max-width:100%}
  .reading-layout{grid-template-columns:minmax(0,1fr)}
  .booking-aside{position:static}
  .treatment-nav{position:static;padding:var(--s5) 0 0;border-left:0;border-top:1px solid var(--wp--preset--color--line)}
  .treatment-nav h2{padding-left:0}
  .treatment-nav ul{display:flex;flex-wrap:wrap;gap:var(--s2)}
  .treatment-nav a{border:1px solid var(--wp--preset--color--line);border-radius:999px;padding:.5rem .875rem}
}
/* Where hours and prices live: Bokadirekt. */
.booking-hours,.page-banner p.booking-hours{margin:var(--s3) 0 0;font-size:var(--fs-s)}
.visit-band p+p:not(.payment-chips){margin-top:var(--s2)}
/* A fact only Ingela can supply: unmissable until she does. */
mark.placeholder{background:var(--wp--preset--color--sage);color:var(--wp--preset--color--ink);padding:0 .25em;border:1px dashed var(--wp--preset--color--forest);border-radius:var(--radius)}

/* Lightbox (assets/js/lightbox.js): a native dialog over the page. The photo links work without it. It stays still, like the rest of the site (test_theme.Motion). */
.lightbox-link{display:block;cursor:zoom-in}
html.lightbox-open{overflow:hidden}
dialog.lightbox{box-sizing:border-box;position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgb(18 26 21 / .96);color:#fff;overflow:hidden;touch-action:pan-y pinch-zoom}
dialog.lightbox:not([open]){display:none}
dialog.lightbox[open]{display:flex;align-items:center;justify-content:center}
dialog.lightbox::backdrop{background:transparent}
.lightbox-figure{box-sizing:border-box;margin:0;max-width:100%;max-height:100%;padding:3.5rem var(--s4) var(--s4);display:flex;flex-direction:column;align-items:center;gap:var(--s3)}
.lightbox-image{display:block;max-width:100%;max-height:calc(100vh - 9.5rem);max-height:calc(100dvh - 9.5rem);width:auto;height:auto;object-fit:contain;border-radius:var(--radius);background:rgb(255 255 255 / .06)}
.lightbox-count{pointer-events:none;position:absolute;top:0;left:0;margin:0;padding:1rem 1.25rem;font-size:var(--fs-s);line-height:2.75rem;color:rgb(255 255 255 / .85)}
.lightbox button{position:absolute;display:flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;padding:0;border:0;border-radius:50%;background:rgb(255 255 255 / .14);color:#fff;font:inherit;font-size:1.75rem;line-height:1;cursor:pointer}
@media (hover:hover){.lightbox button:hover{background:rgb(255 255 255 / .28)}}
.lightbox button:focus-visible{outline:3px solid #fff;outline-offset:2px}
.lightbox-close{top:.75rem;right:.75rem}
.lightbox-prev,.lightbox-next{top:50%;margin-top:-1.375rem}
.lightbox-prev{left:.5rem}
.lightbox-next{right:.5rem}
.lightbox[data-single] .lightbox-prev,.lightbox[data-single] .lightbox-next,.lightbox[data-single] .lightbox-count{display:none}
@media (max-width:600px){.lightbox-prev,.lightbox-next{top:auto;bottom:.75rem;margin-top:0}.lightbox-figure{padding-bottom:4.5rem}.lightbox-image{max-height:calc(100vh - 12rem);max-height:calc(100dvh - 12rem)}}
.lightbox-image[data-loading]{opacity:.35}

/* Hover feedback (motion lives in assets/css/motion.css). Colour and shadow states show for everyone; every :hover sits
   in (hover:hover) so touch screens never keep a sticky hover, and each has a :focus-visible twin for the keyboard.
   --link-hover is forest nudged toward leaf: leaf alone is 3.9:1 on white, this stays above 7:1. */
.main-nav .wp-block-navigation-item__content:focus-visible{background:var(--wp--preset--color--mist)}
@media (hover:hover){.wp-block-post-content a:not(.wp-block-button__link):not(.lightbox-link):not(.credential-link):hover,.footer-nav a:hover,.footer-legal a:hover,.post-nav a:hover{color:var(--link-hover)}}
.wp-block-post-content a:not(.wp-block-button__link):not(.lightbox-link):not(.credential-link):focus-visible,.footer-nav a:focus-visible,.footer-legal a:focus-visible,.post-nav a:focus-visible{color:var(--link-hover)}
/* Core sets navigation links to inherit at (0,3,0); the footer needs the same weight to change colour. */
.footer-nav .wp-block-navigation-item__content.wp-block-navigation-item__content:focus-visible{color:var(--link-hover)}
@media (hover:hover){.footer-nav .wp-block-navigation-item__content.wp-block-navigation-item__content:hover{color:var(--link-hover)}}
@media (hover:hover){.footer-social .wp-social-link:hover{color:var(--link-hover)!important}.brand figure a:hover,.footer-brand figure a:hover{opacity:.85}}
.footer-social .wp-social-link:focus-within{color:var(--link-hover)!important}
.gallery-new .gallery-new-photo,.photo-gallery .wp-block-post-content a.lightbox-link{overflow:hidden;border-radius:var(--radius)}

/* Andullationsmassage's video: the site's own still until the visitor clicks (inc/video.php, assets/js/video.js). */
.video-facade{margin:var(--s6) 0}
.video-facade-view{position:relative;aspect-ratio:16/9;overflow:hidden;border:1px solid var(--wp--preset--color--line);border-radius:var(--radius);background:var(--wp--preset--color--mist)}
.video-facade-view img,.video-facade-frame{position:absolute;inset:0;display:block;width:100%;height:100%;border:0;border-radius:0;object-fit:cover}
.video-facade-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:var(--wp--preset--color--white);cursor:pointer}
.video-facade-play[hidden]{display:none}
.video-facade-icon{display:grid;place-items:center;width:4.5rem;height:4.5rem;border-radius:50%;background:var(--wp--preset--color--forest);box-shadow:0 0 0 3px var(--wp--preset--color--white)}
.video-facade-icon::before{content:'';width:1.5rem;height:1.75rem;margin-left:.3rem;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}
@media (hover:hover){.video-facade-play:hover:not(:disabled) .video-facade-icon{background:var(--wp--preset--color--leaf)}}
.video-facade-play:focus-visible{outline:3px solid var(--wp--preset--color--white);outline-offset:-6px;box-shadow:inset 0 0 0 6px var(--wp--preset--color--forest)}
.video-facade-play:disabled{opacity:.55;cursor:not-allowed}
.reading-content .video-facade-caption{margin:var(--s2) 0 0;font-size:var(--fs-s);color:var(--wp--preset--color--muted)}
.reading-content .video-facade-note,.reading-content .video-facade-link{margin:var(--s2) 0 0;font-size:var(--fs-xs);color:var(--wp--preset--color--muted)}
.video-facade-note[hidden]{display:none}

/* Pattern and template links sit outside .wp-block-post-content, so the colour rule above never reached them, and the visit band's own
   underline rule (higher specificity than motion.css's a:hover) pinned the offset. Same hover for them: the light variant on the dark band. */
@media (hover:hover){.visit-band p:not(.payment-chips) a:hover{color:var(--link-hover-light);text-decoration-color:currentColor}.footer-inner .contact-line a:hover,.hero-phone a:hover,.booking-hours a:hover,.about-band p a:hover{color:var(--link-hover)}}
.visit-band p:not(.payment-chips) a:focus-visible{color:var(--link-hover-light);text-decoration-color:currentColor}
.footer-inner .contact-line a:focus-visible,.hero-phone a:focus-visible,.booking-hours a:focus-visible,.about-band p a:focus-visible{color:var(--link-hover)}
