/* avorasystems.se: shared styles for the home page, industry pages, info pages and the help center.

   The look is built from the product itself (the request card, the Swedish number plate, the SMS) on a warm grey
   ground with Avora's navy and sky blue. No glows, gradients or floating decoration: what moves on the page is a
   call being played, a day of calls, or a request coming in. */

/* Familjen Grotesk (headings) and IBM Plex Sans and Mono (text, times and numbers), SIL Open Font License
   (fonts/FAMILJEN-GROTESK-LICENSE.txt, fonts/IBM-PLEX-LICENSE.txt), served from our own server: no requests to Google.
   IBM Plex Sans is also "Avora Sans", so the chat widget uses it on our own pages. */
@font-face{font-family:"Familjen Grotesk";src:url("/assets/fonts/familjen-grotesk.woff2") format("woff2");font-weight:400 700;font-display:swap;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:"IBM Plex Sans";src:url("/assets/fonts/ibm-plex-sans.woff2") format("woff2");font-weight:400 600;font-display:swap;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:"Avora Sans";src:url("/assets/fonts/ibm-plex-sans.woff2") format("woff2");font-weight:400 600;font-display:swap;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:"IBM Plex Mono";src:url("/assets/fonts/ibm-plex-mono-400.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:"IBM Plex Mono";src:url("/assets/fonts/ibm-plex-mono-500.woff2") format("woff2");font-weight:500 600;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F}

:root{
  --ink:#14233d;--navy:#182b49;--navy-2:#22395e;--muted:#46536a;--soft:#5b6678;--line:#dcd9d1;--line-2:#cdc9bf;
  --paper:#f4f3ef;--alt:#ebe9e3;--card:#fff;--well:#f7f6f2;
  --sky:#b9ddf4;--sky-2:#e4f1fb;--sky-3:#8fc6ec;--ava:#d9ecf9;
  --ok:#17845b;--ok-bg:#e3f5ec;--urgent:#9a3412;--urgent-bg:#fbeae2;--warn:#9a5b0f;
  --on-navy:#c9d4e3;
  --radius:16px;--radius-lg:22px;
  --shadow:0 1px 2px rgba(20,35,61,.06),0 8px 24px rgba(20,35,61,.07);
  --shadow-lg:0 2px 6px rgba(20,35,61,.06),0 24px 56px rgba(20,35,61,.14);
  --display:"Familjen Grotesk","IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --sans:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--sans);overflow-wrap:break-word;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4{margin:0;font-family:var(--display);line-height:1.08;letter-spacing:-.015em;font-weight:700;text-wrap:balance}
h3,h4{font-weight:600;letter-spacing:-.01em;line-height:1.2}
p{margin:0;text-wrap:pretty}
.wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.skip{position:absolute;left:-999px;top:8px;background:var(--navy);color:#fff;padding:10px 16px;border-radius:10px;z-index:100}
.skip:focus{left:12px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid #2f6d9c;outline-offset:2px;border-radius:6px}
.trust :focus-visible,.facts-band :focus-visible{outline-color:var(--sky)}
.clock,.day b,.sc-time{font-variant-numeric:tabular-nums}

/* buttons and links */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 20px;border-radius:12px;border:1.5px solid var(--navy);background:var(--navy);color:#fff;font-weight:600;font-size:16px;text-decoration:none;line-height:1.2;white-space:nowrap;transition:background .15s ease,border-color .15s ease,transform .1s ease}
.btn:hover{background:var(--navy-2);border-color:var(--navy-2)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.btn svg{width:18px;height:18px;flex:none}
.btn-lg{min-height:54px;padding:14px 24px;font-size:17px}
.btn-sm{min-height:40px;padding:8px 14px;font-size:15px}
.btn-light{background:#fff;color:var(--navy);border-color:var(--line-2)}
.btn-light:hover{background:var(--sky-2);border-color:var(--navy)}
.btn-sky{background:var(--sky);border-color:var(--sky);color:var(--navy)}
.btn-sky:hover{background:#cbe7f8;border-color:#cbe7f8}
.btn-ghost{background:transparent;border-color:rgba(185,221,244,.5);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.1)}
.link{font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.link:hover{text-decoration-thickness:2px}
.link-btn{background:none;border:0;padding:0;font:inherit;font-weight:600;color:var(--navy);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;cursor:pointer}

/* header */
.site-header{position:sticky;top:0;z-index:40;background:rgba(244,243,239,.96);border-bottom:1px solid transparent;transition:border-color .2s}
.site-header.scrolled{border-bottom-color:var(--line)}
.nav{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;height:72px}
.brand{display:inline-flex;align-items:center;flex:none}
.brand img{width:136px}
.nav-links{display:flex;align-items:center;gap:26px;font-size:15.5px;font-weight:500}
.nav-links a{text-decoration:none;color:var(--muted)}
.nav-links a:hover{color:var(--ink)}
.nav-links .hide-lg{display:none}
.nav-cta{display:flex;align-items:center;gap:10px}
.nav-cta .login{font-size:15.5px;font-weight:600;text-decoration:none;padding:8px 10px;color:var(--ink)}
.menu-btn{display:none;border:1px solid var(--line-2);background:#fff;border-radius:12px;width:44px;height:44px;align-items:center;justify-content:center;color:var(--ink)}
.menu-btn svg{width:20px;height:20px}
.nav-drop{position:relative}
.nav-drop-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:0;padding:0;font:inherit;color:var(--muted)}
.nav-drop-btn:hover,.nav-drop-btn[aria-expanded="true"]{color:var(--ink)}
.nav-drop-btn svg{width:16px;height:16px;transition:transform .2s}
.nav-drop-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav-drop-btn[hidden]{display:none}
.nav-drop-list{position:absolute;top:calc(100% + 16px);left:-14px;min-width:270px;display:grid;gap:2px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-lg);z-index:5}
.nav-drop-list[hidden]{display:none}
.nav-drop-list a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;color:var(--ink)}
.nav-drop-list a:hover{background:var(--paper)}
.nav-drop-list svg{width:18px;height:18px;color:var(--navy);flex:none}

/* sections */
.section{padding:96px 0}
.section.alt{background:var(--alt)}
.section-head{max-width:760px;margin-bottom:40px}
.section h2{font-size:clamp(30px,3.4vw,46px)}
.sub{font-size:18.5px;line-height:1.6;color:var(--muted);max-width:44em}
.section-head .sub,h2+.sub{margin-top:14px}
.kicker{font-size:15px;font-weight:600;color:var(--muted);margin-bottom:10px}

/* hero */
.hero{padding:56px 0 80px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:56px;align-items:center}
.hero h1{font-size:clamp(40px,5.2vw,72px);line-height:1.02;letter-spacing:-.02em}
.hero-for{font-size:15.5px;font-weight:600;color:var(--muted);margin-bottom:14px}
.lead{font-size:19.5px;line-height:1.6;color:var(--muted);max-width:34em;margin-top:22px}
.lead strong{color:var(--ink);font-weight:600}
.partner-offer{margin:18px 0 0;padding:12px 16px;border-radius:14px;background:var(--sky-2);color:var(--ink);font-size:16px;max-width:560px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero-note{font-size:15px;color:var(--soft);margin-top:16px;max-width:34em}

/* the hero scene: one call to a made-up company in three cards (no voice on the website, Ava is heard on the meeting) */
.scene{position:relative;min-width:0}
.sc-stack{display:grid;gap:12px}
.sc-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 18px;box-shadow:var(--shadow)}
.sc-call{width:86%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:2px 14px;align-items:center}
.sc-ring{position:relative;width:44px;height:44px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center}
.sc-ring svg{width:20px;height:20px}
.scene .only-chat,.scene[data-mode="chat"] .only-phone{display:none}
.scene[data-mode="chat"] .only-chat{display:block}
.scene.ringing .sc-ring{animation:ring 1.3s ease-out infinite}
.sc-who{min-width:0}
.sc-who b{display:block;font-weight:600;font-size:16px;line-height:1.3}
.sc-who span{display:block;font-size:14.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sc-time{font-family:var(--mono);font-size:14px;color:var(--soft)}
.sc-state{grid-column:1/-1;margin-top:10px;font-size:14.5px;color:var(--muted)}
.sc-state b{font-family:var(--mono);font-weight:500;color:var(--ink)}
.sc-talk{width:92%;margin-left:auto;background:var(--ava);border-color:#c4def2;box-shadow:none}
.sc-lines{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;height:216px;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 34px);mask-image:linear-gradient(to bottom,transparent 0,#000 34px)}
.sc-lines li{display:grid;grid-template-columns:52px minmax(0,1fr);gap:10px;font-size:15px;line-height:1.45;flex:none}
.sc-lines li b{font-family:var(--mono);font-size:12px;font-weight:500;color:#33496a;padding-top:3px}
.sc-lines li.ava span{color:var(--ink)}
.sc-lines li.you span{color:var(--navy);font-weight:500}
.sc-lines li.pending{display:none}
.sc-lines li.pop{animation:pop .35s ease both}
.sc-lines li.typing span{display:inline-flex;gap:4px;padding-top:8px}
.sc-lines li.typing i{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.35;animation:blink 1s infinite}
.sc-lines li.typing i:nth-child(2){animation-delay:.15s}
.sc-lines li.typing i:nth-child(3){animation-delay:.3s}
.sc-out{position:relative;width:90%;box-shadow:var(--shadow-lg)}
/* while the call plays, the empty card says what is coming */
.sc-out:has(.tk-top.wait):after{content:"Ärendet kommer hit när samtalet är klart.";position:absolute;left:18px;right:18px;top:50%;margin-top:-10px;text-align:center;font-size:14px;color:var(--soft)}
.sc-label{font-family:var(--mono);font-size:12.5px;color:var(--soft);margin-bottom:8px}
.scene-foot{margin-top:16px;font-size:14px;color:var(--soft)}
.scene-foot .link{color:var(--muted)}
/* the parts of the scene that wait for their turn while it plays */
.sc-lines li,.ticket .tk-top,.ticket .tk-title,.ticket .tk-rows>div,.ticket .tk-sms{transition:opacity .35s ease,transform .35s ease}
.scene .wait{opacity:0;transform:translateY(6px);transition:none}

/* the request card in the hero */
.ticket{min-width:0}
.tk-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.tk-badge{display:inline-flex;align-items:center;font-size:13px;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--sky-2);color:var(--navy)}
.tk-badge.urgent{background:var(--urgent);color:#fff}
.tk-badge.offer{background:var(--navy);color:#fff}
.tk-when{font-family:var(--mono);font-size:12.5px;color:var(--soft)}
.tk-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px;margin-top:10px}
.tk-title b{font-family:var(--display);font-size:24px;font-weight:700;line-height:1.15;letter-spacing:-.01em}
.plate{display:inline-flex;align-items:stretch;flex:none;border:1.5px solid #1b1b1b;border-radius:5px;overflow:hidden;background:#fff;font-family:var(--mono);font-weight:600;line-height:1.2}
.plate[hidden]{display:none}
.plate i{display:flex;align-items:flex-end;padding:0 4px 2px;background:#1f4bb4;color:#fff;font-size:9px;font-style:normal}
.plate span{padding:3px 8px;font-size:16px;letter-spacing:.06em;color:#111}
.tk-rows{margin:10px 0 0}
.tk-rows>div{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-top:1px solid #ecebe6;font-size:15px}
.tk-rows dt{color:var(--soft)}
.tk-rows dd{margin:0;font-weight:600;text-align:right}
.tk-sms{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:14px;font-weight:600;color:var(--ok)}
.tk-sms svg{width:16px;height:16px;flex:none}

/* the facts band under the hero */
.facts-band{background:var(--navy);color:#fff;padding:32px 0}
.fb-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.fb-grid li{display:flex;gap:12px}
.fb-grid svg{width:20px;height:20px;color:var(--sky);flex:none;margin-top:3px}
.fb-grid strong{display:block;font-size:16.5px;font-weight:600}
.fb-grid span{display:block;font-size:15px;color:var(--on-navy);margin-top:2px}

/* the industry links under the day */
.ind-links{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:24px}
.ind-links p{width:100%;font-weight:600;margin-bottom:4px}
.ind-link{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 14px 0 12px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:15px;font-weight:600;color:var(--ink);text-decoration:none;transition:border-color .15s}
.ind-link:hover{border-color:var(--navy)}
.ind-link svg{width:17px;height:17px;color:var(--navy);flex:none}

/* "Så funkar det": three short steps */
.how{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.how li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:16px;align-items:start}
.how-ic{width:48px;height:48px;border-radius:14px;background:var(--sky-2);color:var(--navy);display:flex;align-items:center;justify-content:center}
.how-ic svg{width:22px;height:22px}
.how h3{font-size:21px}
.how p{color:var(--muted);margin-top:6px}

/* lists with a tick */
.ticks{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px}
.ticks li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;align-items:start}
.ticks svg{width:20px;height:20px;color:var(--ok);margin-top:3px}

/* security */
.trust{background:var(--navy);color:#fff}
.trust h2{color:#fff}
.trust .sub{color:var(--on-navy);margin-top:16px}
.trust .link{display:inline-block;margin-top:18px;color:#fff}
.trust-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}
.facts{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.facts li{display:flex;gap:14px;padding:18px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(185,221,244,.22)}
.facts svg{width:22px;height:22px;color:var(--sky);flex:none;margin-top:2px}
.facts strong{display:block;font-weight:600}
.facts span{display:block;color:var(--on-navy);font-size:15px;margin-top:2px}

/* industry pages: common calls */
.calls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.call-card{padding:22px;background:#fff;border:1px solid var(--line);border-radius:18px}
.call-card h3{font-size:20px}
.call-card p{color:var(--muted);margin-top:8px;font-size:16px}

/* Avora Hub: a real screenshot (a made-up workshop), the phone's view on small screens */
.hub-shot{margin:0}
.hub-shot img{display:block;width:100%;height:auto;border-radius:16px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow-lg)}
.hub-shot figcaption{margin-top:12px;font-size:14px;color:var(--soft)}
.hub-chat{margin-top:22px;color:var(--muted)}

/* customer quotes (only real customers), the offer to the first customers, prices once published */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:16px}
.quote{margin:0;display:flex;flex-direction:column;gap:16px;padding:24px;background:#fff;border:1px solid var(--line);border-radius:18px}
.quote blockquote{margin:0}
.quote blockquote p{font-size:18px;line-height:1.55}
.quote figcaption{margin-top:auto;font-size:14.5px}
.quote figcaption span{display:block;color:var(--muted)}
.quote-figure{align-self:flex-start;padding:4px 12px;border-radius:999px;background:var(--sky-2);color:var(--navy);font-size:14px;font-weight:600}
.price-model{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:32px;padding:28px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg)}
.price-model .ticks{margin-top:0}
.pm-side{display:grid;gap:12px;justify-items:start;align-content:start}
.pm-side p{color:var(--muted)}
.pricing{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.plan{display:grid;gap:10px;align-content:start;padding:24px;background:#fff;border:1px solid var(--line);border-radius:18px}
.plan.featured{border-color:var(--navy)}
.plan-desc{color:var(--muted)}
.price{font-family:var(--display);font-size:32px;font-weight:700}
.price small{font-size:16px;font-weight:500;color:var(--muted)}
.price-terms{justify-content:center;margin-top:24px}
.price-note{margin-top:14px;color:var(--soft);font-size:14px}
.badge{justify-self:start;font-size:13px;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--sky-2);color:var(--navy)}

/* faq */
.faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;align-items:start}
.faq>div:first-child{position:sticky;top:96px}
.faq .sub{margin-top:14px}
.faq details,.faq-list details{border-bottom:1px solid var(--line-2)}
.faq summary,.faq-list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 0;font-weight:600;font-size:18px}
.faq summary::-webkit-details-marker,.faq-list summary::-webkit-details-marker{display:none}
.faq summary:after,.faq-list summary:after{content:"+";flex:none;font-family:var(--mono);font-size:24px;font-weight:400;line-height:1;color:var(--soft);transition:transform .2s}
.faq details[open] summary:after,.faq-list details[open] summary:after{transform:rotate(45deg)}
.faq details p,.faq-list details p{padding:0 0 20px;color:var(--muted);max-width:60ch}

/* booking: the day picker (times from Calendly through our server) and "Ring upp mig" side by side */
.booking-section{background:var(--alt)}
.booking-head{margin-bottom:28px}
.next-steps{list-style:none;margin:20px 0 0;padding:0;counter-reset:ns;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.next-steps li{counter-increment:ns;display:grid;grid-template-columns:30px minmax(0,1fr);gap:2px 12px;padding:14px 16px;border-radius:14px;background:#fff;border:1px solid var(--line)}
.next-steps li:before{content:counter(ns);grid-row:1/3;width:30px;height:30px;border-radius:9px;background:var(--navy);color:#fff;font-family:var(--mono);font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:center}
.next-steps b{font-weight:600}
.next-steps span{font-size:14.5px;color:var(--muted)}
.booking{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,.68fr);gap:20px;align-items:stretch}
.booking-box{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}
.booking-box iframe{width:100%;height:680px;border:0;display:block;animation:pop .45s ease both}
.picker{flex:1;display:grid;gap:16px;align-content:start;padding:26px}
.picker-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.picker-head h3{font-size:22px}
.picker-head p{color:var(--muted);font-size:15px;margin-top:4px}
.picker-nav{display:flex;gap:8px}
.round-sm{width:44px;height:44px;border-radius:12px;border:1px solid var(--line-2);background:#fff;color:var(--navy);display:inline-flex;align-items:center;justify-content:center;transition:background .15s}
.round-sm svg{width:18px;height:18px}
.round-sm:first-child svg{transform:rotate(180deg)}
.round-sm:hover:not([disabled]){background:var(--sky-2)}
.round-sm[disabled]{opacity:.35;cursor:default}
.picker-month{font-family:var(--mono);font-size:13px;color:var(--soft)}
.days{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.day{position:relative;display:grid;justify-items:center;gap:2px;padding:14px 6px 12px;border-radius:14px;border:1px solid var(--line-2);background:#fff;transition:transform .15s,border-color .15s,background .15s}
.day small{font-size:13px;font-weight:600;color:var(--soft)}
.day b{font-family:var(--display);font-size:26px;line-height:1.05}
.day span{font-size:12.5px;color:var(--muted)}
.day:hover{transform:translateY(-2px);border-color:var(--navy)}
.day.today:after{content:"Idag";position:absolute;top:-9px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:600;background:var(--sky);color:var(--navy);border-radius:999px;padding:2px 8px}
.day[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.day[aria-pressed="true"] small,.day[aria-pressed="true"] span{color:#c9d4e3}
.day.full{opacity:.45;cursor:default}
.day.full:hover{transform:none;border-color:var(--line-2)}
.day .free{font-size:11.5px;font-weight:600;color:var(--ok)}
.day[aria-pressed="true"] .free{color:#9fe3c2}
.picker-fine{font-size:13px;color:var(--soft)}
.picker-fine .link{color:var(--muted)}
.cal-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);background:#fff;font-size:15px}
.cal-bar button{display:inline-flex;align-items:center;gap:8px;background:none;border:0;padding:6px 0;font-weight:600;color:var(--navy)}
.cal-bar button svg{width:16px;height:16px;transform:rotate(180deg)}
.cal-bar span{color:var(--muted);font-weight:600}
.slots{display:grid;gap:14px;padding:22px 26px 26px;animation:pop .35s ease both}
.slots h4{font-size:17px}
.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}
.slot{min-height:48px;border-radius:12px;border:1px solid var(--line-2);background:#fff;font-family:var(--mono);font-weight:500;font-size:16px;color:var(--navy);transition:transform .15s,border-color .15s}
.slot:hover{border-color:var(--navy);transform:translateY(-2px)}
.bk-form{display:grid;gap:12px;padding:22px 26px 26px;animation:pop .35s ease both}
.bk-when{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;background:var(--sky-2);font-weight:600;color:var(--navy)}
.bk-when svg{width:18px;height:18px;flex:none}
.bk-form .cb-field small.hint{font-size:12.5px;font-weight:400;color:var(--muted)}
.booked{display:grid;gap:12px;justify-items:start;padding:34px 30px;animation:pop .5s ease both}
.booked-mark{width:56px;height:56px;border-radius:50%;background:var(--ok);color:#fff;display:flex;align-items:center;justify-content:center}
.booked-mark svg{width:28px;height:28px}
.booked h3{font-size:26px}
.booked p{color:var(--muted)}
.booked ol{margin:4px 0;padding-left:20px;display:grid;gap:8px}

/* "Ring upp mig": the form in the booking section and the panel */
.cb-card{padding:26px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg)}
.cb-card h3{margin-top:12px;font-size:22px}
.cb-lead{margin-top:6px;font-size:15px;color:var(--muted)}
.cb-status{display:inline-flex;align-items:center;gap:8px;padding:4px 12px 4px 10px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--muted)}
.cb-dot{width:8px;height:8px;border-radius:50%;background:#c3ccd8;flex:none}
[data-cb="open"] .cb-dot{background:#2fbf7b;box-shadow:0 0 0 3px var(--ok-bg)}
[data-cb="closed"] .cb-dot{background:var(--sky-3);box-shadow:0 0 0 3px var(--sky-2)}
.cb-form{display:grid;gap:12px;margin-top:16px}
.cb-field{display:grid;gap:6px;min-width:0}
.cb-field label{font-size:14px;font-weight:600}
.cb-field label small{font-size:13px;font-weight:400;color:var(--muted)}
.cb-field input,.cb-field select{width:100%;min-width:0;height:48px;padding:0 14px;border:1px solid var(--line-2);border-radius:12px;background:#fff;font-size:16px;color:var(--ink);transition:border-color .15s,box-shadow .15s}
.cb-field select{padding-right:8px}
.cb-field input::placeholder{color:#8f97a4}
.cb-field input:focus,.cb-field select:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px rgba(143,198,236,.45)}
.cb-field input[aria-invalid="true"]{border-color:#b42318;box-shadow:0 0 0 3px rgba(180,35,24,.12)}
.cb-err{font-size:13.5px;font-weight:600;color:#b42318}
.cb-err:empty{display:none}
.cb-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cb-hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.cb-send{width:100%;margin-top:2px}
.cb-send.busy{opacity:.75;cursor:progress}
.cb-msg{font-size:14px;font-weight:600;color:var(--muted)}
.cb-msg:empty{display:none}
.cb-msg.err{color:#b42318}
.cb-msg a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.cb-fine{font-size:13px;line-height:1.5;color:var(--muted)}
.cb-fine a{color:var(--ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.cb-done{display:grid;gap:10px;justify-items:start;margin-top:16px;animation:pop .45s ease both}
.cb-done:focus{outline:none}
.cb-done h3{margin:0;font-size:24px}
.cb-done p{color:var(--muted)}
.cb-done-mark{width:52px;height:52px;border-radius:50%;background:var(--ok);color:#fff;display:flex;align-items:center;justify-content:center}
.cb-done-mark svg{width:26px;height:26px}

.sticky-bar,.cb-panel{visibility:hidden;opacity:0;transform:translateY(16px);transition:opacity .3s ease,transform .3s cubic-bezier(.2,.8,.2,1),visibility 0s linear .3s}
.sticky-bar.show,.cb-panel.show{visibility:visible;opacity:1;transform:none;transition:opacity .3s ease,transform .3s cubic-bezier(.2,.8,.2,1),visibility 0s}
.sticky-bar[hidden],.cb-panel[hidden]{display:none}
.sticky-bar{display:none}
.cb-panel{position:fixed;z-index:55;left:24px;bottom:24px;width:390px;max-width:calc(100vw - 48px);max-height:calc(100vh - 110px);max-height:calc(100dvh - 110px);overflow:auto;overscroll-behavior:contain;padding:20px 22px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:0 30px 80px rgba(13,27,44,.3)}
.cb-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.cb-panel h2{margin-top:10px;font-size:23px}
.cb-close{width:40px;height:40px;flex:none;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--navy);display:flex;align-items:center;justify-content:center}
.cb-close:hover{background:var(--sky-2)}
.cb-close svg{width:16px;height:16px}
.sb-close{flex:none;width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--muted);display:flex;align-items:center;justify-content:center}
.sb-close svg{width:15px;height:15px}
.avora-chat-open .sticky-bar,.avora-chat-open .cb-panel{display:none}

/* footer */
.site-footer{padding:56px 0 40px;border-top:1px solid var(--line);background:var(--paper)}
.foot{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:32px}
.foot h4{font-family:var(--sans);font-size:15px;font-weight:600;margin-bottom:12px}
.foot ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;font-size:15px}
.foot a{text-decoration:none;color:var(--muted)}
.foot a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.foot p{color:var(--muted);font-size:15px;margin-top:14px;max-width:30em}
.foot .brand img{width:128px}
.foot-contact{margin-top:14px!important}
.foot .foot-social{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-weight:600;color:var(--ink)}
.foot-social svg{width:18px;height:18px;flex:none}
.legal{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:36px;padding-top:20px;border-top:1px solid var(--line);font-size:14px;color:var(--soft)}

/* info pages (security, privacy, terms, comparison, 404) */
.page-hero{padding:56px 0 20px}
.page-hero h1{font-size:clamp(34px,4.4vw,52px);max-width:20ch}
.page-hero p{margin-top:16px;font-size:19px;color:var(--muted);max-width:40em}
.page-hero .hero-ctas{margin-top:26px}
.prose{max-width:760px;padding:24px 0 80px}
.prose h2{font-size:28px;margin:44px 0 14px;scroll-margin-top:96px}
.prose h3{font-size:20px;margin:26px 0 8px}
.prose p,.prose li{color:#33425a;font-size:17px}
.prose p+p{margin-top:12px}
.prose ul{padding-left:22px;display:grid;gap:8px}
.prose ol{padding-left:22px;display:grid;gap:8px}
.card{padding:22px;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
.prose .card{margin:18px 0}
.prose .card h3{margin-top:0;margin-bottom:12px}
.prose dl{display:grid;grid-template-columns:150px 1fr;gap:8px 18px;margin:0}
.prose dt{font-weight:600;color:var(--ink)}
.prose dd{margin:0;color:#33425a}
.updated,.prose .updated{font-size:14px;color:var(--soft)}
.terms .terms-short{background:var(--navy);border-color:var(--navy);color:#fff;padding:24px 26px}
.terms .terms-short h2{margin:0 0 12px;font-size:21px;color:#fff}
.terms .terms-short li{color:#dfe9f4}
.terms-toc{margin:26px 0 6px;padding:18px 22px;background:#fff;border:1px solid var(--line);border-radius:18px}
.prose .terms-toc ol{display:block;margin:0;padding-left:24px;columns:2;column-gap:36px;font-size:15.5px}
.terms-toc li{break-inside:avoid;padding:3px 0;color:var(--soft)}
.terms-toc a{color:var(--ink);text-decoration:none}
.terms-toc a:hover{color:#2f6fae;text-decoration:underline}
.terms-end{margin-top:40px;padding-top:22px;border-top:1px solid var(--line)}
.prose .faq-list{border-top:1px solid var(--line-2)}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:18px;max-width:1000px;margin:4px 0 8px}
.person{display:flex;gap:16px;padding:20px;background:#fff;border:1px solid var(--line);border-radius:18px}
.face{width:72px;height:72px;flex:none;border-radius:50%;overflow:hidden;background:var(--sky-2);color:var(--navy);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-size:28px;font-weight:700}
.face img{width:100%;height:100%;object-fit:cover}
.person strong{display:block}
.person small{display:block;color:var(--muted)}
.person p{margin-top:8px;color:var(--muted);font-size:15.5px}
.prose .table-wrap{overflow-x:auto;margin:14px 0 20px;border:1px solid var(--line);border-radius:14px;background:#fff}
.terms-table{border-collapse:collapse;width:100%;min-width:560px;font-size:15px;line-height:1.55}
.terms-table th,.terms-table td{text-align:left;vertical-align:top;padding:12px 16px;border-bottom:1px solid var(--line);color:#33425a}
.terms-table tr:last-child th,.terms-table tr:last-child td{border-bottom:0}
.terms-table th{color:var(--ink);font-weight:600}
.terms-table thead th{font-size:13px;color:var(--soft);font-weight:600}
.terms-table.rows{min-width:0}
.terms-table.rows th{width:170px}

/* ---------------------------------------------------------------- help center (/hjalp) */
.hc-hero{position:relative;z-index:3;padding:64px 0 56px;text-align:center}
.hc-hero .aurora{display:none}
body.hc-page{overflow-x:hidden}
.hc-hero>.wrap{position:relative;z-index:1;display:grid;justify-items:center}
.hc-hero h1{font-size:clamp(36px,4.6vw,56px);margin:6px 0 14px}
.hc-hero .lead{max-width:34em;margin:0 auto}
.hc-quick{margin-top:16px;font-size:14.5px;color:var(--muted)}
.hc-quick a{color:var(--navy);font-weight:600;text-underline-offset:3px}
.hc-search{position:relative;width:100%;max-width:640px;margin:26px auto 0;text-align:left}
.hc-search>svg{position:absolute;left:18px;top:50%;width:20px;height:20px;margin-top:-10px;color:var(--soft);pointer-events:none}
.hc-search input{width:100%;height:58px;padding:0 54px 0 50px;border-radius:16px;border:1px solid var(--line-2);background:#fff;font-size:17px;box-shadow:var(--shadow);transition:border-color .2s,box-shadow .2s}
.hc-search input:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px rgba(143,198,236,.35)}
.hc-search kbd{position:absolute;right:16px;top:50%;margin-top:-13px;height:26px;min-width:26px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:7px;font:500 13px/1 var(--mono);color:var(--soft);background:var(--paper)}
.hc-search:not(.big){margin:0 0 18px}
.hc-search:not(.big) input{height:46px;border-radius:12px;font-size:15px;padding-left:44px;box-shadow:none}
.hc-search:not(.big)>svg{left:15px;width:17px;height:17px;margin-top:-8.5px}
.hc-search:not(.big) kbd{display:none}
.hc-results{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 8px);list-style:none;margin:0;padding:8px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-lg);max-height:min(460px,60vh);overflow:auto}
.hc-results li a{display:grid;gap:2px;padding:11px 13px;border-radius:10px;text-decoration:none}
.hc-results li a small{font-size:12.5px;font-weight:600;color:var(--soft)}
.hc-results li a b{font-size:15.5px}
.hc-results li a span{font-size:13.5px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hc-results li a mark{background:rgba(143,198,236,.45);color:inherit;border-radius:3px;padding:0 1px}
.hc-results li[aria-selected="true"] a,.hc-results li a:hover{background:var(--sky-2)}
.hc-results .hc-empty{padding:16px 14px;color:var(--muted);font-size:14.5px}
.hc-results .hc-empty button{background:none;border:0;padding:0;font-weight:600;color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.hc-chapters{padding-top:24px}
.hc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.hc-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;transition:border-color .2s,transform .2s}
.hc-card:hover{border-color:var(--navy);transform:translateY(-2px)}
.hc-card-head{display:flex;gap:14px;align-items:flex-start;text-decoration:none;margin-bottom:14px}
.hc-card-head b{display:block;font-size:18px}
.hc-card-head small{display:block;color:var(--muted);font-size:14px;line-height:1.45;margin-top:3px}
.hc-ic{width:46px;height:46px;flex:none;border-radius:12px;background:var(--sky-2);color:var(--navy);display:flex;align-items:center;justify-content:center}
.hc-ic svg{width:22px;height:22px}
.hc-ic.big{width:60px;height:60px;border-radius:16px}.hc-ic.big svg{width:28px;height:28px}
.hc-card ul{list-style:none;margin:0;padding:10px 0 0;display:grid;gap:2px;border-top:1px solid var(--line)}
.hc-card li a{display:block;padding:7px 0;font-size:15px;text-decoration:none;color:var(--ink)}
.hc-card li a:hover{color:#2f6fae}
.hc-more{margin-top:auto;padding-top:12px;display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14px;color:var(--navy);text-decoration:none}
.hc-more svg{width:15px;height:15px;transition:transform .2s}.hc-more:hover svg{transform:translateX(3px)}
.hc-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:48px;padding-top:36px;padding-bottom:80px;align-items:start}
.hc-layout.with-toc{grid-template-columns:260px minmax(0,1fr) 200px}
.hc-aside{position:sticky;top:96px;max-height:calc(100vh - 116px);overflow:auto;padding-bottom:12px}
.hc-group{border-radius:12px}
.hc-group summary{list-style:none;display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;font-weight:600;font-size:14.5px;cursor:pointer}
.hc-group summary::-webkit-details-marker{display:none}
.hc-group summary:hover{background:#fff}
.hc-group summary svg{width:17px;height:17px;color:var(--navy)}
.hc-group summary:after{content:"";margin-left:auto;width:7px;height:7px;border-right:2px solid var(--soft);border-bottom:2px solid var(--soft);transform:rotate(-45deg);transition:transform .2s}
.hc-group[open] summary:after{transform:rotate(45deg)}
.hc-group ul{list-style:none;margin:2px 0 8px 18px;padding:0 0 0 20px;border-left:1px solid var(--line)}
.hc-group li a{display:block;padding:6px 10px;border-radius:8px;font-size:14px;color:var(--muted);text-decoration:none;line-height:1.35}
.hc-group li a:hover{color:var(--ink);background:#fff}
.hc-group li a[aria-current="page"]{color:var(--navy);font-weight:600;background:var(--sky-2)}
.hc-crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--soft);margin-bottom:18px}
.hc-crumbs a{color:var(--muted);text-decoration:none}.hc-crumbs a:hover{color:var(--ink)}
.hc-chapter-head{display:flex;gap:18px;align-items:center;margin-bottom:26px}
.hc-chapter-head h1{font-size:clamp(30px,3.4vw,42px)}
.hc-chapter-head .lead{margin-top:6px}
.hc-list{display:grid;gap:10px}
.hc-row{display:flex;align-items:center;gap:16px;padding:18px 20px;background:#fff;border:1px solid var(--line);border-radius:16px;text-decoration:none;transition:border-color .2s,transform .2s}
.hc-row:hover{border-color:var(--navy);transform:translateY(-2px)}
.hc-row>span:first-child{flex:1;display:grid;gap:3px}
.hc-row b{font-size:17px}.hc-row small{color:var(--muted);font-size:14.5px;line-height:1.45}
.hc-min{font-family:var(--mono);font-size:13px;color:var(--soft);white-space:nowrap}
.hc-go{width:18px;height:18px;color:var(--soft);transition:transform .2s,color .2s}
.hc-row:hover .hc-go{transform:translateX(4px);color:var(--navy)}
.hc-article h1{font-size:clamp(30px,3.6vw,44px)}
.hc-article .lead{margin-top:12px}
.hc-meta{display:flex;align-items:center;gap:6px;margin-top:12px;font-size:13.5px;color:var(--soft)}
.hc-meta svg{width:15px;height:15px}
.hc-body{margin-top:26px;font-size:17px;line-height:1.7;color:#2c3b55}
.hc-body h2{font-size:25px;margin:40px 0 12px;scroll-margin-top:96px;color:var(--ink)}
.hc-body h3{font-size:19px;margin:28px 0 8px;scroll-margin-top:96px;color:var(--ink)}
.hc-body p{margin:12px 0}
.hc-body a{color:#2f6fae;font-weight:600;text-underline-offset:3px}
.hc-body ul{padding-left:22px;margin:12px 0;display:grid;gap:6px}
.hc-body code{font:500 .88em var(--mono);background:var(--sky-2);color:var(--navy);padding:2px 6px;border-radius:6px}
.hc-body pre{background:var(--navy);color:#e3edf7;padding:16px 18px;border-radius:14px;overflow:auto;font-size:14px;line-height:1.55}
.hc-body pre code{background:none;color:inherit;padding:0;font-weight:400}
.hc-body ol.steps{list-style:none;counter-reset:hcstep;padding:0;margin:18px 0;display:grid;gap:14px;border:0}
.hc-body ol.steps>li{counter-increment:hcstep;position:relative;padding:2px 0 0 48px;min-height:34px}
.hc-body ol.steps>li:before{content:counter(hcstep);position:absolute;left:0;top:0;width:32px;height:32px;border-radius:10px;background:var(--navy);color:#fff;font-family:var(--mono);font-weight:500;font-size:15px;display:flex;align-items:center;justify-content:center}
.hc-body ol.steps>li:not(:last-child):after{content:"";position:absolute;left:15px;top:36px;bottom:-12px;width:2px;background:var(--line)}
.hc-body .callout{margin:18px 0;padding:14px 16px 14px 18px;border-radius:14px;border:1px solid #c4def2;background:var(--sky-2);font-size:16px;line-height:1.6}
.hc-body .callout.tip{border-color:#bfe3cf;background:var(--ok-bg)}
.hc-body .callout.warn{border-color:#efd3a6;background:#fdf3e2}
.hc-body .callout strong:first-child{margin-right:4px}
.table-scroll{overflow-x:auto;margin:16px 0;border:1px solid var(--line);border-radius:14px;background:#fff}
.hc-body table{width:100%;border-collapse:collapse;font-size:15px}
.hc-body th,.hc-body td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.hc-body th{background:var(--well);font-size:13.5px;color:var(--muted)}
.hc-body tr:last-child td{border-bottom:0}
.hc-toc{position:sticky;top:96px;font-size:14px}
.hc-toc p{font-size:13px;font-weight:600;color:var(--soft);margin-bottom:10px}
.hc-toc ol{list-style:none;margin:0;padding:0 0 0 12px;border-left:2px solid var(--line);display:grid;gap:2px}
.hc-toc a{display:block;padding:5px 0 5px 10px;margin-left:-14px;border-left:2px solid transparent;color:var(--muted);text-decoration:none;line-height:1.35}
.hc-toc a:hover{color:var(--ink)}
.hc-toc a.active{color:var(--navy);font-weight:600;border-left-color:var(--navy)}
.hc-vote{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:40px;padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:#fff}
.hc-vote span{font-weight:600;margin-right:auto}
.hc-vote.done{color:var(--ok)}
.hc-pagers{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.hc-pager{display:grid;gap:3px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:#fff;text-decoration:none;transition:border-color .2s,transform .2s}
.hc-pager:hover{border-color:var(--navy);transform:translateY(-2px)}
.hc-pager small{color:var(--soft);font-size:13px}.hc-pager b{font-size:15.5px}
.hc-pager.next{text-align:right;grid-column:2}
.hc-contact{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:40px;padding:28px 30px;border-radius:var(--radius-lg);background:var(--navy);color:#fff}
.hc-contact h2{font-size:24px;color:#fff}
.hc-contact p{color:var(--on-navy);margin-top:6px}
.hc-contact-actions{display:flex;gap:10px;flex-wrap:wrap}
.hc-contact .btn:not(.btn-light){background:var(--sky);border-color:var(--sky);color:var(--navy)}
.hc-side-toggle{display:none}
@media(max-width:1180px){.hc-layout.with-toc{grid-template-columns:240px minmax(0,1fr)}.hc-toc{display:none}}
@media(max-width:900px){
  .hc-grid{grid-template-columns:1fr 1fr}
  .hc-layout,.hc-layout.with-toc{grid-template-columns:1fr;gap:18px;padding-top:20px}
  .hc-aside{position:static;max-height:none;overflow:visible}
  .hc-side{border:1px solid var(--line);border-radius:16px;background:#fff;padding:6px}
  .hc-page .hc-side:not(.open){display:none}
  .hc-side-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 16px;border:1px solid var(--line);border-radius:14px;background:#fff;font-weight:600;font-size:15px}
  .hc-side-toggle svg{width:16px;height:16px;transform:rotate(90deg);transition:transform .2s}.hc-side-toggle[aria-expanded="true"] svg{transform:rotate(-90deg)}
}
@media(max-width:640px){
  .hc-grid{grid-template-columns:1fr}
  .hc-hero{padding:40px 0 36px}
  .hc-search input{height:52px;font-size:16px}
  .hc-pagers{grid-template-columns:1fr}.hc-pager.next{grid-column:auto;text-align:left}
  .hc-row{padding:16px}
  .hc-contact{padding:22px}
}

/* ---------------------------------------------------------------- reveal and motion */
.js-reveal .reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease var(--d,0s),transform .6s ease var(--d,0s)}
.js-reveal .reveal.in{opacity:1;transform:none}
@keyframes pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(143,198,236,.9)}70%{box-shadow:0 0 0 14px rgba(143,198,236,0)}100%{box-shadow:0 0 0 0 rgba(143,198,236,0)}}
@keyframes blink{0%,100%{opacity:.25}50%{opacity:.9}}

/* ---------------------------------------------------------------- responsive */
@media(max-width:1120px){
  .nav-links{gap:20px}
  .hero-grid{grid-template-columns:1fr;gap:44px}
  .scene{max-width:600px}
  .fb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1020px){
  .menu-btn{display:inline-flex}
  .nav-cta .login{display:none}
  .nav-links{display:none;position:absolute;top:66px;left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;padding:10px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-lg);font-size:16.5px}
  .nav-links.open{display:flex}
  .nav-links>a,.nav-drop-btn,.nav-drop-link{display:flex;padding:12px 14px;border-radius:10px;color:var(--ink)}
  .nav-links>a:hover{background:var(--paper)}
  .nav-links .hide-lg{display:flex}
  .nav-drop-btn{width:100%;justify-content:space-between}
  .nav-drop-list{position:static;min-width:0;padding:0 0 6px 8px;border:0;box-shadow:none}
}
@media(max-width:900px){
  .section{padding:72px 0}
  .faq,.trust-grid,.price-model,.booking{grid-template-columns:1fr}
  .faq{gap:20px}
  .faq>div:first-child{position:static}
  .trust-grid{gap:36px}
  .calls,.next-steps,.how{grid-template-columns:1fr}
  .site-footer{padding-bottom:110px}
  .foot{grid-template-columns:1fr 1fr}
  .foot>div:first-child{grid-column:1/-1}
  /* the bar at the bottom: "Boka genomgång" and "Ring upp mig" once the hero's buttons have scrolled away */
  .sticky-bar{position:fixed;z-index:44;left:12px;right:12px;bottom:12px;display:flex;align-items:center;gap:8px;padding:8px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-lg)}
  .sb-actions{display:flex;flex:1;gap:8px}
  .sb-actions .btn{flex:1 1 0;min-width:0;min-height:46px;padding:8px 10px}
  .cb-panel{left:12px;right:12px;bottom:12px;width:auto;max-width:none;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);padding:18px}
  /* our own site only: the chat button sits low when nothing else is there, and is not shown with the bar */
  html body .avora-widget{bottom:16px;transition:bottom .3s ease}
  html body.has-bar:not(.avora-chat-open) .avora-launch,html body.cb-open:not(.avora-chat-open) .avora-launch{display:none}
  body.menu-open .sticky-bar{display:none}
}
@media(max-width:640px){
  .wrap{padding:0 16px}
  .nav{gap:10px}
  .brand img{width:108px}
  .nav-cta{gap:8px}
  .nav-cta .btn-sm{padding:8px 12px;font-size:14.5px}
  .section{padding:56px 0}
  .section-head{margin-bottom:28px}
  .hero{padding:28px 0 48px}
  .hero h1{font-size:clamp(36px,10.4vw,46px)}
  .lead{font-size:18px;margin-top:16px}
  .hero-ctas{flex-direction:column}
  .hero-ctas .btn{width:100%}
  .sc-call,.sc-talk,.sc-out{width:100%}
  /* one slot for the conversation and then the request, so the hero is short on a phone (site.js sets the phase;
     without it, as with reduced motion, the cards simply stack) */
  .scene[data-phase] .sc-talk,.scene[data-phase] .sc-out{grid-area:2/1;transition:opacity .45s ease,visibility .45s}
  .scene[data-phase] .sc-talk{display:flex;flex-direction:column;justify-content:flex-end}
  .scene[data-phase="talk"] .sc-out,.scene[data-phase="out"] .sc-talk{opacity:0;visibility:hidden}
  .scene[data-phase] .sc-out:has(.tk-top.wait):after{content:none}
  .sc-lines{height:196px}
  .sc-lines li{grid-template-columns:44px minmax(0,1fr);font-size:14.5px}
  .tk-title b{font-size:21px}
  .fb-grid{grid-template-columns:1fr 1fr;gap:16px 14px}
  .fb-grid li{gap:8px}
  .fb-grid svg{width:17px;height:17px}
  .fb-grid strong{font-size:15px;line-height:1.3}
  .fb-grid span{font-size:13.5px}
  .how{gap:18px}
  .how li{grid-template-columns:40px minmax(0,1fr);gap:14px}
  .how-ic{width:40px;height:40px;border-radius:12px}
  .how-ic svg{width:19px;height:19px}
  .how h3{font-size:19px}
  .how p{font-size:16px;margin-top:2px}
  .hub-shot img{max-width:320px;margin:0 auto;border-radius:22px}
  .hub-shot figcaption{text-align:center}
  .picker{padding:20px}
  .days{gap:6px}
  .day{padding:12px 2px 10px;border-radius:12px}
  .day b{font-size:21px}
  .day span{display:none}
  .slots,.bk-form{padding:18px}
  .bk-form .cb-row{grid-template-columns:1fr}
  .next-steps{gap:14px}
  .next-steps li{padding:0;background:none;border:0;border-radius:0}
  .prose dl{grid-template-columns:1fr}
  .prose .terms-toc ol{columns:1}
  .terms .terms-short{padding:20px}
  .terms-table.rows tr{display:block;padding:12px 16px;border-bottom:1px solid var(--line)}
  .terms-table.rows tr:last-child{border-bottom:0}
  .terms-table.rows th,.terms-table.rows td{display:block;width:auto;padding:0;border:0}
  .terms-table.rows th{margin-bottom:4px}
}
@media(max-width:420px){.sb-actions .btn svg{display:none}.sb-actions{gap:6px}}
@media(max-width:360px){.cb-row{grid-template-columns:1fr}}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation:none!important;transition:none!important}
  .js-reveal .reveal{opacity:1;transform:none}
  .scene .wait{opacity:1;transform:none}
}