:root{
    --paper:#F5F4EF;
    --ink:#1F2E33;
    --sea:#37625C;
    --sea-soft:#EAF0EC;
    --mist:#E7EAE4;
    --line:#CBD1CA;
    --sand:#D9CFBB;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Karla',sans-serif;
    background:var(--paper);
    color:var(--ink);
    line-height:1.65;
    font-size:17px;
    font-weight:300;
  }
  h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:500;line-height:1.15;}
  a{color:inherit;}

  /* ---------- Sidhuvud ---------- */
  header{
    position:sticky;top:0;z-index:50;
    background:rgba(245,244,239,0.94);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--line);
  }
  .nav-inner{
    max-width:1080px;margin:0 auto;
    display:flex;align-items:center;justify-content:space-between;
    padding:18px 24px;
  }
  .logo{
    font-family:'Cormorant Garamond',serif;
    font-size:22px;letter-spacing:0.04em;
    text-decoration:none;font-weight:600;
  }
  nav.menu{display:flex;gap:34px;}
  nav.menu a{
    text-decoration:none;font-size:14px;letter-spacing:0.12em;
    text-transform:uppercase;font-weight:500;color:var(--ink);
    padding-bottom:2px;border-bottom:1px solid transparent;
    transition:border-color .2s;
  }
  nav.menu a:hover{border-bottom-color:var(--sea);}
  .menu-toggle{display:none;background:none;border:none;font-size:26px;cursor:pointer;color:var(--ink);}

  /* ---------- Sektioner ---------- */
  section{padding:110px 24px;}
  .inner{max-width:1080px;margin:0 auto;}
  .eyebrow{
    font-size:13px;letter-spacing:0.22em;text-transform:uppercase;
    color:var(--sea);font-weight:600;margin-bottom:18px;
  }

  /* ---------- Hero ---------- */
  .hero{
    min-height:88vh;display:flex;align-items:center;
    position:relative;overflow:hidden;padding-top:60px;
  }
  .hero .inner{position:relative;z-index:2;max-width:820px;text-align:center;margin:0 auto;}
  .hero h1{font-size:clamp(42px,6vw,72px);margin-bottom:26px;}
  .hero h1 em{font-style:italic;color:var(--sea);}
  .hero p.lead{font-size:20px;max-width:560px;margin:0 auto 40px;}
  .hero .mail{
    display:inline-block;text-decoration:none;
    border:1px solid var(--ink);padding:14px 34px;
    font-size:14px;letter-spacing:0.14em;text-transform:uppercase;font-weight:500;
    transition:background .25s,color .25s;
  }
  .hero .mail:hover{background:var(--ink);color:var(--paper);}
  .curve{
    position:absolute;bottom:0;left:0;width:100%;height:42%;z-index:1;opacity:.55;
  }

  /* ---------- Om mig ---------- */
  .om{background:var(--mist);}
  .om .inner{display:grid;grid-template-columns:6fr 5fr;gap:70px;align-items:center;}
  .portratt{
    width:100%;aspect-ratio:4/5;object-fit:cover;display:block;
  }
  .om h2{font-size:clamp(32px,4vw,46px);margin-bottom:22px;}
  .om p{margin-bottom:16px;}

  /* ---------- Metod ---------- */
  .metod h2{font-size:clamp(32px,4vw,46px);margin-bottom:16px;}
  .metod .intro{max-width:620px;margin-bottom:60px;}
  .steg{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;}
  .steg article{border-top:2px solid var(--sea);padding-top:26px;}
  .steg h3{font-size:26px;margin-bottom:12px;}
  .metod .citat{
    margin-top:80px;text-align:center;
    font-family:'Cormorant Garamond',serif;font-style:italic;
    font-size:clamp(24px,3vw,32px);color:var(--sea);
  }

  /* ---------- Kunder ---------- */
  .kunder{background:var(--sea-soft);}
  .kunder h2{font-size:clamp(32px,4vw,46px);margin-bottom:16px;}
  .kunder .intro{max-width:620px;margin-bottom:60px;}
  .kort{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
  .kort a{
    text-decoration:none;background:var(--paper);
    border:1px solid var(--line);padding:38px 32px 32px;
    display:flex;flex-direction:column;
    transition:transform .25s,box-shadow .25s;
  }
  .kort a:hover{transform:translateY(-6px);box-shadow:0 14px 30px rgba(31,46,51,0.10);}
  .kort .oms{
    font-size:13px;letter-spacing:0.16em;text-transform:uppercase;
    color:var(--sea);font-weight:600;margin-bottom:14px;
  }
  .kort h3{font-size:27px;margin-bottom:12px;}
  .kort p{flex:1;margin-bottom:24px;font-size:16px;}
  .kort .las{
    font-size:14px;letter-spacing:0.12em;text-transform:uppercase;font-weight:600;
    color:var(--sea);
  }
  .kort svg{margin-bottom:20px;}

  /* ---------- Bokningsknapp ---------- */
  .boka-btn{
    display:inline-block;background:var(--sea);color:var(--paper);
    padding:15px 36px;text-decoration:none;
    font-size:14px;letter-spacing:0.14em;text-transform:uppercase;font-weight:600;
    transition:background .25s;
  }
  .boka-btn:hover{background:var(--ink);}
  footer .boka-btn:hover{background:var(--paper);color:var(--ink);}

  /* ---------- Kontakt / sidfot ---------- */
  footer{background:var(--ink);color:var(--paper);padding:100px 24px 50px;text-align:center;}
  footer h2{font-size:clamp(32px,4vw,44px);margin-bottom:18px;}
  footer p{max-width:480px;margin:0 auto 34px;opacity:.85;}
  footer .mail{
    display:inline-block;text-decoration:none;color:var(--paper);
    border:1px solid var(--paper);padding:14px 34px;
    font-size:14px;letter-spacing:0.14em;text-transform:uppercase;font-weight:500;
    transition:background .25s,color .25s;
  }
  footer .mail:hover{background:var(--paper);color:var(--ink);}
  footer .fin{margin-top:70px;font-size:13px;opacity:.55;}

  /* ---------- Undersidor ---------- */
  .page{display:none;}
  .page.active{display:block;}
  .sub-hero{padding:130px 24px 70px;background:var(--mist);}
  .sub-hero .inner{max-width:760px;}
  .sub-hero h1{font-size:clamp(36px,5vw,58px);margin-bottom:20px;}
  .sub-hero p.lead{font-size:19px;max-width:600px;}
  .sub-body{padding:80px 24px;}
  .hero-med-foto{max-width:980px;display:flex;gap:56px;align-items:center;flex-wrap:wrap;}
  .hero-med-foto .text{flex:1 1 420px;}
  .hero-portratt{flex:0 1 260px;width:260px;display:block;}
  .tva-spalt{display:flex;gap:40px;align-items:flex-start;flex-wrap:wrap;}
  .tva-spalt .text{flex:1 1 380px;}
  .sub-portratt{flex:0 1 280px;width:280px;margin-top:6px;}
  .sub-body .inner{max-width:760px;}
  .sub-body h2{font-family:'Cormorant Garamond',serif;font-size:30px;margin:44px 0 14px;}
  .sub-body h2:first-child{margin-top:0;}
  .sub-body ul{margin:14px 0 14px 22px;}
  .sub-body li{margin-bottom:8px;}
  .paket{
    background:var(--sea-soft);border:1px solid var(--line);
    padding:36px;margin-top:30px;
  }
  .paket h3{font-family:'Cormorant Garamond',serif;font-size:26px;margin-bottom:10px;}
  .tillbaka{
    display:inline-block;margin-top:50px;text-decoration:none;
    font-size:14px;letter-spacing:0.12em;text-transform:uppercase;font-weight:600;color:var(--sea);
  }

  /* ---------- Mobil ---------- */
  @media(max-width:860px){
    nav.menu{
      display:none;position:absolute;top:100%;left:0;right:0;
      background:var(--paper);flex-direction:column;gap:0;
      border-bottom:1px solid var(--line);
    }
    nav.menu.open{display:flex;}
    nav.menu a{padding:16px 24px;border-bottom:1px solid var(--line);}
    .menu-toggle{display:block;}
    .om .inner{grid-template-columns:1fr;gap:40px;}
    .steg,.kort{grid-template-columns:1fr;}
    section{padding:80px 20px;}
  }

  /* ---------- Språkväxlare ---------- */
  .nav-right{display:flex;align-items:center;gap:20px;}
  .lang{display:flex;gap:12px;align-items:center;}
  .lang a{text-decoration:none;font-size:13px;letter-spacing:0.12em;font-weight:500;color:var(--ink);opacity:.5;padding-bottom:2px;border-bottom:1px solid transparent;}
  .lang a.active{opacity:1;border-bottom-color:var(--sea);}

  /* ---------- Nyhetsbrev ---------- */
  .nyhetsbrev{background:var(--sea-soft);border-top:1px solid var(--line);}
  .nyhetsbrev .inner{max-width:640px;text-align:center;}
  .nyhetsbrev .nb-intro{margin:16px 0 30px;}
  .nb-form{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
  .nb-form input{flex:1 1 260px;max-width:340px;padding:14px 16px;border:1px solid var(--ink);background:var(--paper);font-family:'Karla',sans-serif;font-size:15px;color:var(--ink);}
  .nb-form input:focus{outline:2px solid var(--sea);outline-offset:1px;}
  .nb-form button{border:none;cursor:pointer;}
  .nb-gdpr{font-size:13px;opacity:.75;margin-top:18px;line-height:1.6;}
  .nb-gdpr a{color:var(--sea);}
  .nb-thanks{display:none;margin-top:20px;color:var(--sea);font-weight:500;}

  /* ---------- Footer: sociala länkar + policy ---------- */
  footer .social{color:inherit;font-size:14px;letter-spacing:0.14em;text-transform:uppercase;font-weight:500;text-decoration:none;border-bottom:1px solid rgba(245,244,239,0.5);padding-bottom:2px;margin:0 10px;}
  footer .policy-link{color:inherit;font-size:13px;opacity:.65;text-decoration:none;border-bottom:1px solid rgba(245,244,239,0.35);padding-bottom:1px;}

  /* ---------- Workshopsidan: varm ton som matchar fotot ---------- */
  #page-workshop .sub-hero{background:#EFE8DA;}

  /* ---------- Tunn ram runt alla foton ---------- */
  .portratt, .sub-portratt, .hero-portratt{border:1px solid var(--line);background:var(--paper);padding:8px;}
  .ws-flow{margin:34px 0 10px;}
  .ws-flow h2{margin-bottom:18px;}
  .ws-flow svg{display:block;max-width:680px;}

  /* ---------- MailerLite-formuläret ärver sajtens design ---------- */
  .nyhetsbrev .ml-embedded{max-width:440px;margin:0 auto;}
  .nyhetsbrev .ml-embedded *{font-family:'Karla',sans-serif!important;}
  .nyhetsbrev .ml-embedded .ml-form-embedContainer,
  .nyhetsbrev .ml-embedded .ml-form-embedWrapper,
  .nyhetsbrev .ml-embedded .ml-form-embedBody{background:transparent!important;box-shadow:none!important;border:none!important;padding:0!important;}
  .nyhetsbrev .ml-embedded h4{display:none!important;}
  .nyhetsbrev .ml-embedded p{color:var(--ink)!important;}
  .nyhetsbrev .ml-embedded input[type=email]{
    border:1px solid var(--ink)!important;border-radius:0!important;
    background:var(--paper)!important;color:var(--ink)!important;
    padding:14px 16px!important;font-size:15px!important;height:auto!important;
  }
  .nyhetsbrev .ml-embedded button{
    background:var(--sea)!important;color:var(--paper)!important;
    border:none!important;border-radius:0!important;cursor:pointer;
    padding:15px 36px!important;font-size:14px!important;letter-spacing:0.08em!important;
    text-transform:uppercase!important;height:auto!important;
  }
  .nyhetsbrev .ml-embedded button:hover{background:var(--ink)!important;}

  @media(max-width:860px){
    .nav-right{gap:14px;}
    .nb-form input{max-width:none;}
  }

  /* ---------- Workshopsidan v2 (24 sep 2026) ---------- */
  #page-workshop .sub-hero h1 em{font-style:italic;color:var(--sea);}
  #page-workshop ul.ws-fragor{list-style:none;margin:6px 0 18px;}
  #page-workshop ul.ws-fragor li{padding:10px 0 10px 30px;position:relative;border-bottom:1px solid var(--line);}
  #page-workshop ul.ws-fragor li:last-child{border-bottom:none;}
  #page-workshop ul.ws-fragor li::before{content:"–";position:absolute;left:4px;color:var(--sea);font-weight:600;}
  #page-workshop .ws-brygga{font-style:italic;color:var(--sea);font-size:18px;margin-top:4px;}
  #page-workshop .ws-dita{background:var(--sea-soft);border:1px solid var(--line);padding:30px 32px;margin-top:8px;}
  #page-workshop .ws-dita p+p{margin-top:14px;}
  #page-workshop .ws-metodpunkt{margin-bottom:16px;}
  #page-workshop ol.ws-resan{list-style:none;counter-reset:tr;margin:26px 0 0;}
  #page-workshop ol.ws-resan li{counter-increment:tr;padding:14px 0 14px 52px;position:relative;border-top:1px solid var(--line);}
  #page-workshop ol.ws-resan li::before{content:counter(tr);position:absolute;left:0;top:14px;width:32px;height:32px;border-radius:50%;background:var(--sea);color:var(--paper);font-weight:700;font-size:15px;display:flex;align-items:center;justify-content:center;font-family:'Karla',sans-serif;}
  #page-workshop ol.ws-resan li strong{font-family:'Cormorant Garamond',serif;font-size:21px;font-weight:600;display:block;margin-bottom:2px;}
  #page-workshop .ws-uppf{background:var(--mist);padding:20px 26px;margin-top:8px;border-left:3px solid var(--sea);}
  #page-workshop .ws-passar{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:10px;}
  #page-workshop .ws-passar .kol{border:1px solid var(--line);padding:26px 28px;background:var(--paper);}
  #page-workshop .ws-passar h3{font-size:22px;margin-bottom:12px;}
  #page-workshop .ws-passar ul{list-style:none;}
  #page-workshop .ws-passar li{padding:7px 0 7px 24px;position:relative;font-size:16px;}
  #page-workshop .ws-passar .ja li::before{content:"✓";position:absolute;left:0;color:var(--sea);font-weight:700;}
  #page-workshop .ws-passar .nej li::before{content:"✕";position:absolute;left:0;color:#9a7a4f;font-weight:700;}
  #page-workshop details.ws-faq{border-bottom:1px solid var(--line);}
  #page-workshop details.ws-faq:first-of-type{border-top:1px solid var(--line);}
  #page-workshop details.ws-faq summary{cursor:pointer;padding:15px 4px;font-weight:600;font-size:16.5px;list-style:none;position:relative;padding-right:30px;}
  #page-workshop details.ws-faq summary::-webkit-details-marker{display:none;}
  #page-workshop details.ws-faq summary::after{content:"+";position:absolute;right:6px;top:12px;color:var(--sea);font-size:22px;font-weight:400;}
  #page-workshop details.ws-faq[open] summary::after{content:"–";}
  #page-workshop details.ws-faq p{padding:0 4px 16px;max-width:660px;}
  #page-workshop .ws-avslut{text-align:center;background:#EFE8DA;padding:46px 30px;margin-top:54px;}
  #page-workshop .ws-avslut h2{margin:0 0 14px;font-size:clamp(24px,3.2vw,34px);text-wrap:balance;}
  #page-workshop .ws-avslut p{max-width:560px;margin:0 auto 12px;}
  #page-workshop .ws-avslut .tag{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:21px;color:var(--sea);margin-bottom:26px;}
  @media(max-width:700px){#page-workshop .ws-passar{grid-template-columns:1fr;}}

  /* multi-page build: alla sidor renderas direkt */
  .page{display:block;}