/*
Theme Name: Arhivio V2
Theme URI: https://www.arhivio.com
Author: Arhivio
Description: Svijetla one-page tema za Arhivio platformu.
Version: 1.2.0
Text Domain: arhivio-v2
*/

body.admin-bar .nav { margin-top:32px; }
@media (max-width:782px) { body.admin-bar .nav { margin-top:46px; } }

:root { --ink:#111416; --muted:#667078; --line:#dfe4e7; --paper:#f7f9fa; --cyan:#00fffc; --cyan-soft:#dfffff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#fff; color:var(--ink); font-family:Arial, Helvetica, sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.shell { width:min(1400px, calc(100% - 80px)); margin-inline:auto; }
.nav { height:100px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand img { width:210px; height:66px; object-fit:contain; object-position:left center; }
.nav nav { display:flex; gap:40px; font-size:14px; font-weight:700; }
.nav nav a:hover,.text-link:hover,.mail:hover { opacity:.55; }
.button { min-height:56px; padding:0 24px; display:inline-flex; align-items:center; justify-content:center; gap:32px; border-radius:6px; background:var(--cyan); font-size:14px; font-weight:800; transition:transform .2s, box-shadow .2s; }
.button:hover { transform:translateY(-2px); box-shadow:0 10px 25px rgba(0,255,252,.2); }
.button-small { min-height:46px; padding-inline:18px; gap:20px; }
.hero { min-height:760px; display:grid; grid-template-columns:.85fr 1.15fr; gap:70px; align-items:center; padding-block:90px 105px; }
.kicker,.section-label,.product-eyebrow { text-transform:uppercase; font-size:12px; font-weight:800; letter-spacing:.16em; }
.kicker { display:flex; align-items:center; gap:12px; margin:0 0 28px; }
.kicker span { width:34px; height:3px; background:var(--cyan); }
h1,h2,h3,h4,p { margin-top:0; }
h1 { font-size:clamp(58px,6vw,100px); line-height:.94; letter-spacing:-.065em; margin-bottom:36px; max-width:770px; }
h1 em,h2 em { font-family:Georgia, serif; font-weight:400; }
.lead { max-width:590px; color:var(--muted); font-size:19px; line-height:1.65; margin-bottom:38px; }
.hero-actions { display:flex; align-items:center; gap:34px; }
.text-link { display:inline-flex; gap:16px; align-items:center; padding-block:10px; border-bottom:1px solid var(--ink); font-size:14px; font-weight:800; transition:opacity .2s; }
.hero-visual { position:relative; min-width:0; }
.image-window { overflow:hidden; border-radius:12px; background:#edf2f5; box-shadow:0 28px 70px rgba(25,38,49,.13); }
.image-window img { width:100%; height:100%; object-fit:cover; }
.main-window { aspect-ratio:1.32; transform:rotate(1.2deg); position:relative; z-index:2; }
.cyan-orb { position:absolute; right:-22px; top:-35px; width:130px; aspect-ratio:1; border-radius:50%; background:var(--cyan); z-index:1; }
.statement { background:var(--ink); color:#fff; padding:120px 0 0; }
.statement-grid { display:grid; grid-template-columns:1fr 3fr; gap:40px; }
.section-label { color:#788087; margin-bottom:28px; }
.statement h2,.section-heading h2,.process h2,.cta h2 { font-size:clamp(45px,5vw,76px); line-height:1.02; letter-spacing:-.052em; margin-bottom:55px; max-width:970px; }
.statement-copy { display:grid; grid-template-columns:1fr 1fr; gap:60px; border-top:1px solid #34393d; padding-top:28px; }
.statement-copy p { color:#abb1b5; font-size:16px; line-height:1.7; }
.stats { margin-top:100px; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #34393d; }
.stats-heading { margin-top:90px; }
.stats-heading .section-label { color:#fff; margin-bottom:0; }
.stats-heading + .stats { margin-top:25px; }
.stats div { padding:45px 0 50px; border-right:1px solid #34393d; }
.stats div:not(:first-child) { padding-left:45px; }
.stats div:last-child { border-right:0; }
.stats strong,.stats span { display:block; }
.stats strong { color:var(--cyan); font-size:48px; letter-spacing:-.05em; margin-bottom:8px; }
.stats span { color:#abb1b5; font-size:13px; }
.products { padding-block:140px; }
.section-heading { display:grid; grid-template-columns:1fr 2fr 1fr; gap:35px; align-items:end; margin-bottom:100px; }
.section-heading h2 { margin:0; }
.section-heading>p:last-child { color:var(--muted); line-height:1.7; max-width:370px; margin:0; }
.product { display:grid; grid-template-columns:.72fr 1.28fr; gap:90px; align-items:center; min-height:650px; padding-block:100px; border-top:1px solid var(--line); }
.product-copy { padding-left:55px; position:relative; }
.product-number { position:absolute; left:0; top:2px; font-family:Georgia,serif; color:#abb2b7; font-size:15px; }
.product-eyebrow { color:#828b91; margin-bottom:18px; }
.product-meta { display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.product-meta .product-eyebrow { margin:0; }
.product-status { display:inline-flex; align-items:center; min-height:23px; padding:0 9px; border-radius:20px; background:var(--cyan); color:var(--ink); font-size:10px; font-weight:900; letter-spacing:.12em; }
.product-copy h3 { font-size:54px; letter-spacing:-.055em; margin-bottom:12px; }
.product-copy h4 { font-family:Georgia,serif; font-size:26px; line-height:1.25; font-weight:400; margin-bottom:25px; }
.product-copy>p:not(.product-eyebrow) { color:var(--muted); line-height:1.7; max-width:500px; }
.product-copy ul { list-style:none; padding:22px 0; margin:22px 0 25px; border-top:1px solid var(--line); }
.product-copy li { padding:8px 0 8px 23px; font-size:14px; position:relative; }
.product-copy li:before { content:""; position:absolute; left:0; top:14px; width:7px; height:7px; border-radius:50%; background:var(--cyan); }
.product-visual { position:relative; padding:25px 55px 70px 0; }
.product-main { aspect-ratio:1.53; }
.product-main img,.product-detail img { object-fit:contain; background:#fff; }
.product-detail { position:absolute; width:42%; aspect-ratio:1.35; right:0; bottom:0; border:7px solid #fff; }
.product-b .product-visual { background:var(--cyan-soft); padding-left:45px; padding-top:55px; }
.product-b .product-detail { left:0; right:auto; }
.product-d .product-visual { background:#eef1f4; padding:48px 55px 70px 48px; }
.coming-soon { display:inline-flex; background:var(--cyan-soft); padding:10px 13px; font-size:11px; font-weight:800; letter-spacing:.12em; }
.features { background:var(--paper); padding:110px 0; }
.workflow-heading { display:grid; grid-template-columns:2fr 1fr; gap:80px; align-items:end; margin-bottom:65px; }
.workflow-heading h2 { font-size:clamp(45px,5vw,76px); line-height:1.02; letter-spacing:-.052em; margin:0; }
.workflow-heading h2 em { font-family:Georgia,serif; font-weight:400; }
.workflow-heading>p { color:var(--muted); line-height:1.7; margin:0; max-width:420px; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid var(--line); background:#fff; }
.feature { padding:42px 40px; border-left:1px solid var(--line); position:relative; min-height:360px; }
.feature:first-child { border-left:0; }
.feature:not(:last-child):after { content:"→"; position:absolute; right:-20px; top:62px; z-index:2; width:40px; height:40px; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:50%; background:var(--paper); font-size:18px; }
.feature>span { display:flex; align-items:center; justify-content:center; width:48px; height:48px; background:var(--cyan); border-radius:50%; font-family:Georgia,serif; font-size:15px; margin-bottom:50px; }
.feature-label { color:#778087; font-size:11px!important; font-weight:800; letter-spacing:.14em; text-transform:uppercase; margin-bottom:12px; }
.feature h3 { font-size:25px; line-height:1.18; margin-bottom:16px; max-width:290px; }
.feature p { color:var(--muted); font-size:14px; line-height:1.65; }
.process { padding-block:140px; }
.process-heading { grid-template-columns:1fr 3fr; }
.steps { border-top:1px solid var(--line); }
.step { display:grid; grid-template-columns:.5fr 1fr 2fr; gap:40px; padding:33px 0; border-bottom:1px solid var(--line); align-items:start; }
.step>span { font-family:Georgia,serif; color:#9aa2a8; }
.step h3 { font-size:21px; }
.step p { color:var(--muted); line-height:1.6; max-width:650px; margin:0; }
.cta { background:var(--cyan); padding:115px 0; }
.cta .section-label { color:#3f6262; }
.cta-inner { display:grid; grid-template-columns:2fr 1fr; gap:100px; align-items:end; }
.cta h2 { margin:0; }
.cta-copy p { line-height:1.7; margin-bottom:30px; }
.button-dark { background:var(--ink); color:#fff; margin-bottom:25px; }
.mail { display:block; width:max-content; font-size:13px; border-bottom:1px solid var(--ink); padding-bottom:4px; }
footer { height:130px; display:grid; grid-template-columns:1fr 1fr 1fr; align-items:center; font-size:12px; color:var(--muted); }
footer img { width:150px; height:50px; object-fit:contain; object-position:left center; }
footer p { margin:0; }
footer p:last-child { text-align:right; }

@media (max-width:1000px) {
  .shell { width:min(100% - 40px, 760px); }
  .nav nav { display:none; }
  .hero { grid-template-columns:1fr; padding-top:70px; gap:80px; }
  .hero-copy { max-width:700px; }
  .statement-grid,.section-heading,.product,.cta-inner { grid-template-columns:1fr; }
  .statement-grid { gap:25px; }
  .section-heading { align-items:start; margin-bottom:50px; }
  .section-heading .section-label { margin-bottom:0; }
  .product { gap:40px; padding-block:75px; }
  .product-visual { grid-row:1; }
  .workflow-heading { grid-template-columns:1fr; gap:25px; }
  .feature-grid { grid-template-columns:1fr; }
  .feature { border-left:0; border-top:1px solid var(--line); min-height:auto; }
  .feature:first-child { border-top:0; }
  .feature:not(:last-child):after { content:"↓"; top:auto; right:32px; bottom:-20px; }
  .process-heading { grid-template-columns:1fr; }
  .cta-inner { gap:50px; }
}

@media (max-width:650px) {
  .shell { width:calc(100% - 32px); }
  .nav { height:80px; }
  .brand img { width:165px; height:54px; }
  .nav .button { font-size:0; width:44px; height:44px; min-height:44px; padding:0; gap:0; }
  .nav .button span { font-size:18px; }
  .hero { min-height:auto; padding-block:55px 85px; gap:65px; }
  h1 { font-size:52px; }
  .lead { font-size:17px; }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:14px; }
  .main-window { aspect-ratio:1; }
  .cyan-orb { width:85px; right:-8px; top:-22px; }
  .statement { padding-top:85px; }
  .statement h2,.section-heading h2,.process h2,.cta h2 { font-size:44px; }
  .statement-copy,.stats { grid-template-columns:1fr; }
  .statement-copy { gap:15px; }
  .stats div,.stats div:not(:first-child) { padding:30px 0; border-right:0; border-bottom:1px solid #34393d; }
  .products,.process { padding-block:90px; }
  .product { min-height:0; padding-block:60px; }
  .product-copy { padding-left:0; padding-top:35px; }
  .product-number { top:0; }
  .product-copy h3 { font-size:43px; }
  .product-visual,.product-b .product-visual,.product-d .product-visual { padding:20px 24px 45px 20px; }
  .product-b .product-visual,.product-d .product-visual { padding-top:30px; }
  .product-detail { border-width:4px; }
  .features { padding-block:80px; }
  .feature { padding:36px 28px; }
  .feature>span { margin-bottom:35px; }
  .step { grid-template-columns:45px 1fr; gap:10px; }
  .step p { grid-column:2; }
  .cta { padding-block:85px; }
  footer { height:auto; padding-block:35px; grid-template-columns:1fr; gap:18px; }
  footer p:last-child { text-align:left; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } * { transition:none !important; } }