:root{
    --ink:#2B2420;
    --ink-soft:#6B6058;
    --paper:#FDFBF8;
    --paper-raised:#FFFFFF;
    --line:#E9E2D8;
    --gold:#AA5590;
    --gold-deep:#833C6D;
    --pine:#823C6B;
    --pine-deep:#68304F;
    --font-serif:'Source Serif 4', Georgia, 'Times New Roman', serif;
    --font-sans:'IBM Plex Sans', 'Segoe UI', Arial, sans-serif;
  }
  :root:not([data-theme="light"]) {
    @media (prefers-color-scheme: dark) {
      --ink:#EFEAE5;
      --ink-soft:#C2B7AF;
      --paper:#2A2320;
      --paper-raised:#332B27;
      --line:#473D37;
      --gold:#E39CC4;
      --gold-deep:#EFB6D6;
      --pine:#9C5488;
      --pine-deep:#B06B9A;
    }
  }
  :root[data-theme="dark"]{
    --ink:#EFEAE5;
    --ink-soft:#C2B7AF;
    --paper:#2A2320;
    --paper-raised:#332B27;
    --line:#473D37;
    --gold:#E39CC4;
    --gold-deep:#EFB6D6;
    --pine:#9C5488;
    --pine-deep:#B06B9A;
  }

  /* ---------- Intro overlay ---------- */
  .intro-overlay{
    position:fixed;
    inset:0;
    z-index:999;
    background:var(--paper);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    animation:introOverlayOut 1.9s cubic-bezier(.22,.61,.36,1) forwards;
  }
  @keyframes introOverlayOut{
    0%{ opacity:1; visibility:visible; }
    55%{ opacity:1; visibility:visible; }
    100%{ opacity:0; visibility:hidden; }
  }
  .intro-logo{
    height:52px;
    width:auto;
    opacity:0;
    transform:scale(0.85);
    animation:introLogoIn .7s cubic-bezier(.22,.61,.36,1) .15s forwards;
  }
  @keyframes introLogoIn{ to{ opacity:1; transform:scale(1); } }
  .intro-line{
    display:block;
    width:0;
    height:2px;
    background:var(--gold);
    margin:16px auto 0;
    animation:introLineGrow .6s cubic-bezier(.22,.61,.36,1) .55s forwards;
  }
  @keyframes introLineGrow{ to{ width:64px; } }
  @media (prefers-reduced-motion: reduce){
    .intro-overlay{ animation:none; opacity:0; visibility:hidden; }
  }

  /* ---------- Ornamental divider ---------- */
  .ornament{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:26px 0;
    background:var(--paper);
  }
  .ornament svg{ display:block; overflow:visible; }
  .ornament line{ stroke:var(--line); stroke-width:1; }
  .ornament .ornament-mark{ fill:var(--gold); }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:var(--font-sans);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;}
  .wrap{
    max-width:1120px;
    margin:0 auto;
    padding:0 32px;
  }
  section{ scroll-margin-top: 90px; }

  /* ---------- Scroll progress ---------- */
  .progress-bar{
    position:fixed; top:0; left:0; height:2px; width:0%;
    background:var(--gold);
    z-index:80;
    transition:width .08s linear;
  }

  /* ---------- Reveal-on-scroll ---------- */
  .reveal{
    opacity:0;
    transform:translateY(16px);
    transition:opacity .6s cubic-bezier(.22,.61,.36,1), transform .6s cubic-bezier(.22,.61,.36,1);
  }
  .reveal.is-visible{ opacity:1; transform:translateY(0); }
  .reveal-group > *{
    opacity:0;
    transform:translateY(14px);
    transition:opacity .55s cubic-bezier(.22,.61,.36,1), transform .55s cubic-bezier(.22,.61,.36,1);
  }
  .reveal-group.is-visible > *{ opacity:1; transform:translateY(0); }
  .reveal-group.is-visible > *:nth-child(1){ transition-delay:.02s; }
  .reveal-group.is-visible > *:nth-child(2){ transition-delay:.09s; }
  .reveal-group.is-visible > *:nth-child(3){ transition-delay:.16s; }
  .reveal-group.is-visible > *:nth-child(4){ transition-delay:.23s; }
  .reveal-group.is-visible > *:nth-child(5){ transition-delay:.30s; }
  .reveal-group.is-visible > *:nth-child(6){ transition-delay:.37s; }
  .reveal-group.is-visible > *:nth-child(7){ transition-delay:.44s; }
  @media (prefers-reduced-motion: reduce){
    .reveal, .reveal-group > *{ opacity:1; transform:none; transition:none; }
  }

  /* ---------- Header ---------- */
  header{
    position:sticky; top:0; z-index:50;
    background:color-mix(in srgb, var(--paper) 88%, transparent);
    backdrop-filter: blur(10px);
    border-bottom:1px solid var(--line);
    transition:box-shadow .25s ease;
  }
  header.is-scrolled{
    box-shadow:0 8px 24px rgba(0,0,0,0.06);
  }
  .nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:20px 32px;
    max-width:1120px; margin:0 auto;
    transition:padding .25s ease;
  }
  header.is-scrolled .nav{ padding:14px 32px; }
  .brand{
    text-decoration:none;
    color:var(--ink);
    display:flex;
    align-items:center;
    gap:12px;
  }
  .brand-logo{
    display:block;
    flex-shrink:0;
    height:46px;
    width:auto;
    background:#FFFFFF;
    padding:6px 12px;
    border-radius:4px;
    box-shadow:0 1px 3px rgba(0,0,0,0.08), 0 4px 14px rgba(0,0,0,0.05);
    transition:height .25s ease;
  }
  header.is-scrolled .brand-logo{ height:38px; }
  .footer-logo{ height:38px; }
  .brand small{
    font-family:var(--font-sans);
    font-size:0.62rem;
    font-weight:500;
    color:var(--ink-soft);
    letter-spacing:.06em;
    max-width:9ch;
    line-height:1.3;
  }
  nav.links{
    display:flex; gap:34px;
    font-size:0.95rem;
  }
  nav.links a{
    text-decoration:none;
    color:var(--ink-soft);
    transition:color .18s ease;
    position:relative;
    padding-bottom:4px;
  }
  nav.links a::after{
    content:"";
    position:absolute;
    left:0; bottom:0;
    width:100%; height:1px;
    background:var(--gold);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .25s ease;
  }
  nav.links a:hover::after, nav.links a.is-active::after{ transform:scaleX(1); }
  nav.links a:hover{ color:var(--ink); }
  nav.links a.is-active{ color:var(--ink); }
  .cta{
    display:inline-block;
    background:var(--pine);
    color:#F7F4EC;
    padding:11px 22px;
    border-radius:3px;
    text-decoration:none;
    font-size:0.92rem;
    font-weight:500;
    white-space:nowrap;
    transition:background .18s ease, transform .18s ease, box-shadow .18s ease;
  }
  .cta:hover{ background:var(--pine-deep); transform:translateY(-2px); box-shadow:0 10px 20px -8px rgba(104,48,79,0.45); }
  .cta:active{ transform:translateY(0); box-shadow:none; }
  .nav-right{ display:flex; align-items:center; gap:30px; }
  .nav-toggle{ display:none; }

  @keyframes heroRise{
    from{ opacity:0; transform:translateY(18px); }
    to{ opacity:1; transform:translateY(0); }
  }
  .hero-anim{ animation:heroRise .8s cubic-bezier(.22,.61,.36,1) both; }
  .hero-anim-1{ animation-delay:.05s; }
  .hero-anim-2{ animation-delay:.16s; }
  .hero-anim-3{ animation-delay:.27s; }
  .hero-anim-4{ animation-delay:.38s; }
  @media (prefers-reduced-motion: reduce){ .hero-anim{ animation:none; opacity:1; transform:none; } }

  /* ---------- Icon badges ---------- */
  .icon-badge{
    width:46px; height:46px;
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:color-mix(in srgb, var(--gold) 14%, var(--paper-raised));
    color:var(--gold-deep);
    margin-bottom:18px;
    flex-shrink:0;
  }
  .icon-badge svg{ width:22px; height:22px; }
  .service-card:hover .icon-badge{ background:color-mix(in srgb, var(--gold) 22%, var(--paper-raised)); }
  .how-card .icon-badge{
    width:40px; height:40px;
    background:transparent;
    border:1.4px solid var(--gold);
    color:var(--gold-deep);
    margin-bottom:16px;
  }
  .how-card .icon-badge svg{ width:19px; height:19px; }

  /* ---------- Hero decoration ---------- */
  .hero{ position:relative; overflow:hidden; }
  .hero::before{
    content:"";
    position:absolute;
    top:-220px; right:-160px;
    width:560px; height:560px;
    border-radius:50%;
    background:radial-gradient(circle, color-mix(in srgb, var(--gold) 20%, transparent) 0%, transparent 68%);
    pointer-events:none;
  }
  .hero::after{
    content:"";
    position:absolute;
    inset:0;
    background-image:radial-gradient(color-mix(in srgb, var(--ink) 7%, transparent) 1px, transparent 1px);
    background-size:26px 26px;
    -webkit-mask-image:linear-gradient(to bottom, black, transparent 70%);
    mask-image:linear-gradient(to bottom, black, transparent 70%);
    pointer-events:none;
  }
  .hero-inner{ position:relative; z-index:1; }
  .hero{
    padding:96px 32px 88px;
    border-bottom:1px solid var(--line);
  }
  .hero-inner{
    max-width:1120px; margin:0 auto;
    display:grid;
    grid-template-columns:1.4fr 1fr;
    gap:64px;
    align-items:end;
  }
  .eyebrow-est{
    font-family:var(--font-serif);
    font-style:italic;
    color:var(--gold-deep);
    font-size:1.05rem;
    margin:0 0 18px;
  }
  h1{
    font-family:var(--font-serif);
    font-weight:500;
    font-size:clamp(2.4rem, 4.6vw, 3.6rem);
    line-height:1.12;
    margin:0 0 26px;
    max-width:16ch;
  }
  .hero p.lede{
    font-size:1.12rem;
    color:var(--ink-soft);
    max-width:46ch;
    margin:0 0 34px;
  }
  .hero-actions{ display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
  .ghost-link{
    text-decoration:none;
    color:var(--ink);
    font-size:0.95rem;
    padding-bottom:2px;
    background-image:linear-gradient(var(--gold), var(--gold));
    background-repeat:no-repeat;
    background-position:left bottom;
    background-size:0% 1px;
    transition:background-size .25s ease, color .18s ease;
  }
  .ghost-link:hover{ background-size:100% 1px; color:var(--gold-deep); }
  .hero-stats{
    display:flex; flex-direction:column; gap:26px;
    border-left:1px solid var(--line);
    padding-left:40px;
  }
  .stat b{
    display:block;
    font-family:var(--font-serif);
    font-size:2.1rem;
    font-weight:500;
    color:var(--pine);
  }
  .stat b .count-up{
    font-family:inherit;
    font-size:inherit;
    font-weight:inherit;
    color:inherit;
  }
  :root[data-theme="dark"] .stat b, :root:not([data-theme="light"]) .stat b { }
  @media (prefers-color-scheme: dark){ .stat b{ color:var(--gold); } }
  :root[data-theme="dark"] .stat b{ color:var(--gold); }
  .stat span{
    font-size:0.86rem;
    color:var(--ink-soft);
  }

  /* ---------- Section headings ---------- */
  .section-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    gap:24px; margin-bottom:48px;
    flex-wrap:wrap;
  }
  .section-num{
    font-family:var(--font-serif);
    font-style:italic;
    color:var(--gold-deep);
    font-size:1rem;
    margin:0 0 8px;
    display:flex;
    align-items:center;
    gap:10px;
  }
  .section-num::before{
    content:"";
    display:inline-block;
    width:22px;
    height:1px;
    background:var(--gold);
  }
  h2{
    font-family:var(--font-serif);
    font-weight:500;
    font-size:clamp(1.7rem, 2.6vw, 2.2rem);
    margin:0;
    max-width:20ch;
  }
  .section-intro{
    max-width:38ch;
    color:var(--ink-soft);
    font-size:0.98rem;
  }

  /* ---------- O nas ---------- */
  .about{ padding:100px 0; }
  .about-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:start;
  }
  .about-copy p{ margin:0 0 20px; color:var(--ink-soft); font-size:1.02rem; }
  .about-copy p.emph{
    color:var(--ink);
    font-family:var(--font-serif);
    font-size:1.2rem;
    line-height:1.5;
    border-left:2px solid var(--gold);
    padding-left:20px;
  }
  .word-origin{
    background:var(--paper-raised);
    border:1px solid var(--line);
    padding:26px 28px;
    margin-top:8px;
    position:relative;
    overflow:hidden;
  }
  .word-origin::before{
    content:"”";
    position:absolute;
    top:-38px; right:14px;
    font-family:var(--font-serif);
    font-size:8rem;
    line-height:1;
    color:var(--gold);
    opacity:0.1;
    pointer-events:none;
  }
  .word-origin .gr{
    font-family:var(--font-serif);
    font-style:italic;
    font-size:1.3rem;
    color:var(--pine);
  }
  :root[data-theme="dark"] .word-origin .gr{ color:var(--gold); }
  .word-origin p{ margin:8px 0 0; color:var(--ink-soft); font-size:0.94rem; }

  .values-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
  .values-list li{
    padding:22px 0;
    border-top:1px solid var(--line);
    display:flex; gap:20px;
    transition:padding-left .2s ease, border-color .2s ease;
  }
  .values-list li:hover{ padding-left:8px; border-color:var(--gold); }
  .values-list li:last-child{ border-bottom:1px solid var(--line); }
  .values-list .v-label{
    font-family:var(--font-serif);
    font-size:1.05rem;
    color:var(--pine);
    min-width:150px;
  }
  :root[data-theme="dark"] .values-list .v-label{ color:var(--gold); }
  .values-list .v-text{ color:var(--ink-soft); font-size:0.96rem; }

  /* ---------- Storitve ---------- */
  .services{ padding:100px 0; background:var(--paper-raised); }
  .service-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:1px;
    background:var(--line);
    border:1px solid var(--line);
  }
  .service-card{
    background:var(--paper-raised);
    padding:36px 38px;
    transition:background .2s ease;
  }
  .service-card:hover{ background:color-mix(in srgb, var(--paper-raised) 92%, var(--gold) 8%); }
  .service-card h3{
    font-family:var(--font-serif);
    font-weight:500;
    font-size:1.28rem;
    margin:0 0 18px;
    color:var(--ink);
  }
  .service-card ul{
    margin:0; padding:0; list-style:none;
    display:flex; flex-direction:column; gap:11px;
  }
  .service-card li{
    font-size:0.94rem;
    color:var(--ink-soft);
    padding-left:16px;
    position:relative;
  }
  .service-card li::before{
    content:"";
    position:absolute; left:0; top:0.55em;
    width:6px; height:1px;
    background:var(--gold);
    transition:width .18s ease;
  }
  .service-card:hover li::before{ width:10px; }
  .service-card.wide{ grid-column:1 / -1; }
  .service-card.wide ul{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:11px 28px;
  }

  /* ---------- Kako delamo ---------- */
  .how{ padding:100px 0; }
  .how-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:44px;
  }
  .how-card{ padding-top:22px; border-top:2px solid var(--gold); transition:padding-top .2s ease; }
  .how-card:hover{ padding-top:26px; }
  .how-card h3{
    font-family:var(--font-serif);
    font-weight:500;
    font-size:1.15rem;
    margin:0 0 12px;
  }
  .how-card p{ color:var(--ink-soft); font-size:0.95rem; margin:0; }
  .tools-row{
    margin-top:64px;
    display:flex; gap:20px; flex-wrap:wrap;
    align-items:center;
    justify-content:center;
  }
  .tool-pill{
    border:1px solid var(--line);
    padding:12px 20px;
    font-size:0.88rem;
    color:var(--ink-soft);
    background:var(--paper-raised);
    transition:border-color .18s ease, transform .18s ease;
  }
  .tool-pill:hover{ border-color:var(--gold); transform:translateY(-2px); }
  .tool-pill b{ color:var(--ink); font-weight:600; }

  /* ---------- Kontakt ---------- */
  .contact{ padding:100px 0; }
  .business-card{
    max-width:720px;
    margin:0 auto 56px;
  }
  .business-card img{
    width:100%;
    height:auto;
    display:block;
    border-radius:8px;
    box-shadow:0 20px 44px -20px rgba(0,0,0,0.28), 0 2px 8px rgba(0,0,0,0.06);
  }
  .contact-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
  }
  .contact-grid--three{
    grid-template-columns:1fr 1.1fr;
    gap:44px;
    align-items:start;
  }

  .map-card{
    display:block;
    text-decoration:none;
    color:inherit;
    border:1px solid var(--line);
    background:var(--paper-raised);
    overflow:hidden;
    transition:border-color .18s ease, box-shadow .25s ease;
  }
  .map-card:hover{ border-color:var(--gold); box-shadow:0 16px 32px -20px rgba(0,0,0,0.3); }
  .map-svg{ width:100%; height:auto; display:block; transition:transform .5s ease; }
  .map-card:hover .map-svg{ transform:scale(1.03); }
  .map-bg{ fill:var(--paper); }
  .map-river{ fill:none; stroke:var(--pine); stroke-opacity:0.35; stroke-width:5; }
  .map-road{ stroke:var(--line); stroke-width:4; }
  .map-road-minor{ stroke:var(--line); stroke-width:2; }
  .map-blocks rect{ fill:var(--ink); opacity:0.06; }
  .map-pin{ fill:var(--gold-deep); }
  .map-pin-dot{ fill:var(--paper-raised); }
  @keyframes mapPulse{
    0%{ transform:scale(0.6); opacity:0.5; }
    70%{ opacity:0; }
    100%{ transform:scale(1.6); opacity:0; }
  }
  .map-pulse{ fill:var(--gold); opacity:0.14; transform-origin:center; animation:mapPulse 2.6s ease-out infinite; }
  @media (prefers-reduced-motion: reduce){ .map-pulse{ animation:none; } }
  .map-card-copy{
    padding:22px 26px 26px;
    border-top:1px solid var(--line);
    display:flex; flex-direction:column; gap:6px;
  }
  .map-eyebrow{
    font-size:0.78rem;
    color:var(--ink-soft);
    letter-spacing:.02em;
  }
  .map-address{
    font-family:var(--font-serif);
    font-size:1.08rem;
  }
  .map-cta{
    margin-top:8px;
    font-size:0.88rem;
    color:var(--gold-deep);
  }
  :root[data-theme="dark"] .map-cta{ color:var(--gold); }
  .contact-block dl{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:16px 24px;
    margin:0;
  }
  .contact-block dt{
    font-size:0.82rem;
    letter-spacing:.03em;
    color:var(--ink-soft);
    padding-top:2px;
  }
  .contact-block dt::before{
    content:"";
    display:inline-block;
    width:6px; height:6px;
    border-radius:50%;
    background:var(--gold);
    margin-right:7px;
    vertical-align:middle;
  }
  .contact-block dd{
    margin:0;
    font-family:var(--font-serif);
    font-size:1.15rem;
  }
  .contact-block dd a{ text-decoration:none; border-bottom:1px solid var(--gold); }
  .hours-box{
    margin-top:36px;
    background:var(--paper-raised);
    border:1px solid var(--line);
    padding:26px 28px;
  }
  .hours-box h3{
    font-family:var(--font-serif);
    font-size:1.05rem;
    margin:0 0 16px;
    font-weight:500;
  }
  .hours-row{
    display:flex; justify-content:space-between;
    padding:9px 0;
    border-top:1px solid var(--line);
    font-size:0.92rem;
    color:var(--ink-soft);
  }
  .hours-row:first-of-type{ border-top:none; }
  .hours-row b{ color:var(--ink); font-weight:500; }

  /* ---------- Footer ---------- */
  footer{
    padding:44px 0;
    border-top:1px solid var(--line);
  }
  .footer-row{
    display:flex; justify-content:space-between; align-items:center;
    flex-wrap:wrap; gap:16px;
    font-size:0.85rem;
    color:var(--ink-soft);
  }
  .footer-row a{ text-decoration:none; }

  /* ---------- Back to top ---------- */
  .to-top{
    position:fixed;
    right:24px; bottom:24px;
    width:44px; height:44px;
    border-radius:50%;
    background:var(--pine);
    color:#F7F4EC;
    border:none;
    display:flex; align-items:center; justify-content:center;
    cursor:pointer;
    opacity:0; visibility:hidden;
    transform:translateY(10px);
    transition:opacity .25s ease, transform .25s ease, background .18s ease, visibility .25s;
    z-index:60;
    box-shadow:0 10px 24px -8px rgba(0,0,0,0.35);
  }
  .to-top.is-visible{ opacity:1; visibility:visible; transform:translateY(0); }
  .to-top:hover{ background:var(--pine-deep); }
  .to-top svg{ width:18px; height:18px; }

  /* ---------- Responsive ---------- */
  @media (max-width: 860px){
    .nav{ padding:16px 20px; }
    nav.links{ display:none; }
    .wrap{ padding:0 20px; }
    .hero{ padding:56px 20px 56px; }
    .hero-inner{ grid-template-columns:1fr; gap:40px; }
    .hero-stats{ flex-direction:row; border-left:none; border-top:1px solid var(--line); padding-left:0; padding-top:28px; gap:34px; flex-wrap:wrap; }
    .about-grid, .contact-grid, .contact-grid--three{ grid-template-columns:1fr; gap:44px; }
    .map-svg{ max-height:220px; }
    .service-grid{ grid-template-columns:1fr; }
    .service-card.wide ul{ grid-template-columns:1fr 1fr; }
    .how-grid{ grid-template-columns:1fr; gap:36px; }
    .about, .services, .how, .contact{ padding:64px 0; }
    h1{ max-width:none; }
  }
  @media (max-width: 480px){
    .service-card.wide ul{ grid-template-columns:1fr; }
    .contact-form{ padding:26px; }
  }

  :focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
  @media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }