.elementor-7 .elementor-element.elementor-element-3386d112{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-7 .elementor-element.elementor-element-3fe172a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-7 .elementor-element.elementor-element-fdd2968{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-7 .elementor-element.elementor-element-1d021ba{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-7 .elementor-element.elementor-element-0673886{--display:flex;}.elementor-7 .elementor-element.elementor-element-6a9ef3d{--display:flex;}.elementor-7 .elementor-element.elementor-element-98e0032{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-7 .elementor-element.elementor-element-73142df{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-9071154 */:root{
  /* Boje */
  --arc-porcelain:#ECE9E2;
  --arc-porcelain-soft:#F5F3EE;
  --arc-ink:#1E2A28;
  --arc-graphite:#6E6A63;
  --arc-teal:#3F6659;
  --arc-teal-soft:#DCE6E2;
  --arc-blush:#D98E86;
  --arc-line:#DAD5CB;
  --arc-white:#FFFFFF;

  /* Tipografija */
  --arc-font-display:'Instrument Serif', serif;
  --arc-font-body:'Hanken Grotesk', sans-serif;
  --arc-font-mono:'Space Mono', monospace;

  /* Razmaci */
  --arc-space-xs:8px;
  --arc-space-sm:16px;
  --arc-space-md:24px;
  --arc-space-lg:40px;
  --arc-space-xl:72px;
  --arc-space-xxl:120px;

  /* Oblik / sjena / kretanje */
  --arc-radius-sm:4px;
  --arc-radius-arch:200px 200px 6px 6px; /* signature "luk" oblik za slike */
  --arc-shadow-sm:0 4px 16px rgba(30,42,40,.06);
  --arc-shadow-md:0 16px 40px rgba(30,42,40,.10);
  --arc-shadow-lg:0 28px 70px rgba(30,42,40,.14);
  --arc-transition:.5s cubic-bezier(.19,1,.22,1);
  --arc-max:1240px;
}

/* Reset osnovnih elemenata unutar sekcija */
.arc-section *{box-sizing:border-box}

/* Layout */
.arc-section{
  background-color:var(--arc-porcelain);
  padding:var(--arc-space-xxl) 0;
}
.arc-container{
  max-width:var(--arc-max);
  margin:0 auto;
  padding:0 var(--arc-space-md);
}

/* Tipografija */
.arc-eyebrow{
  font-family:var(--arc-font-mono);
  font-size:.75rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--arc-teal);
  display:inline-block;
  margin-bottom:var(--arc-space-sm);
}
.arc-h1{
  font-family:var(--arc-font-display);
  font-weight:400;
  font-size:clamp(2.6rem,5vw,4.6rem);
  line-height:1.08;
  color:var(--arc-ink);
  letter-spacing:-0.01em;
}
.arc-h1 em, .arc-h2 em{font-style:italic;color:var(--arc-teal)}
.arc-h2{
  font-family:var(--arc-font-display);
  font-weight:400;
  font-size:clamp(2.1rem,3.6vw,3.1rem);
  line-height:1.15;
  color:var(--arc-ink);
}
.arc-h3{
  font-family:var(--arc-font-body);
  font-weight:600;
  font-size:1.2rem;
  color:var(--arc-ink);
}
.arc-body{
  font-family:var(--arc-font-body);
  font-size:1.02rem;
  line-height:1.75;
  color:var(--arc-graphite);
}
.arc-mono-label{
  font-family:var(--arc-font-mono);
  font-size:.8rem;
  letter-spacing:.04em;
  color:var(--arc-graphite);
}

/* Gumbi */
.arc-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:16px 28px;
  font-family:var(--arc-font-body);
  font-weight:600;
  font-size:.95rem;
  text-decoration:none;
  border-radius:var(--arc-radius-sm);
  transition:var(--arc-transition);
}
.arc-btn-primary{
  background:var(--arc-ink);
  color:var(--arc-white);
  border:1px solid var(--arc-ink);
}
.arc-btn-primary:hover{background:var(--arc-teal);border-color:var(--arc-teal);transform:translateY(-2px)}
.arc-btn-outline{
  background:transparent;
  color:var(--arc-ink);
  border:1px solid var(--arc-line);
}
.arc-btn-outline:hover{border-color:var(--arc-ink);transform:translateY(-2px)}

/* Linija / razdjelnik */
.arc-line{width:48px;height:1px;background:var(--arc-teal);margin:var(--arc-space-md) 0}

/* Kartice */
.arc-card{
  background:var(--arc-white);
  border:1px solid var(--arc-line);
  border-radius:var(--arc-radius-sm);
  padding:var(--arc-space-lg);
  transition:var(--arc-transition);
}
.arc-card:hover{box-shadow:var(--arc-shadow-md);transform:translateY(-4px)}

/* Signature: "luk" okvir za fotografije (arhitektonski svod = dentalni luk) */
.arc-arch-frame{border-radius:var(--arc-radius-arch);overflow:hidden}

/* Scroll reveal */
.arc-reveal{opacity:0;transform:translateY(28px);transition:opacity .9s ease, transform .9s cubic-bezier(.19,1,.22,1)}
.arc-reveal.arc-visible{opacity:1;transform:translateY(0)}

/* Scroll progress bar (ubacuje ga JS) */
.arc-scroll-progress{position:fixed;top:0;left:0;height:3px;background:var(--arc-teal);width:0%;z-index:9999}

@media(max-width:900px){
  .arc-section{padding:var(--arc-space-xl) 0}
}/* End custom CSS */
/* Start custom CSS */# Faza 1 v2 — Globalni Design System "Arhitektura Osmijeha" (Elementor)

## Upute

Ovaj CSS zalijepi u **Elementor → Page Settings → Custom CSS** (zamjenjuje stari Faza 1 blok).
Google Fonts za dodati u Elementor (ili `<link>` u Custom Code/Header): **Instrument Serif**, **Hanken Grotesk**, **Space Mono**.

```css
:root{
  /* Boje */
  --arc-porcelain:#ECE9E2;
  --arc-porcelain-soft:#F5F3EE;
  --arc-ink:#1E2A28;
  --arc-graphite:#6E6A63;
  --arc-teal:#3F6659;
  --arc-teal-soft:#DCE6E2;
  --arc-blush:#D98E86;
  --arc-line:#DAD5CB;
  --arc-white:#FFFFFF;

  /* Tipografija */
  --arc-font-display:'Instrument Serif', serif;
  --arc-font-body:'Hanken Grotesk', sans-serif;
  --arc-font-mono:'Space Mono', monospace;

  /* Razmaci */
  --arc-space-xs:8px;
  --arc-space-sm:16px;
  --arc-space-md:24px;
  --arc-space-lg:40px;
  --arc-space-xl:72px;
  --arc-space-xxl:120px;

  /* Oblik / sjena / kretanje */
  --arc-radius-sm:4px;
  --arc-radius-arch:200px 200px 6px 6px; /* signature "luk" oblik za slike */
  --arc-shadow-sm:0 4px 16px rgba(30,42,40,.06);
  --arc-shadow-md:0 16px 40px rgba(30,42,40,.10);
  --arc-shadow-lg:0 28px 70px rgba(30,42,40,.14);
  --arc-transition:.5s cubic-bezier(.19,1,.22,1);
  --arc-max:1240px;
}

/* Reset osnovnih elemenata unutar sekcija */
.arc-section *{box-sizing:border-box}

/* Layout */
.arc-section{
  background-color:var(--arc-porcelain);
  padding:var(--arc-space-xxl) 0;
}
.arc-container{
  max-width:var(--arc-max);
  margin:0 auto;
  padding:0 var(--arc-space-md);
}

/* Tipografija */
.arc-eyebrow{
  font-family:var(--arc-font-mono);
  font-size:.75rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--arc-teal);
  display:inline-block;
  margin-bottom:var(--arc-space-sm);
}
.arc-h1{
  font-family:var(--arc-font-display);
  font-weight:400;
  font-size:clamp(2.6rem,5vw,4.6rem);
  line-height:1.08;
  color:var(--arc-ink);
  letter-spacing:-0.01em;
}
.arc-h1 em, .arc-h2 em{font-style:italic;color:var(--arc-teal)}
.arc-h2{
  font-family:var(--arc-font-display);
  font-weight:400;
  font-size:clamp(2.1rem,3.6vw,3.1rem);
  line-height:1.15;
  color:var(--arc-ink);
}
.arc-h3{
  font-family:var(--arc-font-body);
  font-weight:600;
  font-size:1.2rem;
  color:var(--arc-ink);
}
.arc-body{
  font-family:var(--arc-font-body);
  font-size:1.02rem;
  line-height:1.75;
  color:var(--arc-graphite);
}
.arc-mono-label{
  font-family:var(--arc-font-mono);
  font-size:.8rem;
  letter-spacing:.04em;
  color:var(--arc-graphite);
}

/* Gumbi */
.arc-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:16px 28px;
  font-family:var(--arc-font-body);
  font-weight:600;
  font-size:.95rem;
  text-decoration:none;
  border-radius:var(--arc-radius-sm);
  transition:var(--arc-transition);
}
.arc-btn-primary{
  background:var(--arc-ink);
  color:var(--arc-white);
  border:1px solid var(--arc-ink);
}
.arc-btn-primary:hover{background:var(--arc-teal);border-color:var(--arc-teal);transform:translateY(-2px)}
.arc-btn-outline{
  background:transparent;
  color:var(--arc-ink);
  border:1px solid var(--arc-line);
}
.arc-btn-outline:hover{border-color:var(--arc-ink);transform:translateY(-2px)}

/* Linija / razdjelnik */
.arc-line{width:48px;height:1px;background:var(--arc-teal);margin:var(--arc-space-md) 0}

/* Kartice */
.arc-card{
  background:var(--arc-white);
  border:1px solid var(--arc-line);
  border-radius:var(--arc-radius-sm);
  padding:var(--arc-space-lg);
  transition:var(--arc-transition);
}
.arc-card:hover{box-shadow:var(--arc-shadow-md);transform:translateY(-4px)}

/* Signature: "luk" okvir za fotografije (arhitektonski svod = dentalni luk) */
.arc-arch-frame{border-radius:var(--arc-radius-arch);overflow:hidden}

/* Scroll reveal */
.arc-reveal{opacity:0;transform:translateY(28px);transition:opacity .9s ease, transform .9s cubic-bezier(.19,1,.22,1)}
.arc-reveal.arc-visible{opacity:1;transform:translateY(0)}

/* Scroll progress bar (ubacuje ga JS) */
.arc-scroll-progress{position:fixed;top:0;left:0;height:3px;background:var(--arc-teal);width:0%;z-index:9999}

/* Ujednačena "grading" obrada za sve fotografije — spaja stock i vlastite slike u isti vizualni jezik */
.arc-photo{
  filter:grayscale(8%) contrast(1.05) brightness(1.02) saturate(0.9);
}

/* Header / Navigacija */
.arc-header{
  position:sticky;
  top:0;
  z-index:500;
  background:var(--arc-porcelain);
  border-bottom:1px solid transparent;
  transition:var(--arc-transition);
}
.arc-header.arc-scrolled{
  border-bottom-color:var(--arc-line);
  box-shadow:var(--arc-shadow-sm);
}
.arc-header-inner{
  max-width:var(--arc-max);
  margin:0 auto;
  padding:18px var(--arc-space-md);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.arc-header-logo{
  font-family:var(--arc-font-display);
  font-size:1.4rem;
  color:var(--arc-ink);
  text-decoration:none;
}
.arc-header-nav{display:flex;align-items:center;gap:var(--arc-space-lg)}
.arc-header-nav a{
  font-family:var(--arc-font-body);
  font-size:.92rem;
  color:var(--arc-ink);
  text-decoration:none;
  position:relative;
}
.arc-header-nav a::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-4px;
  height:1px;
  background:var(--arc-teal);
  transform:scaleX(0);
  transform-origin:left;
  transition:var(--arc-transition);
}
.arc-header-nav a:hover::after{transform:scaleX(1)}
.arc-header-links{display:flex;align-items:center;gap:var(--arc-space-lg)}
.arc-header-phone{font-family:var(--arc-font-mono);font-size:.85rem;color:var(--arc-graphite);text-decoration:none}
.arc-header-mobile-toggle{display:none;background:none;border:none;cursor:pointer;padding:4px}

@media(max-width:900px){
  .arc-section{padding:var(--arc-space-xl) 0}
  .arc-header-nav{
    position:fixed;
    top:64px;left:0;right:0;
    background:var(--arc-porcelain);
    border-bottom:1px solid var(--arc-line);
    flex-direction:column;
    align-items:flex-start;
    gap:var(--arc-space-md);
    padding:var(--arc-space-md);
    transform:translateY(-12px);
    opacity:0;
    pointer-events:none;
    transition:var(--arc-transition);
  }
  .arc-header-nav.arc-nav-open{transform:translateY(0);opacity:1;pointer-events:auto}
  .arc-header-phone{display:none}
  .arc-header-mobile-toggle{display:block}
}
```/* End custom CSS */