/* JojoMobil storefront — tokens and base elements. From design/jojoparts.css.
   Re-theme via --brand / --brand2 / --acc, or a palette preset html[data-f]. */
:root{--bg:#f4f6f8;--card:#fff;--ink:#0e1a23;--ink2:#44525d;--ink3:#5b6974;--line:#e1e6ea;--line2:#eef1f4;
--brand:oklch(0.42 0.085 222);--brand2:oklch(0.27 0.055 228);--brand-ink:#fff;--acc:oklch(0.83 0.15 78);--acc-ink:#1d1504;
--ok:oklch(0.55 0.13 152);--warn:oklch(0.62 0.14 62);--sale:oklch(0.56 0.2 25);
--tint:color-mix(in oklab,var(--brand) 7%,#fff);--tint2:color-mix(in oklab,var(--brand) 13%,#fff);
--r:14px;--r-sm:10px;--sh-1:0 1px 2px rgba(14,26,35,.05),0 0 0 1px var(--line);--sh-2:0 2px 4px rgba(14,26,35,.04),0 16px 32px -16px rgba(14,26,35,.22),0 0 0 1px var(--line);--ease:cubic-bezier(.2,.7,.2,1)}
html[data-f="lila"]{--brand:oklch(0.45 0.15 290);--brand2:oklch(0.28 0.09 290);--acc:oklch(0.85 0.13 160)}
html[data-f="rod"]{--brand:oklch(0.48 0.17 25);--brand2:oklch(0.29 0.08 25);--acc:oklch(0.86 0.13 90)}
html[data-f="svart"]{--brand:#1c2127;--brand2:#0d1014;--acc:oklch(0.83 0.16 145)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Figtree",system-ui,sans-serif;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}a:hover{color:var(--brand)}
h1,h2,h3,h4,p{margin:0}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}
.wrap{max-width:1360px;margin:0 auto;padding:0 clamp(14px,2.6vw,32px)}
.fb{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:10px;border:1px solid transparent;font-weight:700;font-size:14.5px;cursor:pointer;white-space:nowrap;transition:background .2s,border-color .2s,transform .2s var(--ease),box-shadow .2s}
.fb svg{width:17px;height:17px;transition:transform .2s var(--ease)}
.fb:hover svg{transform:translateX(2px)}
.fb-brand{background:var(--brand);color:var(--brand-ink)}.fb-brand:hover{background:var(--brand2);color:var(--brand-ink)}
.fb-acc{background:var(--acc);color:var(--acc-ink);box-shadow:0 6px 16px -8px color-mix(in oklab,var(--acc) 80%,#000)}.fb-acc:hover{color:var(--acc-ink);transform:translateY(-1px)}
.fb-line{background:var(--card);border-color:var(--line);color:var(--ink)}.fb-line:hover{border-color:var(--ink3);color:var(--ink)}
.fb:disabled{opacity:.45;cursor:not-allowed;transform:none}


/* Drupal */
.visually-hidden{position:absolute!important;clip:rect(1px,1px,1px,1px);overflow:hidden;height:1px;width:1px;word-wrap:normal}
.visually-hidden.focusable:focus{position:static!important;clip:auto;overflow:visible;height:auto;width:auto}
img{max-width:100%;height:auto}
.messages{margin:18px 0 0;padding:14px 18px;border-radius:12px;background:var(--card);box-shadow:var(--sh-1);border-left:4px solid var(--ok)}
.messages--error{border-left-color:var(--sale)}.messages--warning{border-left-color:var(--warn)}
.tabs-primary{display:flex;gap:6px;flex-wrap:wrap;list-style:none;padding:0;margin:18px 0 0}
.tabs-primary a{display:inline-flex;height:34px;align-items:center;padding:0 14px;border-radius:9px;background:var(--card);box-shadow:var(--sh-1);font-size:13.5px;font-weight:700}
.tabs-primary a.is-active{background:var(--ink);color:#fff}
.page-title{font-size:clamp(28px,3.4vw,44px);font-weight:800;letter-spacing:-.04em;line-height:1.05;margin:24px 0 18px}
