hellohelse.com

do powiekszenia liter <style>

/* 🔸 Powiększenie opisów w kartach – styl dopasowany do tekstu sekcji głównej */

.hh-analizy .hh-desc {

font-size: 1.15rem !important; /* około 18–19 px, większy niż standard */

line-height: 1.7 !important; /* luźny odstęp, jak w opisie nad kafelkami */

color: #f5f5f5 !important; /* lekko jaśniejszy tekst dla kontrastu */

font-weight: 400 !important; /* nie za cienki */

}

/* 📱 Dla telefonów – delikatne dopasowanie, by tekst się nie „przyklejał” */

@media (max-width: 600px){

.hh-analizy .hh-desc {

font-size: 1.1rem !important; /* około 17–18 px */

line-height: 1.65 !important;

margin-bottom: 4px !important;

}

</style>

DO TRZYMANIA TEKSTU W JEDNEJ LINI NA TELEFONEI

<style>

/* ✅ SZYBKA ŁATKA MOBILNA – wyrównanie tytułów i brak rozjeżdżania */

/* 1) Na małych ekranach pozwól tytułom się normalnie łamać,

a gdy słowo jest bardzo długie – łam je „gdziekolwiek” (bez myślnika) */

@media (max-width: 600px){

.hh-analizy .hh-title{

white-space: normal !important; /* cofamy nowrap */

-webkit-hyphens: manual !important; /* wyłącz automatyczne dywizy */

hyphens: manual !important;

overflow-wrap: anywhere !important; /* jeśli trzeba – złam słowo */

word-break: break-word !important;

font-size: clamp(22px, 6.2vw, 30px) !important; /* rozsądny, mniejszy rozmiar */

line-height: 1.15 !important;

letter-spacing: -0.01em;

}

/* 2) Niech przyciski nie „pompą” karty – mniej agresywna poświata */

.hh-analizy .hh-btn::after{

inset: -4px !important; /* mniejsza pulsująca ramka */

}

/* 3) Delikatnie ciaśniejsze karty – mniej scrolla i bez ocierania brzegów */

.hh-analizy .hh-card{

padding: 28px 22px 26px !important;

border-radius: 18px !important;

}

/* 4) Mniejsze odstępy między kafelkami na telefonie */

.hh-analizy .hh-grid{

gap: 22px !important;

padding: 24px 16px !important;

}

/* 5) Bardzo wąskie ekrany */

@media (max-width: 360px){

.hh-analizy .hh-title{

font-size: clamp(20px, 6.8vw, 26px) !important;

}

</style>

I WLASCIWY KOD

<style>

.hh-analizy{margin:0;padding:0}

.hh-analizy *{box-sizing:border-box}

.hh-grid{

display:grid;

grid-template-columns:repeat(2,minmax(320px,1fr));

gap:48px;

background:#8ea3ad;

border-radius:22px;

padding:40px 36px;

overflow:visible;

}

@media (max-width:900px){ .hh-grid{ grid-template-columns:1fr; gap:28px; padding:28px 20px; } }

.hh-card{

background:#2E3A47;

color:#E6E6E6;

border-radius:22px;

padding:40px 28px 36px;

box-shadow:0 12px 30px rgba(0,0,0,.35);

text-align:center;

display:flex;flex-direction:column;justify-content:space-between;

min-height:420px;

}

/* 🌟 Overskrifter – hvite, store og tydelige */

.hh-title{

color:#ffffff !important;

font-weight:800 !important;

line-height:1.2 !important;

font-size:clamp(22px, 2.4rem, 40px) !important;

margin:0 0 14px !important;

text-shadow:0 0 5px rgba(255,255,255,0.2);

}

.hh-desc{margin:0;line-height:1.6;font-size:1rem;flex:1;color:#e6e6e6}

.hh-divider{

width:120px;height:5px;border-radius:10px;background:#b46f6a;

margin:24px auto 18px;

}

/* 🔘 Knapper – mørk lakserosa + hvit tekst + puls + hover marineblå */

.hh-btn{

position:relative;

display:inline-flex;align-items:center;justify-content:center;

padding:12px 110px;

border-radius:50px;

background:#b46f6a !important;

color:#fff !important;

font-weight:800;

text-decoration:none;

box-shadow:0 8px 20px rgba(0,0,0,.25);

transition:all .3s ease;

margin:16px auto 0;

white-space:nowrap;

z-index:1;

}

/* 🟦 HOVER = marineblå */

.hh-btn:hover{

background:#23313f !important;

box-shadow:0 10px 22px rgba(35,49,63,.4);

transform:translateY(-2px);

color:#fff !important;

}

/* ✨ Pulserende ramme */

@keyframes hhPulseRing{

0% { box-shadow:0 0 0 0 rgba(180,111,106,.55); }

70% { box-shadow:0 0 0 14px rgba(180,111,106,0); }

100% { box-shadow:0 0 0 0 rgba(180,111,106,0); }

}

.hh-btn::after{

content:"";position:absolute;inset:-6px;border-radius:inherit;

pointer-events:none;z-index:-1;

animation:hhPulseRing 1.9s infinite ease-out;

box-shadow:0 0 0 0 rgba(180,111,106,.55);

}

@media (max-width:600px){

.hh-btn{padding:12px 80px;}

}

</style>

<h3 class="hh-title">Genetisk test</h3>

Få innsikt i ditt DNA og handle bevisst. Analysen vurderer genetiske

disposisjoner, stoffskifte, avgiftningsevne og følsomhet for næringsstoffer.

</p>

</a>

</div>

<h3 class="hh-title">Hårmineralanalyse</h3>

Analyse av 20 biominraler og 9 toksiske elementer i én test.

En ikke-invasiv metode for å vurdere mineralbalanse, stoffskifte

og belastning av tungmetaller i kroppen.

</p>

</a>

</div>

<h3 class="hh-title">Matintoleranse</h3>

Finn ut hvilke matvarer kroppen reagerer på. En laboratorietest

som måler immunreaksjoner (IgG/IgA) og hjelper deg med å

tilpasse eliminasjonsdiett og støtte tarmhelsen.

</p>

</a>

</div>

<h3 class="hh-title">Organiske syrer (OAP)</h3>

En avansert analyse av urin eller blod som viser cellemetabolisme,

oksidativt stress og mitokondriefunksjon – alt i én test.

</p>

</a>

</div>