/* =========================================================
   Studio387 — Ninium: kartice sa ikonama (widget s387-ninium-sec-cards)
   Ostale sekcije sadržajnih stranica su obični Elementor containeri i nemaju svoj CSS ovdje.
   ========================================================= */

.nn-sec{
  --nn-ink:#211018;
  --nn-plum:#3A0A21;
  --nn-burgundy:#650031;
  --nn-text:#4A2436;
  --nn-soft:#5C3245;
  --nn-line:#E7E2E0;
  --nn-wrap:1250px;
  position:relative;
  font-family:'Archivo',sans-serif;
  color:var(--nn-text);
  box-sizing:border-box;
}
.nn-sec *{box-sizing:border-box;}
.nn-sec__inner{max-width:calc(var(--nn-wrap) + 40px);margin:0 auto;padding-left:20px;padding-right:20px;}

.nn-sec--soft{background:#FFFFFF;}
.nn-sec--rose{background:#F6F4F3;border-top:1px solid #E3DEDB;border-bottom:1px solid #E3DEDB;}
.nn-sec--fade{background:linear-gradient(180deg,#F6F4F3 0%,#FFFFFF 100%);}

.nn-sec__eyebrow{
  margin:0 0 16px;
  font-size:13px;font-weight:600;line-height:1.3;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--nn-burgundy);
}
.nn-sec .nn-sec__title{
  margin:0 0 40px;
  font:900 44px/46px 'Archivo',sans-serif;
  letter-spacing:0;text-transform:uppercase;
  color:var(--nn-ink);
}
.nn-sec p{margin:0;font:400 16px/1.7 'Archivo',sans-serif;color:var(--nn-text);}

.nn-sec-cards .nn-sec__inner{padding-top:88px;padding-bottom:88px;}
.nn-sec-cards__grid{display:grid;grid-template-columns:repeat(var(--nn-cols,3),minmax(0,1fr));gap:24px;}
.nn-sec-card{
  padding:36px;
  background:#fff;border:1px solid var(--nn-line);border-radius:16px;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.nn-sec-card:hover{transform:translateY(-6px);border-color:#D9D2CF;box-shadow:0 18px 40px rgba(33,16,24,.12);}
.nn-sec-card__number{margin:0 0 16px;font-size:14px;font-weight:900;letter-spacing:.04em;color:#8A6B77;}
.nn-sec-card .nn-sec-card__title{margin:0 0 12px;font:800 21px/1.25 'Archivo',sans-serif;letter-spacing:0;text-transform:none;color:var(--nn-ink);}
.nn-sec-card p{font-size:15px;line-height:1.6;color:var(--nn-soft);}

/* naslov lijevo, uvodni tekst desno */
.nn-sec-cards__head--intro{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;margin-bottom:40px;}
.nn-sec-cards__head--intro .nn-sec__title{margin-bottom:0;}
.nn-sec-cards__head .nn-sec-cards__intro{flex:0 1 430px;margin:0;font-size:16px;line-height:1.6;color:var(--nn-soft);}

/* kartica sa ikonom: ikona u krugu, veliki broj u pozadini, bordo crta koja naraste na hover */
.nn-sec-card--icon{
  position:relative;overflow:hidden;
  padding:40px 36px 38px;
  background:linear-gradient(180deg,#fff 0%,#FAF9F8 100%);
}
.nn-sec-card--icon::before{
  content:"";position:absolute;left:36px;top:0;
  width:44px;height:3px;border-radius:0 0 3px 3px;
  background:var(--nn-burgundy);
  transition:width .35s cubic-bezier(.22,1,.36,1);
}
.nn-sec-card--icon:hover::before{width:calc(100% - 72px);}
.nn-sec-card--icon .nn-sec-card__number{
  position:absolute;right:26px;top:14px;margin:0;
  font-size:84px;line-height:1;letter-spacing:-.03em;
  color:#F1EEEC;
  transition:color .3s ease;
  pointer-events:none;
}
.nn-sec-card--icon:hover .nn-sec-card__number{color:#F1EEEC;}
.nn-sec-card__icon{
  position:relative;
  width:58px;height:58px;margin:0 0 26px;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;
  background:#F6F4F3;color:var(--nn-burgundy);
  transition:background .3s ease,color .3s ease,transform .3s ease;
}
.nn-sec-card--icon:hover .nn-sec-card__icon{background:var(--nn-burgundy);color:#fff;transform:scale(1.06);}
.nn-sec-card--icon .nn-sec-card__title,
.nn-sec-card--icon p{position:relative;}

/* ---------------------------------------------------------
   Kartica teme (widget s387-ninium-topic-card) - stoji u običnoj Elementor koloni i puni njenu visinu
   --------------------------------------------------------- */
.elementor-widget-s387-ninium-topic-card{display:flex;flex-direction:column;}
.elementor-widget-s387-ninium-topic-card > .elementor-widget-container{flex:1 1 auto;display:flex;}
.nn-topic{
  --nn-ink:#211018;--nn-burgundy:#650031;--nn-text:#4A2436;
  flex:1 1 auto;width:100%;
  display:flex;flex-direction:column;gap:18px;
  padding:34px;
  background:#fff;border:1px solid #E7E2E0;border-radius:20px;
  font-family:'Archivo',sans-serif;box-sizing:border-box;
  scroll-margin-top:96px;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.nn-topic *{box-sizing:border-box;}
.nn-topic:hover{transform:translateY(-6px);border-color:#D9D2CF;box-shadow:0 18px 40px rgba(33,16,24,.12);}
.nn-topic__head{display:flex;align-items:center;gap:14px;}
.nn-topic__icon{
  flex:0 0 auto;width:50px;height:50px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:#F1EEEC;color:var(--nn-burgundy);
  transition:transform .3s ease;
}
.nn-topic__icon svg{width:22px;height:22px;}
.nn-topic:hover .nn-topic__icon{transform:scale(1.08);}
.nn-topic .nn-topic__name{margin:0;font:900 26px/1.1 'Archivo',sans-serif;letter-spacing:0;text-transform:uppercase;color:var(--nn-ink);overflow-wrap:anywhere;}
.nn-topic__label{margin:0 0 8px;font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.16em;text-transform:uppercase;color:var(--nn-burgundy);}
.nn-topic p{margin:0;font:400 15px/1.6 'Archivo',sans-serif;color:var(--nn-text);}
.nn-topic__self{display:flex;align-items:flex-start;gap:12px;padding:16px 18px;border-radius:12px;background:#F9F8F7;}
.nn-topic__self .nn-topic__label{margin-bottom:5px;}
.nn-topic__self p{font-size:14px;line-height:1.5;}
.nn-topic__check{
  flex:0 0 auto;width:20px;height:20px;margin-top:1px;border-radius:50%;
  background:var(--nn-burgundy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23fff' d='M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z'/%3E%3C/svg%3E") center/10px no-repeat; /* FA check */
}
.nn-topic__foot{margin-top:auto;}
.nn-topic__foot .nn-topic__label{margin-bottom:10px;}
.nn-topic__chips{display:flex;flex-wrap:wrap;gap:8px;}
.nn-topic__chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 14px 6px 6px;
  border:1px solid #E7E2E0;border-radius:999px;background:#fff;
  font-size:12px;font-weight:800;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;
  color:var(--nn-ink) !important;text-decoration:none !important;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.nn-topic__chip:hover{border-color:var(--nn-burgundy);background:#F9F8F7;transform:translateY(-1px);}
.nn-topic__chip-img{flex:0 0 auto;width:30px;height:30px;border-radius:50%;overflow:hidden;background:#fff;box-shadow:inset 0 0 0 1px #EEEAE8;}
.nn-topic__chip-img img{display:block;width:100%;height:100%;object-fit:contain;padding:3px;box-shadow:none !important;border-radius:0 !important;}
.nn-topic .nn-topic__alt{margin:0 0 12px;font-size:14px;font-weight:700;line-height:1.55;}
.nn-topic__button{
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 20px;border-radius:9px;
  background:var(--nn-burgundy);color:#fff !important;
  font-size:12px;font-weight:700;line-height:1.2;letter-spacing:.12em;text-decoration:none !important;
  transition:background .25s ease,transform .25s ease;
}
.nn-topic__button:hover{background:#3A0A21;transform:translateY(-2px);}
.nn-topic__note{margin-top:12px;font-size:12px;line-height:1.5;color:#8A5B6D;}

/* ---------------------------------------------------------
   Kartica proizvoda (widget s387-ninium-product-card) - stoji u ćeliji obične Elementor mreže i puni je
   --------------------------------------------------------- */
.elementor-widget-s387-ninium-product-card{display:flex;flex-direction:column;}
.elementor-widget-s387-ninium-product-card > .elementor-widget-container{flex:1 1 auto;display:flex;}
.nn-pcard{
  flex:1 1 auto;width:100%;
  display:flex;flex-direction:column;overflow:hidden;
  background:#fff;border:1px solid #E7E2E0;border-radius:20px;
  font-family:'Archivo',sans-serif;box-sizing:border-box;
  color:#4A2436 !important;text-decoration:none !important;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.nn-pcard *{box-sizing:border-box;}
.nn-pcard:hover{transform:translateY(-6px);border-color:#D9D2CF;box-shadow:0 18px 40px rgba(33,16,24,.12);}
.nn-pcard--empty{padding:40px;text-align:center;color:#8A5B6D;}
.nn-pcard__media{
  display:flex;align-items:center;justify-content:center;
  height:230px;padding:22px 26px 8px;
  background:#fff;
}
.nn-pcard__media img{
  display:block;width:100%;height:100%;object-fit:contain;
  box-shadow:none !important;border-radius:0 !important;
  transition:transform .5s cubic-bezier(.22,1,.36,1);
}
.nn-pcard:hover .nn-pcard__media img{transform:scale(1.05);}
.nn-pcard__body{display:flex;flex-direction:column;flex:1 1 auto;padding:18px 30px 28px;border-top:1px solid #F0ECEA;}
.nn-pcard__form{margin:0 0 10px;font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.16em;text-transform:uppercase;color:#650031;}
.nn-pcard__name{margin:0 0 10px;font-size:34px;font-weight:900;line-height:1;letter-spacing:-.01em;text-transform:uppercase;color:#211018;}
.nn-pcard__slogan{margin:0 0 18px;font-size:15px;line-height:1.55;color:#4A2436;}
.nn-pcard__tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 22px;}
.nn-pcard__tags span{
  padding:5px 11px;border-radius:999px;
  background:#F9F8F7;
  font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.06em;text-transform:uppercase;color:#4A2436;
}
.nn-pcard__more{
  margin-top:auto;align-self:flex-start;
  padding-bottom:3px;border-bottom:1px solid #650031;
  font-size:12px;font-weight:700;line-height:1.3;letter-spacing:.12em;color:#650031;
  transition:letter-spacing .25s ease;
}
.nn-pcard:hover .nn-pcard__more{letter-spacing:.17em;}

@media (max-width:1100px){
  .nn-sec .nn-sec__title{font-size:38px;line-height:40px;}
  .nn-sec-cards__grid{--nn-cols:2;}
}
@media (max-width:767px){
  .nn-sec .nn-sec__title{font-size:30px;line-height:32px;margin-bottom:26px;}
  .nn-sec-cards .nn-sec__inner{padding-top:56px;padding-bottom:56px;}
  .nn-sec-cards__grid{--nn-cols:1;gap:14px;}
  .nn-sec-card{padding:28px 24px;}
  .nn-sec-card:hover{transform:none;}
  .nn-sec-cards__head--intro{display:block;margin-bottom:26px;}
  .nn-sec-cards__head--intro .nn-sec__title{margin-bottom:14px;}
  .nn-sec-card--icon{padding:32px 24px 28px;}
  .nn-sec-card--icon::before{left:24px;}
  .nn-sec-card--icon .nn-sec-card__number{right:18px;top:12px;font-size:68px;}
  .nn-sec-card__icon{width:52px;height:52px;margin-bottom:20px;}
  .nn-pcard:hover{transform:none;}
  .nn-pcard__media{height:200px;}
  .nn-pcard__body{padding:16px 22px 24px;}
  .nn-pcard__name{font-size:30px;}
  .nn-topic{padding:26px 22px;gap:16px;}
  .nn-topic:hover{transform:none;}
  .nn-topic .nn-topic__name{font-size:23px;}
}
