@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root{
	--orange:#f26522;
	--yellow:#fdcd09;
	--teal:#302e2f;
	--ink:#3f3f42;
	--red:#ec1e27;
	--soft:#fff7f3;
	--gray:#1a1a1a;
	--lightgray:#f4f2f1;
	--line:#f3d9ce;
	--white:#fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
	margin:0;
	font-family:'Poppins',Arial,Helvetica,sans-serif;
	color:var(--ink);
	background:#fff
}
a{
	text-decoration:none;
	color:inherit}
img{
	max-width:100%;
	display:block}

.wrap{
	width:min(1180px,92vw);
	margin:auto}
.topbar{
	background:var(--red);
	color:#fff;
	font-size:13px}
.topbar-inner{
	height:34px;
	display:flex;
	justify-content:space-between;
	align-items:center}
.topbar a{margin-left:0px}
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);border-bottom:1px solid #eee;backdrop-filter:blur(10px)}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:72px}
.brand{display:flex;align-items:center;gap:8px}
.brand-mark{font-size:28px;color:var(--red)}
.brand b{font-size:28px;line-height:1}
.brand small{display:block;color:var(--red);font-size:9px}
.main-nav{display:flex;gap:28px;font-size:15px}
.main-nav a:hover{color:var(--red)}
.menu-toggle{display:none;border:0;background:none;font-size:28px}
.hero {
    padding:20px 30px 0px 20px;
    background: #FFF;
}

.hero-grid,
.split-grid,

.app-grid {
    display: grid;
    grid-template-columns: 2fr 3fr;
    gap: 20px;
    align-items: center;
}
/**.cert-grid{
	display:grid;
	grid-template-columns:1fr 2fr;
	gap:6px;
	align-items:center}**/
.cert-grid {
    display: grid;
    grid-template-columns: 40% 60%;
    gap: 20px;
    align-items: center;
}
.GDPR-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    align-items: center;
}
.hero-copy{text-align:center}
.eyebrow{color:var(--teal);font-size:12px;font-weight:bold;letter-spacing:2px}
.hero h1{
	font-size:64px;
	line-height:.98;
	margin:10px 0 22px}
.hero h1 span{color:var(--red)}
.hero p{
	font-size:18px;
	line-height:1.55;
	color:#777}
.btn{display:inline-block;
	background:var(--red);
	color:#fff;
	border-radius:999px;
	padding:0px 28px;
	margin-top:0px;
	border:2px solid var(--ink);
	font-weight:700}
.btn-teal{display:inline-block;
	background:var(--teal);
	color:#fff;
	border-radius:999px;
	padding:0px 28px;
	margin-top:0px;
	border:2px solid #f0a000;
	font-weight:700}
.small{padding:11px 20px;font-size:14px}
.card-image img,
.image-panel img{
	width:100%;
	height:100%;
	object-fit:cover;
	border-radius:10px}
.image-APP img{
	width:100%;
	height:100%;
	object-fit:cover;
	border-radius:0px}
.image-certifikat img{
	width:100%;
	height:100%;}
.image-Footer-Logo img{
	width:140px;}

.hero-visual {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    min-height: 360px;
    overflow: hidden;
}
.hero-visual img {
    display: block;
	align-items: flex-end;
    max-height: 100%;
    width: auto;
}


.stats{
	background:var(--teal);
	color:white}
.stats-grid{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:18px;
	padding:24px 0}
.stats-grid div{text-align:center}
.stats-grid strong
	{
	display:block;
	font-size:36px;
	line-height: 1.0
	}
.stats-grid span{
	font-size:12px
	}
.section{padding:56px 0}
.alt{background:#fff}
.copy-block h2{font-size:40px;line-height:1.08;margin:0 0 22px}
.copy-block h2 span,
.copy-block h3,
.word-cloud b{color:var(--red)}
.copy-block em{font-style:normal;font-weight:300;color:#777}
.copy-block p{font-size:18px;line-height:1.5;color:#666}
.copy-block h3{font-size:20px}
.image-panel{height:410px}
.reverse{grid-template-columns:.9fr 1.1fr}
.word-cloud{font-size:42px;line-height:1.05;text-align:center;color:var(--red)}
.word-cloud p{margin:0 0 4px}
.pill-row{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:28px}
.pill-row a{background:var(--teal);color:#fff;border:2px solid #f3a000;border-radius:999px;padding:8px 16px;font-size:13px}
.app-cta{
	background:var(--soft);
	padding:0px 0 0;
	overflow:hidden
	}
.app-grid h2{
	color:var(--red);
	font-size:34px;
	line-height: 1.0;
	}
.app-grid img{
	max-height:165px;
	justify-self:end
	}

.products {
    background: var(--soft);
    padding: 40px 40px;
    color: #1a1a1a;
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px 30px;
    align-items: start;
}
.product-item {
    text-align: center;
}
.product-item-left {
    text-align: left;
}
.product-item img {
    width: 150px;
    height: auto;
    display: block;
    margin: 0 auto 5px;
}
.product-item h1 {
    margin: 0;
    text-align: center;
    font-size: 18px;
    line-height: 1.6;
	font-weight: bold;
}
.product-item p {
    margin: 0;
    text-align: center;
    font-size: 12px;
    line-height: 1.2;
}
.certs{padding:30px 0}
.cert-grid h2{font-size:38px;color:var(--teal)}
.GDPR-grid h2{font-size:38px;color:var(--red)}
.logos{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.logos span{font-weight:700;color:#555}
.logos span::first-letter{color:var(--red)}footer{background:var(--teal);color:#fff;padding-top:36px}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:28px;align-items:start}
.footer-grid a{display:block;margin:7px 0;font-size:13px}
.footer-grid p{font-size:13px;line-height:1.55}
.footer-grid h4{margin:0 0 10px}
.footer-brand b{font-size:30px}
.footer-cta{grid-column:5/6}
.copyright{border-top:1px solid rgba(255,255,255,.25);margin-top:30px;padding:18px 0;font-size:12px}
.copyright .wrap{display:flex;justify-content:space-between}

.AED-grid{display:grid;grid-template-columns:50% 50%;gap:44px;align-items:start}

/* =========================================================
   ZDR SOS KARTICA
   ========================================================= */
.health-card-page{background:#fff}
.health-card-hero{padding:48px 0 38px}

.health-card-grid{display:grid;grid-template-columns:60% 40%;gap:44px;align-items:start}
.health-card-icons{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
}
.health-card-icon img {
    width: 100px;
    height: auto;
}
.health-card-title{margin:0 0 8px;font-size:clamp(46px,5.8vw,74px);line-height:.95;font-weight:800;color:var(--red)}
.health-card-title .dark{color:var(--ink)}
.health-card-subtitle{margin:0 0 42px;font-size:clamp(31px,3.4vw,47px);line-height:1.04;font-weight:300;color:var(--red)}
.health-card-subtitle h3{margin:0 0 42px;font-size:clamp(31px,3.4vw,47px);line-height:1.04;font-weight:300;color:var(--red)}
.health-card-intro{max-width:620px;margin:0;color:#484848;font-size:20px;line-height:1.42;text-align:left}
.health-card-intro strong{color:#4a4a4d;font-weight:700}
.health-card-hero-image img{width:90%;height:auto;object-fit:contain}

.SOS-Tag-info{background:var(--gray);padding:60px 0}
.App-info{background:var(--lightgray);padding:60px 0}

.features-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 30px;
    align-items: start;
}

.feature-item {
    text-align: center;
}

.feature-item img {
    width: 80px;
    height: 80px;
    object-fit: contain;
    display: block;
    margin: 0 auto 5px;
}

.feature-item h3 {
    margin: 0 0 6px;
    font-size: 18px;
}

.feature-item p {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
}

.health-card-info{background:var(--soft);padding:28px 0 52px}
.health-card-info-grid{display:grid;grid-template-columns: 3fr 2fr;gap:44px;align-items: flex-start}
.health-card-diagram img{width:90%;height:auto;object-fit:contain}

.health-card-benefits{padding-left:19px}
.health-card-benefits h3{margin:0 0 8px;color:var(--red);font-size:24px;line-height:1.05}
.health-card-benefits p{margin:0;color:var(--gray);font-size:19px;line-height:1.42}
.health-card-benefits ul{margin:0 0 30px;padding-left:28px;color:#555;font-size:19px;line-height:1.28}
.health-card-benefits li{margin:2px 0}

.health-card-pricing{background:var(--red);color:#fff;padding:42px 0}
.health-card-pricing-grid{
	display:grid;
	grid-template-columns:50% 50%;
	gap:40px;
	align-items: flex-start}
.health-card-pricing h2{margin:0 0 24px;color:#fff;font-size:clamp(44px,5vw,62px);line-height:.95}
.health-card-pricing p{margin:0;color:rgba(255,255,255,.88);font-size:19px;line-height:1.42}
.health-card-pricing ul{margin:0;padding-left:24px;color:#fff;font-size:18px;line-height:1.5}
.health-card-pricing-image img{width:100%;max-height:220px;object-fit:contain}

.health-card-how{background:var(--white);padding:42px 0}
.health-card-how-grid{
	display:grid;
	grid-template-columns: repeat(3, 1fr);
	gap:40px;
	align-items: flex-start}
.health-card-how h1{
	font-size:64px;
	color:var(--red);
	line-height:.98;
	margin:10px 0 22px}
.health-card-how h2{margin:0 0 24px;font-size:clamp(20px,5vw,36px);line-height:.95}
.health-card-how h3{color:var(--red);margin:0 0 24px;font-size:clamp(20px,5vw,36px);line-height:1.1;font-weight: 400}
.health-card-how p{margin:0;font-size:19px;line-height:1.42}
.health-card-how ul{margin:0;padding-left:24px;font-size:18px;line-height:1.5}
.health-card-how-image img{width:100%;max-height:220px;object-fit:contain}

.SOS-gumb-info{background:var(--soft);padding:28px 0 52px}
.SOS-gumb-grid{display:grid;grid-template-columns: 3fr 2fr;gap:44px;align-items: flex-start}
.SOS-gumb-diagram img{width:90%;height:auto;object-fit:contain}
.SOS-gumb-benefits{padding-left:19px}
.SOS-gumb-benefits h3{margin:0 0 8px;color:var(--red);font-size:24px;line-height:1.05}
.SOS-gumb-benefits p{margin:0;color:var(--gray);font-size:19px;line-height:1.42}
.SOS-gumb-benefits ul{margin:0 0 30px;padding-left:28px;color:#555;font-size:19px;line-height:1.28}
.SOS-gumb-benefits li{margin:2px 0}

.SOS-Tag-benefits{padding-left:22px}
.SOS-Tag-benefits h3{margin:0 0 8px;color:var(--yellow);font-size:24px;line-height:1.05}
.SOS-Tag-benefits ul{margin:0 0 30px;padding-left:28px;color:#fff;font-size:21px;line-height:1.28}
.SOS-Tag-benefits li{margin:2px 0}
.SOS-Tag {
	align-items: flex-start;
	color:#fdcd09;
	line-height:.95}
.SOS-Tag h1{
	font-size:64px;
	line-height:.98;
	margin:10px 0 22px}
.SOS-Tag h1 span{color:var(--yellow)}
.SOS-Tag p{
	font-size:18px;
	line-height:1.55;
	color:#FFF}
.SOS-Tag h2{color:#FFF;margin:0 0 24px;font-size:clamp(20px,5vw,38px);line-height:.95}
.SOS-Tag p{margin:0;font-size:19px;line-height:1.42}
.SOS-Tag img{width:90%;height:auto;object-fit:contain}

.together-we-save-lives-title{margin:0 0 8px;font-size:clamp(46px,5.8vw,74px);line-height:.95;font-weight:800;color:var(--red)}
.together-we-save-lives-title .dark{color:var(--ink)}
.together-we-save-lives{background:var(--white);padding:42px 0}
.together-we-save-lives-grid,
.together-we-save-lives h2{margin:0 0 24px;font-size:clamp(24px,5vw,42px);line-height:.95}
.together-we-save-lives p{margin:0;font-size:19px;line-height:1.42}
.together-we-save-lives ul{margin:0;padding-left:24px;font-size:18px;line-height:1.5}
.together-we-save-lives-image img{width:100%;max-height:220px;object-fit:contain}

.health-card-cta{background:var(--white);padding:36px 0}
.health-card-cta-grid{display:grid;
	grid-template-columns:1fr auto;
	gap: 40px 0;
	align-items:center}
.health-card-cta h2{max-width:620px;margin:0 0 16px;color:var(--red);font-size:clamp(42px,5vw,62px);line-height:.98}
.health-card-cta p{margin:0;color:#666;font-size:18px}
.health-card-cta .btn{background:var(--teal);white-space:nowrap}

/* =========================================================
   PAKET BASIC | PLUS | PREMIUM
   ========================================================= */
.plans-section {
    padding: 60px 0;
    background: #FFF;
}

.plans-heading {
    text-align: center;
    margin-bottom: 55px;
}

.plans-heading h2 {
    margin: 0 0 10px;
    font-size: clamp(30px, 4vw, 46px);
    line-height: 1.15;
    color: #3f3f42;
}

.plans-heading p {
    margin: 0;
    font-size: 16px;
    color: #777;
}

/* GRID */

.plans-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0px;
    align-items: center;
	align-items: flex-start;
}


/* PACKAGE */

.plan-item {
    position: relative;
    text-align: center;
    padding: 45px 30px;
}


/* FEATURED PLUS */

.plan-featured {
    background: #fff;
    padding: 60px 35px 50px;
    border-radius: 8px;
    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.10);
}


/* BADGE */

.plan-badge {
    position: absolute;
    top: 25px;
    left: 50%;
    transform: translateX(-50%);
    background: #3f3f42;
    color: #fff;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
}


/* ICON */

.plan-icon {
    height: 95px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;
}

.plan-icon img {
    width: 100px;
    height: 100px;
    object-fit: contain;
}


/* TITLE */

.plan-item h3 {
    margin: 0 0 18px;
    font-size: 30px;
    font-weight: 700;
    color: #3f3f42;
}


/* DESCRIPTION */

.plan-description {
    min-height: 48px;
    margin: 0 auto 25px;
    max-width: 230px;
    font-size: 20px;
    line-height: 1.5;
    color:var(--red);
	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
    padding: 20px 0;
}
.plan-item span {
	margin:0;
	font-size:12px;
	line-height:1.5
}

.plan-item italic {
    margin: 0;
    font-size: 10px;
	font-style: italic;
    color: #323232;
}

/* PRICE */

.plan-price {
    margin-bottom: 25px;
	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
    padding: 20px 0;
    margin: 20px 0;
}
/*.plan-price::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 70%;
    height: 1px;
    background: #e5e5e5;
}*/
.plan-price strong {
    font-size: 34px;
    color: #3f3f42;
}

.plan-price span {
    margin-left: 5px;
    font-size: 13px;
    color: #777;
}


/* LINK */

.plan-link {
    display: inline-block;
    padding: 11px 22px;
    border: 1px solid var(--red);
    border-radius: 7px;
    color: var(--red);
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
}

.plan-link:hover {
    background: var(--red);
    color: #fff;
}

.plan-link-primary {
    background: var(--red);
    color: #fff;
}


/* =========================================================
   GALLERY
   ========================================================= */

.gallery-section {
    padding: 90px 0;
	background: #fff7f3;
}

.gallery-header {
    max-width: 720px;
    margin-bottom: 40px;
}

.gallery-header h2 {
    margin: 0 0 14px;
    font-size: clamp(32px, 4vw, 52px);
    line-height: 1.1;
    font-weight: 600;
    color:var(--ink);
}

.gallery-header p {
    margin: 0;
    font-size: 17px;
    line-height: 1.7;
    color:var(--ink);
}


/* GRID */

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}


/* POSAMEZNA SLIKA */

.gallery-item {
    position: relative;
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 18px;
    background: #eee;
    text-decoration: none;
}


/* SLIKA */

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;

    transition: transform 0.45s ease;
}


/* HOVER ZOOM */

.gallery-item:hover img {
    transform: scale(1.05);
}


/* TEMNI PRELIV */

.gallery-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    padding: 60px 24px 22px;

    background: linear-gradient(
        to top,
        rgba(0,0,0,0.82) 0%,
        rgba(0,0,0,0.45) 35%,
        rgba(0,0,0,0) 80%
    );
}


/* TITLE */

.gallery-overlay h3 {
    margin: 0 0 4px;

    color: #fff;

    font-size: 21px;
    line-height: 1.25;
    font-weight: 500;
}


/* PODNASLOV */

.gallery-overlay p {
    margin: 0;

    color: rgba(255,255,255,0.78);

    font-size: 14px;
    line-height: 1.4;
}


/* =========================================================
   O NAS
   ========================================================= */
.about-page{background:#fff}
.about-section{padding:56px 0}
.about-section.soft{background:#f7f7f7}
.about-section.peach{background:var(--soft)}
.about-title{margin:0 0 8px;font-size:48px;line-height:1.02;color:var(--red);font-weight:800}
.about-title .dark{color:var(--ink)}
.about-subtitle{margin:0 0 28px;font-size:28px;line-height:1.08;color:#ef8c64;font-weight:300}
.about-copy p{margin:0 0 18px;color:#777;line-height:1.55;font-size:16px}
.about-copy b{color:#4a4a4d}
.about-grid{display:grid;grid-template-columns:58% 42%;gap:42px;align-items:center}
.about-grid.reverse{grid-template-columns:62% 38%}
.about-photo img{width:100%;height:auto;border-radius:8px}
.about-hero{padding:42px 0 56px;background:#fff}
.about-hero .about-grid{grid-template-columns:58% 42%}
.about-hero .about-title{font-size:54px}
.about-lead{font-size:18px!important;color:#666!important}

.about-tech-images{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:26px 0 32px}
.about-tech-images img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px}
.about-two-col{display:grid;grid-template-columns:62% 38%;gap:36px;align-items:start}
.about-two-col ul{margin:8px 0 0;padding-left:20px;color:#666;line-height:1.55}
.about-two-col li{margin:4px 0}

.trust-grid{display:grid;grid-template-columns:62% 38%;gap:42px;align-items:start}
.trust-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:28px 0 22px}
.trust-stats strong{display:block;color:var(--red);font-size:32px;line-height:1;font-weight:800}
.trust-stats span{display:block;margin-top:8px;font-size:11px;line-height:1.2;color:#888}
.logo-wall{margin-top:20px;border-radius:28px;background:var(--teal);padding:26px}
.logo-wall img{width:100%;height:auto}
.certificate-img img{max-width:310px;margin:0 auto}

.vision-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:46px;align-items:center}
.vision-card{background:var(--red);color:#fff;border-radius:28px;padding:28px 34px;display:flex;gap:18px;align-items:flex-start;margin:20px 0 26px}
.vision-card .heart{font-size:38px;line-height:1}
.vision-card p{margin:0;color:#fff;font-size:17px;line-height:1.45}

.media-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:center}
.media-list{list-style:none;margin:0;padding:0}
.media-list li{display:grid;grid-template-columns:28px 1fr;gap:10px;margin:0 0 13px;align-items:start}
.media-list .heart{color:var(--red);font-size:18px;line-height:1.2}
.media-list a{font-weight:700;text-decoration:underline}
.media-list small{display:block;color:#8a8a8d;font-size:12px;margin-top:1px}
.media-phones img{width:100%;max-width:430px;margin-left:auto}

.values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin-top:30px;text-align:center}
.value-item img{width:54px;height:54px;object-fit:contain;margin:0 auto 12px}
.value-item h3{margin:0 0 8px;color:var(--red);font-size:17px}
.value-item p{margin:0;color:#888;font-size:13px;line-height:1.45}

.about-app-cta{background:var(--soft);overflow:hidden}
.about-app-grid{display:grid;grid-template-columns:46% 54%;gap:20px;align-items:center}
.about-app-copy{padding:32px 0}
.about-app-copy h2{margin:0 0 12px;color:var(--red);font-size:38px;line-height:1.05}
.about-app-copy p{margin:0 0 16px;color:#ef8c64;font-size:28px;line-height:1.05;font-weight:300}
.about-app-image img{width:100%;max-height:220px;object-fit:contain;object-position:right bottom}


@media(max-width:900px)
{
	.main-nav{display:none;
		position:absolute;
		top:72px;
		left:0;
		right:0;
		background:#fff;
		padding:20px;
		flex-direction:column;
		border-top:1px solid #eee}
	.main-nav.open{display:flex}
	.menu-toggle{
		display:block;
	    margin-left: auto;
        margin-right: -3px;}
	.hero {
		padding:20px 20px 0px 30px;
		background: #fff;
	}
	.hero-grid,
	.split-grid,
	.app-grid,
	.cert-grid{grid-template-columns:1fr}
	.GDPR-grid{grid-template-columns:1fr}
	.hero h1{font-size:46px}
	.stats-grid{grid-template-columns:repeat(2,1fr)}
	/**.stats-grid div:last-child{grid-column:1/-1}**/
    .features-grid {
        grid-template-columns: repeat(3, 1fr);
    }
	.image-panel{height:320px}
	.image-certifikat img{
		width:80%;
		height:80%;}
	.footer-grid{grid-template-columns:1fr 1fr}
	.footer-cta{grid-column:auto}
	.logos{grid-template-columns:1fr 1fr}
	.hero-visual{order:2}
	.hero-copy{order:1}

/* =========================================================
   GALLERY
   ========================================================= */
    .gallery-section {
        padding: 70px 0;
    }

    .gallery-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }
/* =========================================================
   PAKET BASIC | PLUS | PREMIUM
   ========================================================= */
    .plans-grid {
        grid-template-columns: 1fr;
        max-width: 500px;
        margin: 0 auto;
        gap: 25px;
		align-items: flex-start;
    }

    .plan-item {
        padding: 40px 25px;
    }

    .plan-featured {
        order: -1;
    }
/* =========================================================
   ZDR SOS KARTICA
   ========================================================= */
	.health-card-grid,
	.AED-grid,
	.health-card-info-grid,
	.SOS-gumb-grid,
	.health-card-pricing-grid,
	.health-card-how-grid,
	.health-card-cta-grid{grid-template-columns:1fr}
	.health-card-title{font-size:52px}
	.together-we-save-lives-title{font-size:52px}
	.health-card-subtitle{font-size:34px;margin-bottom:28px}
	.health-card-subtitle h3{font-size:34px;margin-bottom:28px}
	.health-card-intro{font-size:18px;text-align:left}
	.health-card-benefits{padding-left:0}
	.SOS-gumb-benefits{padding-left:0}
	.SOS-Tag-benefits{padding-left:0}
	.health-card-diagram img{width:90%}
	.SOS-gumb img{width:90%}
	.health-card-pricing-image img{margin:0 auto;max-width:520px}
	.health-card-cta .btn{justify-self:start}
	.SOS-Tag img{width:90%}
	
/* =========================================================
   O NAS 
   ========================================================= */	
  .about-grid,.about-grid.reverse,.about-hero .about-grid,.about-two-col,.trust-grid,.vision-grid,.media-grid,.about-app-grid{grid-template-columns:1fr}
  .about-tech-images{grid-template-columns:1fr 1fr}
  .trust-stats{grid-template-columns:repeat(2,1fr)}
  .values-grid{grid-template-columns:repeat(2,1fr)}
  .about-title,.about-hero .about-title{font-size:42px}
  .about-photo{order:2}
  .about-hero .about-copy{order:1}
  .certificate-img img{max-width:240px}
  .media-phones img{margin:auto}
}
@media(max-width:560px){
	.wrap {
        width: 100%;
        padding-left: 34px;
        padding-right: 12px;
    }
	/*.topbar{display:none}*/
	.topbar{
		background:var(--red);
		color:#fff;
		font-size:10px}
	.nav{min-height:64px}
	.hero{padding-top:24px}
	.hero h1{font-size:40px}
	.hero p,
	.image-certifikat img{
		width:90%;
		height:90%;}
	.health-card-diagram img{width:90%}
	.SOS-gumb-diagram img{width:90%}
    .health-card-icons {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 15px;
    }
    .features-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px 30px;
    }
	.products-grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 30px 30px;
		align-items: start;
	}
	.product-item h1 {
		margin: 0;
		text-align: center;
		font-size: 14px;
		line-height: 1.3;
		font-weight: bold;
		padding-bottom: 10px;
	}
    .health-card-icon img {
        width: 100px;
        height: auto;
    }
	.SOS-Tag img{width:90%}
	.copy-block p{font-size:16px}
	.stats-grid{grid-template-columns:repeat(2,1fr)}
	.stats-grid strong{font-size:28px}
	.copy-block h2{font-size:31px}
	.word-cloud{font-size:32px}
	.footer-grid{grid-template-columns:1fr}
	.logos{grid-template-columns:1fr 1fr}
	.copyright .wrap{display:block}
	.copyright span{display:block;margin-top:8px}

/* =========================================================
   GALLERY
   ========================================================= */
    .gallery-section {
        padding: 55px 0;
    }

    .gallery-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .gallery-item {
        border-radius: 14px;
    }

    .gallery-overlay {
        padding: 50px 20px 18px;
    }

    .gallery-overlay h3 {
        font-size: 19px;
    }
/* =========================================================
   PAKET BASIC | PLUS | PREMIUM
   ========================================================= */
    .plans-grid {
        grid-template-columns: 1fr;
        max-width: 500px;
        margin: 0 auto;
        gap: 25px;
    }

    .plan-item {
        padding: 40px 25px;
    }

    .plan-featured {
        order: 0;
    }
/* =========================================================
   ZDR SOS KARTICA
   ========================================================= */
  .health-card-hero{padding:30px 0 20px}
  .health-card-grid{gap:28px}
	.AED-grid{gap:28px}
  .health-card-title{font-size:39px}
  .together-we-save-lives-title{font-size:39px}
  .health-card-subtitle{font-size:28px}
  .health-card-subtitle h3{font-size:28px}
  .health-card-intro{font-size:16px}
  .SOS-Tag-info{padding:36px 0 36px}
  .App-info{padding:60px 0}
  .health-card-info{padding:18px 0 38px}
  .health-card-info-grid{gap:28px}
  .SOS-gumb-info{padding:18px 0 38px}
  .SOS-gumb-grid{gap:28px}
  .SOS-gumb-benefits h3{font-size:21px}
  .SOS-gumb-benefits ul{font-size:17px}
  .SOS-Tag-benefits h3{font-size:21px}
  .SOS-Tag-benefits ul{font-size:17px}
  .health-card-benefits h3{font-size:21px}
  .health-card-benefits ul{font-size:17px}
  .health-card-pricing{padding:34px 0}
  .health-card-pricing-grid{gap:26px}
  .health-card-how-grid{gap:26px}
  .health-card-pricing h2{font-size:42px}
  .health-card-pricing p,.health-card-pricing ul{font-size:16px}
  .health-card-cta{padding:36px 0}
  .health-card-cta h2{font-size:38px}

/* =========================================================
   O NAS 
   ========================================================= */	
  .about-section{padding:40px 0}
  .about-hero{padding:28px 0 40px}
  .about-title,.about-hero .about-title{font-size:35px}
  .about-subtitle{font-size:23px}
  .about-tech-images{grid-template-columns:1fr}
  .trust-stats{grid-template-columns:1fr 1fr}
  .trust-stats strong{font-size:27px}
  .values-grid{grid-template-columns:1fr 1fr;gap:22px 14px}
  .vision-card{padding:22px;border-radius:20px}
  .about-app-copy h2{font-size:32px}
  .about-app-copy p{font-size:22px}
}

/* =========================================================
   iHELP RESPONSIVE SVG LOGO
   ========================================================= */
.brand-logo{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:4px;
  flex:0 1 auto;
  min-width:0;
}

.brand-logo .header-logo{
  display:block;
  width:clamp(80px, 50vw, 100px);
  max-width:100%;
  height:auto;
  object-fit:contain;
}

.brand-logo .brand-tagline{
	display:block;
	padding-left: 3px;
	width:100%;
	color:var(--red);
	font-size:clamp(8px, .65vw, 11px);
	line-height:1.15;
	font-weight:600;
	letter-spacing:.015em;
	white-space:nowrap;
}

/* Večji tablični zasloni */
@media(max-width:1024px){
  .brand-logo .header-logo{
    width:clamp(80px, 15vw, 100px);
  }

  .brand-logo .brand-tagline{
    font-size:9px;
  }
}

/* Telefoni in manjši tablični zasloni */
@media(max-width:560px){
  .brand-logo{
    gap:2px;
  }

  .brand-logo .header-logo{
    width:clamp(80px, 31vw, 100px);
  }

  .brand-logo .brand-tagline{
    font-size:8px;
  }
}

/* Zelo ozki mobilni zasloni */
@media(max-width:360px){
  .brand-logo .header-logo{
    width:80px;
  }

  .brand-logo .brand-tagline{
    font-size:7.5px;
  }
}