/* ===================================================================
   ASTRA ENERCO INTERNATIONAL — zajednički stil za sve strane
   Boje preuzete iz logotipa: #0074A6 (plava) · #2E7D32 (zelena)
   =================================================================== */
:root{
  --navy:        #002B6B;
  --navy-dark:   #001C4A;
  --navy-mid:    #003C90;
  --blue:        #0074A6;
  --blue-light:  #0d94cc;
  --green:       #2E7D32;
  --green-light: #4f9e32;

  --ink:         #16202c;
  --ink-soft:    #5a6874;
  --line:        #e3e9ef;
  --bg:          #ffffff;
  --bg-soft:     #f4f8fa;

  --wrap: 1140px;
  --radius: 14px;
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
img{max-width:100%; height:auto; display:block;}
a{color:var(--blue); text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 24px;}

/* ---------- HEADER ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.94); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex; align-items:center; justify-content:space-between; height:82px; gap:24px;}
.brand img{height:46px; width:auto;}
.nav-links{display:flex; align-items:center; gap:30px;}
.nav-links a{color:var(--ink); font-size:.94rem; font-weight:500;}
.nav-links a:hover{color:var(--blue); text-decoration:none;}
.nav-links a.active{color:var(--blue);}
.nav-cta{
  background:var(--navy); color:#fff !important; padding:11px 22px;
  border-radius:8px; font-size:.92rem; font-weight:600; white-space:nowrap;
  transition:background .18s;
}
.nav-cta:hover{background:var(--navy-mid); text-decoration:none;}

/* ---------- HERO (početna) ---------- */
.hero{
  position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 50%, #00417f 100%);
  padding:104px 0 112px;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(680px 420px at 88% -8%, rgba(46,125,50,.34) 0%, transparent 66%),
    radial-gradient(560px 400px at 12% 108%, rgba(0,116,166,.36) 0%, transparent 68%);
  pointer-events:none;
}
.hero .wrap{position:relative; z-index:1;}
.hero-inner{max-width:780px;}
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.24);
  padding:7px 17px; border-radius:100px;
  font-size:.77rem; font-weight:600; letter-spacing:.11em; text-transform:uppercase;
  margin-bottom:26px;
}
.eyebrow span{width:7px; height:7px; border-radius:50%; background:var(--green-light);
  box-shadow:0 0 0 4px rgba(79,158,50,.24);}
.hero h1{
  margin:0 0 22px; font-size:clamp(2.05rem, 4.9vw, 3.4rem);
  line-height:1.14; font-weight:700; letter-spacing:-.025em;
}
.hero h1 em{
  font-style:normal;
  background:linear-gradient(95deg, #7fd45c 0%, #40b8e8 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero p{margin:0 0 36px; font-size:clamp(1.02rem,1.9vw,1.18rem); color:rgba(255,255,255,.87); max-width:660px;}
.btn-row{display:flex; flex-wrap:wrap; gap:14px; margin-bottom:56px;}
.btn{
  display:inline-block; padding:15px 32px; border-radius:9px;
  font-weight:600; font-size:1rem; transition:transform .16s, background .18s, box-shadow .18s;
}
.btn:hover{text-decoration:none; transform:translateY(-2px);}
.btn-primary{background:var(--green); color:#fff !important; box-shadow:0 8px 24px rgba(46,125,50,.34);}
.btn-primary:hover{background:var(--green-light);}
.btn-ghost{background:rgba(255,255,255,.09); color:#fff !important; border:1px solid rgba(255,255,255,.34);}
.btn-ghost:hover{background:rgba(255,255,255,.18);}

.hero-strip{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.16);
  border-radius:12px; overflow:hidden;
}
.hero-strip div{
  background:rgba(0,20,55,.42); padding:20px 22px;
  font-size:.93rem; font-weight:600; color:rgba(255,255,255,.93);
}
.hero-strip small{
  display:block; font-size:.7rem; font-weight:600; letter-spacing:.11em;
  text-transform:uppercase; color:rgba(255,255,255,.5); margin-bottom:5px;
}

/* ---------- ZAGLAVLJE PODSTRANE ---------- */
.page-head{
  position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 60%, #00417f 100%);
  padding:64px 0 68px;
}
.page-head::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(620px 340px at 85% -20%, rgba(46,125,50,.32) 0%, transparent 68%);
  pointer-events:none;
}
.page-head .wrap{position:relative; z-index:1;}
.crumb{font-size:.86rem; color:rgba(255,255,255,.6); margin-bottom:14px;}
.crumb a{color:rgba(255,255,255,.82);}
.page-head h1{margin:0 0 14px; font-size:clamp(1.9rem,4vw,2.7rem); font-weight:700; letter-spacing:-.025em; line-height:1.16;}
.page-head p{margin:0; color:rgba(255,255,255,.84); max-width:640px; font-size:1.04rem;}

/* ---------- SEKCIJE ---------- */
section{padding:90px 0;}
.section-soft{background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.section-head{max-width:680px; margin-bottom:54px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.label{
  color:var(--green); font-size:.78rem; font-weight:700;
  letter-spacing:.15em; text-transform:uppercase; margin-bottom:14px;
}
h2{margin:0 0 18px; font-size:clamp(1.7rem,3.4vw,2.35rem); line-height:1.2; font-weight:700; letter-spacing:-.02em;}
.section-head p{margin:0; color:var(--ink-soft); font-size:1.05rem;}

/* ---------- O NAMA ---------- */
.about{display:grid; grid-template-columns:1.3fr .9fr; gap:64px; align-items:start;}
.about-text p{margin:0 0 18px; color:var(--ink-soft);}
.about-text p:last-child{margin-bottom:0;}
.about-text strong{color:var(--ink); font-weight:600;}
.facts{display:grid; gap:14px;}
.fact{
  background:#fff; border:1px solid var(--line); border-left:3px solid var(--green);
  border-radius:10px; padding:22px 24px;
}
.fact h4{margin:0 0 6px; font-size:1rem; font-weight:650;}
.fact p{margin:0; font-size:.93rem; color:var(--ink-soft); line-height:1.55;}

/* ---------- DELATNOSTI ---------- */
.cards{display:grid; grid-template-columns:repeat(2,1fr); gap:26px;}
.card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:36px 32px; transition:transform .2s, box-shadow .2s, border-color .2s;
}
.card:hover{transform:translateY(-4px); box-shadow:0 16px 40px rgba(0,43,107,.11); border-color:#cfdce7;}
.card-icon{
  width:54px; height:54px; border-radius:13px; margin-bottom:22px;
  display:flex; align-items:center; justify-content:center;
}
.icon-blue{background:linear-gradient(135deg, var(--navy) 0%, var(--blue) 100%);}
.icon-green{background:linear-gradient(135deg, var(--green) 0%, #6fb437 100%);}
.icon-teal{background:linear-gradient(135deg, var(--blue) 0%, #2aa39a 100%);}
.icon-deep{background:linear-gradient(135deg, var(--navy-dark) 0%, var(--navy-mid) 100%);}
.card h3{margin:0 0 12px; font-size:1.24rem; font-weight:650; letter-spacing:-.01em;}
.card > p{margin:0 0 20px; color:var(--ink-soft); font-size:.98rem;}
.card ul{margin:0; padding:0; list-style:none;}
.card li{position:relative; padding-left:25px; margin-bottom:9px; font-size:.94rem; color:var(--ink-soft);}
.card li:last-child{margin-bottom:0;}
.card li::before{content:""; position:absolute; left:0; top:.55em; width:7px; height:7px; border-radius:50%; background:var(--green);}
.card.alt li::before{background:var(--blue);}

/* ---------- ZA KOGA ---------- */
.perks{display:grid; grid-template-columns:repeat(3,1fr); gap:40px;}
.perk{text-align:center;}
.perk-icon{
  width:62px; height:62px; margin:0 auto 20px; border-radius:50%;
  background:#fff; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 14px rgba(0,43,107,.06);
}
.perk h3{margin:0 0 10px; font-size:1.1rem; font-weight:650;}
.perk p{margin:0; color:var(--ink-soft); font-size:.95rem;}
.note{
  margin-top:48px; text-align:center; font-size:.94rem; color:var(--ink-soft);
  background:var(--bg-soft); border:1px solid var(--line); border-radius:10px;
  padding:18px 24px; max-width:760px; margin-left:auto; margin-right:auto;
}

/* ---------- OBAVEŠTENJA ---------- */
.notice-list{display:grid; gap:18px;}
.notice{
  background:#fff; border:1px solid var(--line); border-radius:12px;
  padding:26px 30px; display:grid; grid-template-columns:118px 1fr; gap:26px;
  align-items:start; transition:box-shadow .2s, border-color .2s;
}
.notice:hover{box-shadow:0 12px 32px rgba(0,43,107,.09); border-color:#cfdce7;}
.notice time{
  display:inline-block; font-size:.8rem; font-weight:700; letter-spacing:.06em;
  color:var(--green); background:rgba(46,125,50,.09);
  border:1px solid rgba(46,125,50,.2); border-radius:7px;
  padding:7px 12px; white-space:nowrap;
}
.notice h3{margin:0 0 8px; font-size:1.14rem; font-weight:650; letter-spacing:-.01em;}
.notice p{margin:0; color:var(--ink-soft); font-size:.97rem;}
.notice .more{display:inline-block; margin-top:12px; font-size:.93rem; font-weight:600;}

/* ---------- DOKUMENTA ---------- */
.doc-list{display:grid; gap:12px;}
.doc{
  display:flex; align-items:center; gap:20px;
  background:#fff; border:1px solid var(--line); border-radius:12px;
  padding:20px 24px; transition:transform .18s, box-shadow .2s, border-color .2s;
}
.doc:hover{transform:translateX(3px); box-shadow:0 12px 30px rgba(0,43,107,.09); border-color:#cfdce7; text-decoration:none;}
.doc-icon{
  width:46px; height:46px; flex:0 0 46px; border-radius:10px;
  background:linear-gradient(135deg, #b3271e 0%, #d94a3d 100%);
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:.63rem; font-weight:800; letter-spacing:.06em;
}
.doc-body{flex:1; min-width:0;}
.doc-body h3{margin:0 0 3px; font-size:1.03rem; font-weight:600; color:var(--ink); letter-spacing:-.005em;}
.doc-body span{font-size:.86rem; color:var(--ink-soft);}
.doc-dl{
  flex:0 0 auto; color:var(--blue); display:flex; align-items:center; gap:7px;
  font-size:.9rem; font-weight:600;
}

/* ---------- PRAZNO STANJE ---------- */
.empty{
  border:1px dashed #c8d5e0; border-radius:12px; background:var(--bg-soft);
  padding:52px 30px; text-align:center; color:var(--ink-soft);
}
.empty svg{margin:0 auto 16px; opacity:.55;}
.empty p{margin:0; font-size:.99rem;}

/* ---------- KONTAKT ---------- */
.contact{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
.contact-list{display:grid;}
.citem{display:flex; gap:18px; align-items:flex-start; padding:22px 0; border-bottom:1px solid var(--line);}
.citem:last-child{border-bottom:none;}
.citem-icon{
  width:46px; height:46px; flex:0 0 46px; border-radius:11px;
  background:#fff; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
}
.citem h4{margin:0 0 3px; font-size:.77rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft);}
.citem p{margin:0; font-size:1.06rem; font-weight:500;}
.citem a{color:var(--ink);}
.citem a:hover{color:var(--blue);}
.contact-panel{
  background:linear-gradient(150deg, var(--navy-dark) 0%, var(--navy) 60%, #00417f 100%);
  color:#fff; border-radius:var(--radius); padding:44px 38px;
  box-shadow:0 18px 44px rgba(0,43,107,.2);
}
.contact-panel h3{margin:0 0 14px; font-size:1.45rem; font-weight:650; letter-spacing:-.01em;}
.contact-panel p{margin:0 0 28px; color:rgba(255,255,255,.84); font-size:1rem;}
.contact-panel .btn{width:100%; text-align:center;}

/* ---------- KONTAKT OSOBE ---------- */
.people-head{
  margin:64px 0 26px; padding-top:40px; border-top:1px solid var(--line);
  font-size:.78rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--green);
}
.people{display:grid; grid-template-columns:repeat(2,1fr); gap:22px;}
.person{
  background:#fff; border:1px solid var(--line); border-radius:12px; padding:28px 30px;
  transition:box-shadow .2s, border-color .2s;
}
.person:hover{box-shadow:0 12px 32px rgba(0,43,107,.09); border-color:#cfdce7;}
.person-top{display:flex; align-items:center; gap:16px; margin-bottom:20px;}
.avatar{
  width:52px; height:52px; flex:0 0 52px; border-radius:50%;
  background:linear-gradient(135deg, var(--navy) 0%, var(--blue) 100%);
  color:#fff; display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:1.02rem; letter-spacing:.02em;
}
.person.green .avatar{background:linear-gradient(135deg, var(--green) 0%, #6fb437 100%);}
.person h3{margin:0 0 2px; font-size:1.1rem; font-weight:650; letter-spacing:-.01em;}
.person .role{margin:0; font-size:.87rem; color:var(--ink-soft);}
.person-rows{display:grid; gap:9px;}
.person-rows a, .person-rows span{
  display:flex; align-items:center; gap:11px; font-size:.96rem; color:var(--ink);
}
.person-rows a:hover{color:var(--blue); text-decoration:none;}
.person-rows svg{flex:0 0 17px; color:var(--ink-soft);}

/* ---------- FOOTER ---------- */
footer{background:var(--navy-dark); color:rgba(255,255,255,.62); padding:54px 0 30px; font-size:.93rem;}
.foot-top{
  display:flex; flex-wrap:wrap; gap:36px; justify-content:space-between; align-items:center;
  padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,.14);
}
.foot-logo{background:#fff; border-radius:11px; padding:16px 22px; display:inline-block;}
.foot-logo img{height:42px; width:auto;}
.foot-info{display:grid; gap:6px; text-align:right;}
.foot-info a{color:rgba(255,255,255,.85);}
.foot-bottom{padding-top:24px; display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; font-size:.87rem;}
.foot-bottom a{color:rgba(255,255,255,.7);}

/* ---------- RESPONSIVE ---------- */
@media (max-width:980px){
  .hero-strip{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:900px){
  .about, .contact{grid-template-columns:1fr; gap:42px;}
  .cards, .people{grid-template-columns:1fr;}
  .perks{grid-template-columns:1fr; gap:34px;}
  .nav-links a:not(.nav-cta){display:none;}
  .nav{height:74px;}
  .brand img{height:38px;}
}
@media (max-width:600px){
  body{font-size:16px;}
  section{padding:64px 0;}
  .hero{padding:74px 0 78px;}
  .page-head{padding:52px 0 54px;}
  .wrap{padding:0 20px;}
  .hero-strip{grid-template-columns:1fr;}
  .card{padding:30px 26px;}
  .contact-panel{padding:34px 28px;}
  .notice{grid-template-columns:1fr; gap:14px; padding:24px 24px;}
  .doc{flex-wrap:wrap; gap:14px;}
  .doc-dl{width:100%; padding-left:66px;}
  .foot-top{flex-direction:column; align-items:flex-start;}
  .foot-info{text-align:left;}
  .brand img{height:34px;}
}

/* Funkcionalni dodaci. Originalni style.css ostaje potpuno nepromenjen. */
.skip-link{position:fixed;top:-70px;left:18px;z-index:100;background:#fff;color:var(--navy);padding:10px 15px;border-radius:7px;box-shadow:0 6px 20px rgba(0,0,0,.14);font-weight:700;}
.skip-link:focus{top:12px;}
.menu-toggle{display:none;border:0;background:transparent;width:44px;height:44px;padding:10px;cursor:pointer;}
.menu-toggle span{display:block;height:2px;background:var(--navy);margin:5px 0;border-radius:2px;transition:transform .2s,opacity .2s;}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav.wrap{max-width:1400px;}
.nav-links{flex-wrap:nowrap;}
.nav-links a{white-space:nowrap;}
.en-number{color:#fff;font-weight:800;}
.legal-page{max-width:820px;}
.legal-page h2{font-size:1.35rem;margin-top:38px;}
.legal-page p{color:var(--ink-soft);}

@media (max-width:900px){
  .menu-toggle{display:block;margin-left:auto;}
  .nav{position:relative;}
  .nav-links{display:none;position:absolute;top:calc(100% + 1px);left:20px;right:20px;flex-direction:column;align-items:stretch;gap:0;padding:12px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 45px rgba(0,43,107,.16);}
  .nav-links.open{display:flex;}
  .nav-links a,.nav-links a:not(.nav-cta){display:block;padding:12px 14px;}
  .nav-cta{text-align:center;margin-top:6px;}
}



/* ---------- FINALNE DORADE / FINAL POLISH ---------- */
.people{grid-template-columns:repeat(3,minmax(0,1fr));}
.person-rows a{overflow-wrap:anywhere;word-break:break-word;}
.lang-link{font-weight:700;}
.nav-links .active{color:var(--green);}
.mobile-only-note{display:none;}
@media (max-width:1100px){
  .people{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:900px){
  .people{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .nav-links{max-height:calc(100vh - 74px);overflow:auto;}
  .btn-row .btn{width:100%;text-align:center;}
  .contact-panel .btn{width:100%;}
  .person{padding:24px 22px;}
  .section-head{margin-bottom:38px;}
  .shipping-flow{overflow-x:auto;}
}

.privacy-copy{max-width:820px}.privacy-copy h2{margin-top:32px}.privacy-copy p{color:var(--ink-soft);line-height:1.75}
