:root{color-scheme:light}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#faf9f5;color:#141413}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}

/* ---------- */

  :root{
    --sand:#f1e9d8;
    --sand-hi:#faf5e9;
    --line:#d9c8a3;
    --ink:#211d15;
    --ink-soft:#5a5140;
    --rust:#a8451a;
    --rust-ink:#a8451a;
    --olive:#4c5a3d;
    --olive-deep:#232a1c;
    --gunmetal:#2c2a24;
    --card:#faf5e9;
    --shadow: 0 1px 0 rgba(33,29,21,0.08);
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --sand:#181c15;
      --sand-hi:#1f2419;
      --line:#3a4131;
      --ink:#eee6d3;
      --ink-soft:#a9a48e;
      --rust:#e07a45;
      --rust-ink:#e07a45;
      --olive:#8ba173;
      --olive-deep:#0f1310;
      --gunmetal:#0f1310;
      --card:#1f2419;
      --shadow: 0 1px 0 rgba(0,0,0,0.3);
    }
  }
  :root[data-theme="dark"]{
    --sand:#181c15;
    --sand-hi:#1f2419;
    --line:#3a4131;
    --ink:#eee6d3;
    --ink-soft:#a9a48e;
    --rust:#e07a45;
    --rust-ink:#e07a45;
    --olive:#8ba173;
    --olive-deep:#0f1310;
    --gunmetal:#0f1310;
    --card:#1f2419;
    --shadow: 0 1px 0 rgba(0,0,0,0.3);
  }

  *,*::before,*::after{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--sand);
    color:var(--ink);
    font-family:"Work Sans", ui-sans-serif, system-ui, sans-serif;
    font-size:16px;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
  }

  .wrap{max-width:1120px;margin:0 auto;padding:0 24px;}
  h1,h2,h3{
    font-family:"Big Shoulders Display", ui-sans-serif, sans-serif;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.01em;
    line-height:1.02;
    margin:0;
    text-wrap:balance;
  }
  .stencil{
    font-family:"Big Shoulders Stencil Display", "Big Shoulders Display", sans-serif;
  }
  .eyebrow{
    font-family:"IBM Plex Mono", ui-monospace, monospace;
    font-size:0.72rem;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--rust-ink);
    display:flex;
    align-items:center;
    gap:10px;
  }
  .eyebrow::before{
    content:"";
    width:22px;height:1px;background:var(--rust-ink);display:inline-block;
  }
  .mono{font-family:"IBM Plex Mono", ui-monospace, monospace; font-variant-numeric:tabular-nums;}
  p{margin:0;}
  a{color:inherit;}
  img,svg{display:block;max-width:100%;}

  /* ---------- header ---------- */
  header{
    position:sticky;top:0;z-index:40;
    background:color-mix(in srgb, var(--sand) 88%, transparent);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--line);
  }
  .nav{
    display:flex;align-items:center;justify-content:space-between;
    padding:16px 0;
  }
  .brand{display:flex;align-items:baseline;gap:14px;}
  .logo{
    display:flex;align-items:baseline;gap:8px;
    font-family:"Big Shoulders Stencil Display", sans-serif;
    font-weight:700;
    font-size:1.5rem;
    letter-spacing:0.02em;
    text-decoration:none;
  }
  .logo .dot{color:var(--rust-ink);}
  .brandmark{width:26px;height:26px;flex-shrink:0;align-self:center;}
  .geotag{
    font-size:0.68rem;
    letter-spacing:0.05em;
    color:var(--ink-soft);
    white-space:nowrap;
    display:none;
  }
  @media (min-width:560px){.geotag{display:inline;}}
  .navlinks{
    display:flex;gap:28px;align-items:center;
    list-style:none;margin:0;padding:0;
  }
  .navlinks a{
    text-decoration:none;
    font-size:0.86rem;
    font-weight:600;
    letter-spacing:0.02em;
    color:var(--ink-soft);
    transition:color .15s ease;
  }
  .navlinks a:hover{color:var(--ink);}
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    font-family:"IBM Plex Mono", monospace;
    font-size:0.78rem;
    letter-spacing:0.08em;
    text-transform:uppercase;
    font-weight:600;
    padding:12px 20px;
    border-radius:2px;
    text-decoration:none;
    cursor:pointer;
    border:1px solid transparent;
    transition:transform .15s ease, background .15s ease, border-color .15s ease;
  }
  .btn:hover{transform:translateY(-1px);}
  .btn-solid{background:var(--rust); color:#fbf3e7;}
  .btn-solid:hover{background:color-mix(in srgb, var(--rust) 88%, black);}
  .btn-outline{border-color:var(--ink); color:var(--ink);}
  .btn-outline:hover{background:var(--ink); color:var(--sand-hi);}
  .navcta{display:none;}
  @media (min-width:760px){.navcta{display:inline-flex;}}
  .navlinks{display:none;}
  @media (min-width:900px){.navlinks{display:flex;}}
  .burger{
    display:inline-flex;
    width:38px;height:38px;align-items:center;justify-content:center;
    border:1px solid var(--line); background:none; border-radius:2px;
  }
  @media (min-width:900px){.burger{display:none;}}

  /* ---------- hero ---------- */
  .hero{
    position:relative;
    overflow:hidden;
    border-bottom:1px solid var(--line);
    background:
      linear-gradient(180deg, transparent 60%, var(--sand) 100%),
      var(--sand);
  }
  .topo{position:absolute;inset:0;width:100%;height:100%;opacity:0.5;}
  .topo path{fill:none;stroke:var(--line);stroke-width:1;}
  :root[data-theme="dark"] .topo,
  :root:not([data-theme="light"]) .topo{opacity:0.35;}

  .hero-inner{
    position:relative;
    padding:76px 0 56px;
    display:grid;
    gap:36px;
  }
  @media (min-width:880px){
    .hero-inner{grid-template-columns:1.15fr 0.85fr; align-items:end; padding:96px 0 64px;}
  }
  .hero h1{
    font-size:clamp(2.6rem, 7.2vw, 5.1rem);
  }
  .hero .rust{color:var(--rust-ink);}
  .hero-sub{
    margin-top:20px;
    max-width:46ch;
    font-size:1.08rem;
    color:var(--ink-soft);
  }
  .hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px;}

  /* ---------- rotating slogan ---------- */
  .sloganbox{
    position:relative;
    height:1.5em;
    margin:16px 0 4px;
    overflow:hidden;
  }
  .slogan{
    position:absolute; inset:0;
    display:flex; align-items:center;
    font-family:"IBM Plex Mono", monospace;
    font-size:0.92rem;
    letter-spacing:0.03em;
    color:var(--rust-ink);
    font-weight:600;
    opacity:0;
    animation: sloganFade 20s infinite;
    white-space:nowrap;
  }
  .slogan:nth-child(1){animation-delay:0s;}
  .slogan:nth-child(2){animation-delay:-4s;}
  .slogan:nth-child(3){animation-delay:-8s;}
  .slogan:nth-child(4){animation-delay:-12s;}
  .slogan:nth-child(5){animation-delay:-16s;}
  @keyframes sloganFade{
    0%{opacity:0; transform:translateY(6px);}
    3%{opacity:1; transform:translateY(0);}
    17%{opacity:1; transform:translateY(0);}
    20%{opacity:0; transform:translateY(-6px);}
    100%{opacity:0;}
  }
  @media (prefers-reduced-motion: reduce){
    .slogan{animation:none; opacity:0; transform:none;}
    .slogan:first-child{opacity:1;}
  }

  /* ---------- photoframe (rotating nature scenes) ---------- */
  .photoframe-wrap{justify-self:end; width:100%; max-width:340px;}
  .pf-label{
    display:flex;justify-content:space-between;
    font-family:"IBM Plex Mono",monospace;
    font-size:0.66rem;letter-spacing:0.12em;text-transform:uppercase;
    color:var(--ink-soft);
    margin-bottom:8px;
  }
  .pf-label .dotlive{color:var(--rust-ink);}
  .photoframe{
    position:relative;
    aspect-ratio:4/5;
    border:1px solid var(--line);
    background:var(--card);
    box-shadow:var(--shadow);
    overflow:hidden;
  }
  .photoframe .corner{position:absolute; width:16px;height:16px; border-color:var(--rust-ink); z-index:3;}
  .photoframe .corner.tl{top:8px;left:8px;border-top:1.5px solid;border-left:1.5px solid;}
  .photoframe .corner.tr{top:8px;right:8px;border-top:1.5px solid;border-right:1.5px solid;}
  .photoframe .corner.bl{bottom:8px;left:8px;border-bottom:1.5px solid;border-left:1.5px solid;}
  .photoframe .corner.br{bottom:8px;right:8px;border-bottom:1.5px solid;border-right:1.5px solid;}
  .scene{
    position:absolute; inset:0;
    opacity:0;
    transition: opacity 1s ease;
  }
  .scene.active{opacity:1;}
  .scene svg{width:100%;height:100%;display:block;}
  .scene img{width:100%;height:100%;display:block;object-fit:cover;}
  .scene .caption{
    position:absolute; left:0; right:0; bottom:0;
    padding:10px 14px 12px;
    background:linear-gradient(0deg, rgba(15,19,16,0.72), rgba(15,19,16,0));
    color:#f1ead9;
    font-family:"IBM Plex Mono",monospace;
    font-size:0.68rem;
    letter-spacing:0.06em;
    text-transform:uppercase;
  }
  .scene .caption b{display:block;font-size:0.82rem;letter-spacing:0.02em;margin-bottom:2px;color:#fff;}
  @media (prefers-reduced-motion: reduce){
    .scene{transition:none;}
  }

  /* route strip */
  .routestrip{
    border-top:1px solid var(--line);
    background:var(--olive-deep);
    color:#e9e3cf;
    overflow:hidden;
  }
  .routestrip .track{
    display:flex; gap:0; align-items:center;
    padding:13px 0;
    font-family:"IBM Plex Mono",monospace;
    font-size:0.78rem;
    letter-spacing:0.08em;
    white-space:nowrap;
    width:max-content;
    animation:scroll-route 34s linear infinite;
  }
  @media (prefers-reduced-motion: reduce){.routestrip .track{animation:none;}}
  .routestrip .seg{display:flex;align-items:center;gap:14px;padding:0 18px;}
  .routestrip .seg .arrow{color:var(--rust-ink);}
  .routestrip .seg b{color:#fff;font-weight:600;}
  @keyframes scroll-route{
    from{transform:translateX(0);}
    to{transform:translateX(-50%);}
  }

  /* ---------- section shell ---------- */
  section{padding:88px 0;}
  .section-head{
    display:flex;flex-direction:column;gap:14px;
    max-width:640px;margin-bottom:48px;
  }
  .section-head h2{font-size:clamp(1.9rem, 4.2vw, 2.7rem);}
  .section-head p{color:var(--ink-soft); font-size:1.02rem;}

  .band-dark{
    background:var(--olive-deep);
    color:#efe9d6;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .band-dark .section-head p{color:#c9c4ac;}
  .band-dark .eyebrow{color:var(--rust-ink);}
  .band-dark .eyebrow::before{background:var(--rust-ink);}

  /* ---------- categories ---------- */
  .cats{
    display:grid;gap:22px;
    grid-template-columns:1fr;
  }
  @media (min-width:760px){.cats{grid-template-columns:repeat(3,1fr);}}
  .cat{
    border:1px solid var(--line);
    background:var(--card);
    padding:28px 24px 24px;
    display:flex;flex-direction:column;gap:16px;
    box-shadow:var(--shadow);
  }
  .cat .icon{width:40px;height:40px;color:var(--rust-ink);}
  .cat h3{font-size:1.35rem;}
  .cat p{color:var(--ink-soft);font-size:0.95rem;}
  .cat .catmeta{
    margin-top:auto;
    display:flex;justify-content:space-between;align-items:baseline;
    border-top:1px dashed var(--line);
    padding-top:14px;
    font-family:"IBM Plex Mono",monospace;
    font-size:0.78rem;
  }
  .cat .catmeta .from{color:var(--ink-soft);}
  .cat .catmeta .price{font-weight:600;}

  /* ---------- spec sheet ---------- */
  .specwrap{
    display:grid;gap:40px;
    grid-template-columns:1fr;
  }
  @media (min-width:880px){.specwrap{grid-template-columns:0.95fr 1.05fr; align-items:start;}}
  .specvisual{
    border:1px solid var(--line);
    background:var(--card);
    aspect-ratio:4/3;
    position:relative;
    overflow:hidden;
    box-shadow:var(--shadow);
  }
  .specvisual svg{width:100%;height:100%;}
  .spectag{
    background:var(--card);
    border:1px solid var(--line);
    box-shadow:var(--shadow);
  }
  .spectag .st-head{
    display:flex;justify-content:space-between;align-items:flex-start;
    padding:22px 24px;
    border-bottom:1px dashed var(--line);
  }
  .spectag .st-head h3{font-size:1.7rem;}
  .spectag .st-head .code{font-family:"IBM Plex Mono",monospace;font-size:0.78rem;color:var(--ink-soft);}
  .spectag .st-price{
    padding:16px 24px;
    display:flex;justify-content:space-between;align-items:center;
    border-bottom:1px dashed var(--line);
    font-family:"IBM Plex Mono",monospace;
  }
  .spectag .st-price .amt{font-size:1.3rem;font-weight:600;color:var(--rust-ink);}
  .spec-rows{padding:6px 24px 20px;}
  .spec-row{
    display:flex;justify-content:space-between;gap:16px;
    padding:11px 0;
    border-bottom:1px solid var(--line);
    font-size:0.9rem;
  }
  .spec-row:last-child{border-bottom:none;}
  .spec-row .k{color:var(--ink-soft);}
  .spec-row .v{font-family:"IBM Plex Mono",monospace; text-align:right;}

  /* ---------- how it works ---------- */
  .steps{
    display:grid;gap:0;
    grid-template-columns:1fr;
    border-top:1px solid var(--line);
  }
  @media (min-width:760px){.steps{grid-template-columns:repeat(4,1fr);}}
  .step{
    padding:28px 22px;
    border-bottom:1px solid var(--line);
    border-right:1px solid var(--line);
    position:relative;
  }
  @media (min-width:760px){.step:nth-child(4){border-right:none;}}
  .step:last-child{border-right:none;}
  .step .num{
    font-family:"Big Shoulders Stencil Display",sans-serif;
    font-size:2.4rem;
    color:var(--rust-ink);
    line-height:1;
  }
  .step h4{
    font-family:"Big Shoulders Display",sans-serif;
    text-transform:uppercase;
    font-size:1.05rem;
    margin:10px 0 8px;
  }
  .step p{color:var(--ink-soft);font-size:0.9rem;}

  /* ---------- cat card link ---------- */
  .cat .cardlink{
    margin-top:-2px;
    font-family:"IBM Plex Mono",monospace;
    font-size:0.76rem;
    letter-spacing:0.03em;
    color:var(--rust-ink);
    text-decoration:none;
    display:inline-flex;align-items:center;gap:6px;
  }
  .cat .cardlink:hover{text-decoration:underline;}

  /* ---------- rules / overnatning ---------- */
  .rules-intro{max-width:72ch;color:var(--ink-soft);margin-bottom:12px;}
  .rules-intro:last-of-type{margin-bottom:0;}
  .rules-grid{
    display:grid;gap:0;
    grid-template-columns:1fr;
    border-top:1px solid var(--line);
    border-left:1px solid var(--line);
    margin-top:40px;
  }
  @media (min-width:760px){.rules-grid{grid-template-columns:1fr 1fr;}}
  .rule-item{
    border-bottom:1px solid var(--line);
    border-right:1px solid var(--line);
  }
  .rule-item summary{
    cursor:pointer;
    list-style:none;
    display:flex;justify-content:space-between;align-items:center;gap:14px;
    padding:18px 22px;
    font-family:"IBM Plex Mono",monospace;
    font-size:0.95rem;
    font-weight:600;
    letter-spacing:0.02em;
  }
  .rule-item summary::-webkit-details-marker{display:none;}
  .rule-item summary .plus{
    font-family:"Big Shoulders Display",sans-serif;
    font-size:1.4rem;
    color:var(--rust-ink);
    line-height:1;
    flex:none;
  }
  .rule-item[open] summary .plus{transform:rotate(45deg);}
  .rule-item .rule-body{
    padding:0 22px 22px;
    color:var(--ink-soft);
    font-size:0.92rem;
    max-width:60ch;
  }
  .rules-note{
    margin-top:28px;
    font-family:"IBM Plex Mono",monospace;
    font-size:0.8rem;
    color:var(--ink-soft);
    border:1px dashed var(--line);
    padding:16px 20px;
    max-width:72ch;
  }

  /* ---------- value props ---------- */
  .values{
    display:grid;gap:18px;
    grid-template-columns:1fr;
  }
  @media (min-width:640px){.values{grid-template-columns:repeat(2,1fr);}}
  @media (min-width:1000px){.values{grid-template-columns:repeat(4,1fr);}}
  .value{
    border:1px solid var(--line);
    padding:20px 20px 18px;
    background:var(--card);
  }
  .value .vnum{font-family:"IBM Plex Mono",monospace;font-size:0.72rem;color:var(--ink-soft);}
  .value h4{font-size:1.05rem; margin:10px 0 8px; text-transform:none; font-family:"Work Sans",sans-serif; font-weight:700;}
  .value p{color:var(--ink-soft);font-size:0.9rem;}

  /* ---------- about ---------- */
  .about{
    display:grid;gap:36px;
    grid-template-columns:1fr;
  }
  @media (min-width:860px){.about{grid-template-columns:0.9fr 1.1fr;}}
  .about-quote{
    font-family:"Big Shoulders Display",sans-serif;
    font-size:clamp(1.5rem,3vw,2rem);
    line-height:1.15;
    text-transform:none;
    letter-spacing:0;
  }
  .about-body p{margin-bottom:16px;color:var(--ink-soft);}
  .about-body p:last-child{margin-bottom:0;}

  /* ---------- final CTA ---------- */
  .cta-tag{
    border:1px dashed var(--line);
    background:var(--card);
    padding:44px;
    display:flex;flex-wrap:wrap;gap:28px;
    align-items:center;justify-content:space-between;
    box-shadow:var(--shadow);
    position:relative;
  }
  .cta-tag::before{
    content:"";
    position:absolute; left:-1px; top:50%; transform:translateY(-50%);
    width:18px;height:18px;border-radius:50%;
    background:var(--sand);
    border:1px dashed var(--line);
  }
  .cta-tag h3{font-size:clamp(1.5rem,3.4vw,2.1rem); max-width:20ch;}
  .cta-tag .ctaform{display:flex;gap:10px;flex-wrap:wrap;}
  .ctaform input[type=email]{
    font-family:"IBM Plex Mono",monospace;
    font-size:0.85rem;
    padding:12px 14px;
    border:1px solid var(--line);
    background:var(--sand-hi);
    color:var(--ink);
    min-width:230px;
    border-radius:2px;
  }
  .ctaform input[type=email]:focus{outline:2px solid var(--rust); outline-offset:1px;}
  .ctaform .consent{
    display:flex;align-items:flex-start;gap:8px;
    flex-basis:100%;
    font-family:"IBM Plex Mono",monospace;
    font-size:0.76rem;
    color:var(--ink-soft);
    margin-top:2px;
    max-width:52ch;
  }
  .ctaform .consent input[type=checkbox]{
    margin-top:3px;
    accent-color:var(--rust);
    flex:none;
  }
  .form-msg{font-family:"IBM Plex Mono",monospace;font-size:0.78rem;color:var(--olive);margin-top:8px;display:none;}
  .form-msg.show{display:block;}

  /* ---------- footer ---------- */
  footer{
    background:var(--gunmetal);
    color:#cfc9b4;
    padding:56px 0 28px;
  }
  .foot-top{
    display:grid;gap:36px;
    grid-template-columns:1fr;
    padding-bottom:36px;
    border-bottom:1px solid #45443a;
  }
  @media (min-width:760px){.foot-top{grid-template-columns:1.3fr repeat(3,1fr);}}
  footer .flogo{
    font-family:"Big Shoulders Stencil Display",sans-serif;
    font-size:1.7rem;color:#f4efe1;
    display:flex;align-items:center;gap:10px;
  }
  footer .flogo .dot{color:var(--rust-ink);}
  footer .flogo .brandmark{width:32px;height:32px;}
  footer p.tag{color:#9b9682;font-size:0.9rem;margin-top:12px;max-width:32ch;}
  footer h5{
    font-family:"IBM Plex Mono",monospace;
    font-size:0.7rem;letter-spacing:0.14em;text-transform:uppercase;
    color:#8f8a76; margin:0 0 14px;
  }
  footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
  footer a{color:#cfc9b4;text-decoration:none;font-size:0.9rem;}
  footer a:hover{color:#fff;}
  .foot-bottom{
    padding-top:22px;
    display:flex;flex-wrap:wrap;gap:10px;
    justify-content:space-between;
    font-family:"IBM Plex Mono",monospace;
    font-size:0.72rem;
    color:#8f8a76;
  }

  .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

  [data-reveal]{opacity:1; transform:none;}
  @media (prefers-reduced-motion: no-preference){
    [data-reveal]{opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease;}
    [data-reveal].in{opacity:1; transform:none;}
  }

  /* mobile nav panel */
  .mobilenav{
    position:fixed; inset:0; z-index:60;
    background:var(--sand);
    display:none;
    flex-direction:column;
    padding:20px 24px;
  }
  .mobilenav.open{display:flex;}
  .mobilenav .mn-top{display:flex;justify-content:space-between;align-items:center;}
  .mobilenav ul{list-style:none;margin:40px 0 0;padding:0;display:flex;flex-direction:column;gap:28px;}
  .mobilenav a{
    font-family:"Big Shoulders Display",sans-serif;
    font-size:2rem;text-transform:uppercase;text-decoration:none;color:var(--ink);
  }
  .closebtn{border:1px solid var(--line);background:none;width:38px;height:38px;border-radius:2px;}

  /* ---------- back to top ---------- */
  .totop{
    position:fixed;
    right:20px;bottom:20px;
    z-index:50;
    width:46px;height:46px;
    display:flex;align-items:center;justify-content:center;
    background:var(--rust);
    color:#fbf3e7;
    border:none;border-radius:2px;
    box-shadow:0 3px 10px rgba(0,0,0,0.25);
    cursor:pointer;
    opacity:0;
    transform:translateY(10px);
    pointer-events:none;
    transition:opacity .25s ease, transform .25s ease, background .15s ease;
  }
  .totop.show{opacity:1;transform:translateY(0);pointer-events:auto;}
  .totop:hover{background:color-mix(in srgb, var(--rust) 88%, black);}
  .totop svg{width:18px;height:18px;}
  @media (prefers-reduced-motion: reduce){.totop{transition:opacity .01ms;}}

  /* ---------- legal / handelsbetingelser ---------- */
  .legalwrap{max-width:760px;}
  .legalwrap h3{
    font-family:"Big Shoulders Display",sans-serif;
    text-transform:none;
    letter-spacing:0;
    font-size:1.3rem;
    margin:34px 0 10px;
  }
  .legalwrap h3:first-of-type{margin-top:0;}
  .legalwrap p{color:var(--ink-soft);margin-bottom:14px;font-size:0.96rem;}
  .legalwrap .fillin{color:var(--rust-ink);border-bottom:1px dashed var(--rust-ink);}
  .legalnote{
    font-family:"IBM Plex Mono",monospace;
    font-size:0.78rem;
    color:var(--ink-soft);
    border:1px dashed var(--line);
    padding:14px 18px;
    margin-bottom:32px;
    max-width:760px;
  }

  /* ---------- Tagtelte icon hover -> model dropdown ---------- */
  .cat-icon-trigger{
    position:relative;
    display:inline-flex;
    align-items:center;justify-content:center;
    width:56px;height:52px;
    margin:-10px 0 4px -10px;
    border-radius:4px;
    cursor:pointer;
    transition:background .15s ease;
  }
  .cat-icon-trigger:hover,
  .cat-icon-trigger:focus-within,
  .cat-icon-trigger[aria-expanded="true"]{
    background:color-mix(in srgb, var(--rust) 12%, transparent);
  }
  .cat-icon-trigger:focus-visible{outline:2px solid var(--rust); outline-offset:2px;}
  .cat-icon-caret{
    position:absolute; bottom:0; right:0;
    width:14px;height:14px;border-radius:50%;
    background:var(--card); border:1px solid var(--line);
    display:flex;align-items:center;justify-content:center;
    color:var(--rust-ink);
    pointer-events:none;
  }
  .cat-icon-caret svg{width:7px;height:7px;transition:transform .18s ease;}
  .cat-icon-trigger:hover .cat-icon-caret svg,
  .cat-icon-trigger:focus-within .cat-icon-caret svg{transform:translateY(1px);}

  .cat-dropdown{
    position:absolute; left:0; top:calc(100% + 8px);
    width:max(230px,100%);
    background:var(--sand-hi);
    border:1px solid var(--line);
    box-shadow:0 16px 32px rgba(0,0,0,0.16);
    padding:.4rem;
    opacity:0; visibility:hidden; transform:translateY(-6px);
    pointer-events:none;
    transition:opacity .15s ease, transform .15s ease, visibility .15s;
    z-index:5;
  }
  .cat-icon-trigger:hover .cat-dropdown,
  .cat-icon-trigger:focus-within .cat-dropdown,
  .cat-icon-trigger[aria-expanded="true"] .cat-dropdown{
    opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto;
  }
  .cd-item{
    display:flex;align-items:center;gap:.7em;
    padding:.6em .7em;
    font-family:"Work Sans",sans-serif;
    font-size:.88rem;
    color:var(--ink);
    text-decoration:none;
    border-radius:3px;
  }
  .cd-item + .cd-item{margin-top:2px;}
  .cd-item .dot{width:.5em;height:.5em;border-radius:50%;background:var(--line);flex:none;}
  .cd-item:hover, .cd-item:focus-visible{background:color-mix(in srgb, var(--rust) 12%, transparent);}
  .cd-item:hover .dot, .cd-item:focus-visible .dot{background:var(--rust);}
  .cd-item .note{margin-left:auto;color:var(--ink-soft);font-size:.82em;}
  @media (prefers-reduced-motion: reduce){
    .cat-icon-trigger, .cat-dropdown, .cat-icon-caret svg{transition:none;}
  }

  /* ---------- language switcher ---------- */
  .langswitch{
    position:relative;
    display:inline-flex;
    align-items:center;
  }
  .langswitch select{
    appearance:none;-webkit-appearance:none;-moz-appearance:none;
    font-family:"IBM Plex Mono", monospace;
    font-size:0.76rem;
    letter-spacing:0.06em;
    text-transform:uppercase;
    font-weight:600;
    color:var(--ink);
    background:var(--card);
    border:1px solid var(--line);
    border-radius:2px;
    padding:9px 26px 9px 12px;
    cursor:pointer;
  }
  .langswitch select:focus-visible{outline:2px solid var(--rust); outline-offset:1px;}
  .langswitch::after{
    content:"";
    position:absolute; right:9px; top:50%;
    width:7px;height:7px;
    border-right:1.4px solid var(--ink-soft);
    border-bottom:1.4px solid var(--ink-soft);
    transform:translateY(-65%) rotate(45deg);
    pointer-events:none;
  }
  .mobilenav .langswitch{margin-top:32px;}
  .mobilenav .langswitch select{font-size:0.9rem;padding:12px 30px 12px 14px;}

/* ---------- */

.product-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:20px;}
.product-modal.open{display:flex;}
.pm-backdrop{position:absolute;inset:0;background:rgba(20,20,19,0.72);}
.pm-panel{position:relative;background:#faf9f5;color:#141413;max-width:640px;width:100%;max-height:86vh;overflow-y:auto;border-radius:4px;padding:32px 28px;box-shadow:0 20px 60px rgba(0,0,0,0.35);}
.pm-close{position:absolute;top:14px;right:14px;background:none;border:none;font-size:22px;line-height:1;cursor:pointer;color:#141413;padding:6px 10px;}
.pm-close:hover{opacity:0.6;}
.pm-eyebrow{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:0.06em;color:#8a8578;text-transform:uppercase;margin:0 0 6px;}
.pm-title{font-size:1.6rem;margin:0 0 4px;font-weight:700;}
.pm-price{font-family:"IBM Plex Mono",monospace;font-size:1.1rem;margin:6px 0 14px;color:#a5341f;}
.pm-desc{margin:0 0 18px;line-height:1.5;}
.pm-specs{width:100%;border-collapse:collapse;margin-bottom:18px;font-size:0.92rem;}
.pm-specs tr{border-bottom:1px solid #e4e1d8;}
.pm-specs td{padding:8px 0;}
.pm-specs td:first-child{color:#8a8578;padding-right:12px;white-space:nowrap;}
.pm-included-label{font-weight:700;margin:0 0 6px;font-size:0.95rem;}
.pm-included{margin:0 0 22px;line-height:1.5;font-size:0.92rem;color:#3a3833;}
.pm-download{display:inline-block;background:#141413;color:#faf9f5;text-decoration:none;padding:12px 22px;font-size:0.9rem;border-radius:2px;}
.pm-download:hover{opacity:0.85;}