-k 8px margót kapnak, a flex
`align-items:stretch` a sáv magasságából levonja őket, az UTOLSÓ klón
viszont (margó nélkül) 8px-cel magasabb kártyát kap. Ez a szalag
indulása óta fennáll (a változás előtt 450 vs 458px), csak a rövidebb
kártyán szembetűnőbb. Egy osztállyal nagyobb fajsúly kell hozzá; a
prózalisták szabálya érintetlen marad, ez CSAK a szalagra szűkít. */
.mt-marquee .mt-marquee__track > li {
margin-block: 0;
}
/* ── Kategóriaszűrő chipsor (blog lista) ───────────────────────── */
.mt-chip-filter {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
}
.mt-chip-filter ul {
list-style: none;
display: contents;
}
/* A li a chip (a darabszám a linken kívül, de a li-n belül áll). */
.mt-chip-filter li,
.mt-chip-all,
.mt-chip-plain {
margin: 0;
display: inline-flex;
align-items: center;
gap: 4px;
border: 1px solid var(--wp--preset--color--border);
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--heading);
border-radius: var(--mt-radius-pill);
padding: 7px 14px;
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 13px;
line-height: 1.2;
transition: border-color var(--mt-dur-fast) var(--mt-ease), color var(--mt-dur-fast) var(--mt-ease);
}
.mt-chip-filter li a {
color: inherit;
text-decoration: none;
}
.mt-chip-filter li:hover,
.mt-chip-filter li:focus-within {
border-color: var(--wp--preset--color--primary);
color: var(--wp--preset--color--primary);
}
/* „Összes" chip — a listaoldalon aktív (kék), archívumon sima. */
p.mt-chip-all {
background: var(--wp--preset--color--primary);
border-color: var(--wp--preset--color--primary);
}
p.mt-chip-all,
p.mt-chip-all a {
color: var(--wp--preset--color--base);
text-decoration: none;
}
p.mt-chip-plain a {
color: inherit;
text-decoration: none;
}
p.mt-chip-plain:hover,
p.mt-chip-plain:focus-within {
border-color: var(--wp--preset--color--primary);
color: var(--wp--preset--color--primary);
}
/* Az épp megnyitott kategória chipje aktív (kék) — mint a listaoldali „Összes".
A wp:categories a `current-cat` osztályt teszi az aktuális kategória li-jére. */
.mt-chip-filter li.current-cat,
.mt-chip-filter li.current-cat:hover,
.mt-chip-filter li.current-cat:focus-within {
background: var(--wp--preset--color--primary);
border-color: var(--wp--preset--color--primary);
color: var(--wp--preset--color--base);
}
.mt-chip-filter li.current-cat a {
color: var(--wp--preset--color--base);
}
/* ── Morzsasor ─────────────────────────────────────────────────── */
.mt-crumbs {
font-size: 13px;
}
.mt-crumbs a {
text-decoration: none;
}
.mt-crumbs .mt-crumbs__sep {
color: var(--mt-gray-muted);
margin: 0 4px;
}
.mt-on-dark .mt-crumbs,
.mt-on-dark .mt-crumbs span {
color: rgba(255, 255, 255, 0.75);
}
.mt-on-dark .mt-crumbs a {
color: var(--wp--preset--color--accent);
}
/* ── USP / öko elemek ──────────────────────────────────────────── */
.mt-usp-flex {
display: flex;
gap: 15px;
align-items: flex-start;
background: transparent;
border: none;
box-shadow: none;
}
.mt-usp-icon {
flex: none;
width: 48px;
height: 48px;
border-radius: var(--mt-radius-md);
background: var(--mt-blue-tint);
color: var(--wp--preset--color--primary);
display: grid;
place-items: center;
}
.mt-usp-icon svg {
width: 22px;
height: 22px;
}
.mt-usp-icon--green {
background: var(--mt-green-tint);
color: var(--wp--preset--color--success);
}
/* ── Sötét sávok (hero, CTA sáv, lábléc, oldalfejléc) ──────────── */
.mt-band a:not(.wp-block-button__link),
.mt-footer a:not(.wp-block-button__link) {
color: var(--wp--preset--color--base);
text-decoration: underline;
text-underline-offset: 3px;
transition: text-decoration-thickness var(--mt-dur-fast) var(--mt-ease);
}
.mt-band a:not(.wp-block-button__link):hover,
.mt-footer a:not(.wp-block-button__link):hover {
color: var(--wp--preset--color--base);
text-decoration-thickness: 2px;
}
.mt-on-dark-muted {
color: rgba(255, 255, 255, 0.78);
}
/* Oldal-fejlécsáv (aloldalak, 404): acélpala gradiens. */
.mt-page-hero {
background: var(--mt-dark-gradient);
}
/* ── Lábléc ────────────────────────────────────────────────────── */
.mt-footer-links {
list-style: none;
padding-left: 0;
margin: 0;
}
.mt-footer-links li {
margin: 0 0 10px;
font-size: 13.5px;
}
.mt-footer-links a:not(.wp-block-button__link) {
text-decoration: none;
color: rgba(255, 255, 255, 0.8);
transition: color var(--mt-dur-fast) var(--mt-ease);
}
.mt-footer-links a:not(.wp-block-button__link):hover,
.mt-footer-links a:not(.wp-block-button__link):focus {
text-decoration: underline;
color: var(--wp--preset--color--base);
}
.mt-footer-head {
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 13px;
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--wp--preset--color--base);
}
/* Oszlopelválasztó hajszálvonal — az élő lábléc mintája (ott: 1px #323232
* border-left a 2..5. oszlopon, csak desktopon). 782px = a wp:columns
* tördelési töréspontja: egymás alá rakódva a vonal kikapcsol, ahogy élőben is. */
@media (min-width: 782px) {
.mt-footer > .wp-block-columns > .wp-block-column + .wp-block-column {
border-left: 1px solid rgba(255, 255, 255, 0.12);
padding-left: 32px;
}
}
.mt-footer-contact {
list-style: none;
padding: 0;
margin: 0;
font-size: 13px;
}
.mt-footer-contact li {
display: flex;
align-items: center;
gap: 8px;
margin: 0 0 6px;
}
.mt-footer-contact svg {
width: 14px;
height: 14px;
color: var(--wp--preset--color--accent);
flex: none;
}
.mt-footer-bottom {
border-top: 1px solid rgba(255, 255, 255, 0.12);
}
/* Alsó jogi linksor (a copyright fölött). */
.mt-footer-legal {
list-style: none;
padding: 0;
margin: 0 0 10px;
display: flex;
flex-wrap: wrap;
gap: 6px 16px;
font-size: 12.5px;
}
.mt-footer-legal a:not(.wp-block-button__link) {
text-decoration: none;
color: rgba(255, 255, 255, 0.7);
transition: color var(--mt-dur-fast) var(--mt-ease);
}
.mt-footer-legal a:not(.wp-block-button__link):hover,
.mt-footer-legal a:not(.wp-block-button__link):focus {
text-decoration: underline;
color: var(--wp--preset--color--base);
}
/* ── Bejegyzés-hero (single: kiemelt kép + sötét átmenet) ──────── */
.mt-post-hero {
position: relative;
}
.mt-post-hero .wp-block-cover__background {
background: linear-gradient(0deg, rgba(31, 42, 56, 0.85) 0%, rgba(31, 42, 56, 0.35) 60%, rgba(31, 42, 56, 0.2) 100%) !important;
opacity: 1 !important;
}
.mt-post-hero .wp-block-cover__inner-container {
display: flex;
flex-direction: column;
justify-content: flex-end;
min-height: inherit;
text-align: left;
}
/* A constrained layout margin-inline:auto-ja középre húzná a sorokat
* (a WP dupla-osztályos containere később töltődik → !important kell). */
.mt-post-hero .wp-block-cover__inner-container > * {
margin-left: 0 !important;
margin-right: 0 !important;
}
/* Per-poszt hero fókuszpont: ahol a kiemelt kép fontos része (pl. arc)
* az alapértelmezett 50% 50% vágással kicsúszna a sávból.
* Slug-alapú horog (functions.php: menet_trend_slug_body_class) — a core
* postid-N osztálya törlés+újralétrehozásnál vagy újraimportnál elszáll,
* a slug stabil marad. */
.mt-slug-nem-multidezes-kezzelfoghato-elonyok-ma .mt-post-hero .wp-block-cover__image-background {
object-position: 57% 18%;
}
/* ── Lapozás ───────────────────────────────────────────────────── */
.wp-block-query-pagination {
justify-content: center;
gap: 6px;
}
.wp-block-query-pagination a,
.wp-block-query-pagination .page-numbers,
.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
text-decoration: none;
}
.wp-block-query-pagination-numbers .page-numbers {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 38px;
height: 38px;
padding: 0 8px;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--heading);
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 14px;
transition: border-color var(--mt-dur-fast) var(--mt-ease), color var(--mt-dur-fast) var(--mt-ease);
}
.wp-block-query-pagination-numbers .page-numbers.current {
background: var(--wp--preset--color--primary);
border-color: var(--wp--preset--color--primary);
color: var(--wp--preset--color--base);
}
.wp-block-query-pagination-numbers .page-numbers:not(.current):hover {
border-color: var(--wp--preset--color--primary);
color: var(--wp--preset--color--primary);
}
.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 38px;
height: 38px;
padding: 0 10px;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--heading);
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 14px;
transition: border-color var(--mt-dur-fast) var(--mt-ease), color var(--mt-dur-fast) var(--mt-ease);
}
.wp-block-query-pagination-previous:hover,
.wp-block-query-pagination-next:hover {
border-color: var(--wp--preset--color--primary);
color: var(--wp--preset--color--primary);
}
/* ── Kereső ────────────────────────────────────────────────────── */
.wp-block-search__input {
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
padding: 10px 14px;
font-family: var(--wp--preset--font-family--body);
font-size: 16px;
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--body);
transition: border-color var(--mt-dur-fast) var(--mt-ease), box-shadow var(--mt-dur-fast) var(--mt-ease);
}
.wp-block-search__input:focus {
border-color: var(--wp--preset--color--primary);
box-shadow: 0 0 0 3px var(--mt-blue-tint);
outline: none;
}
.wp-block-search .wp-block-search__button {
margin-left: 10px;
border-radius: var(--mt-radius-sm);
}
/* ── Bejegyzéstartalom ─────────────────────────────────────────── */
/* Horgonyra ugráskor a ragadós fejléc ne takarja a célt. */
.wp-block-post-content [id] {
scroll-margin-top: 96px;
}
.wp-block-post-content h2:not(:first-child) {
margin-top: 45px;
}
.wp-block-post-content h3:not(:first-child),
.wp-block-post-content h4:not(:first-child) {
margin-top: 35px;
}
.wp-block-post-content img {
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-sm);
max-width: 100%;
height: auto;
}
.wp-block-post-content figcaption {
margin-top: 7px;
font-size: 12.5px;
color: var(--mt-gray-muted);
}
.wp-block-post-content li {
margin-bottom: 8px;
}
.wp-block-post-content li:last-child {
margin-bottom: 0;
}
/* Örökölt sorkizárt szövegek feloldása (olvashatóság).
Bármely elemre (p/div/ul/li/figcaption/h*) — a régi szabály csak -t
fogott, így a lista/div szintű sorkizárás bennmaradt (NONOX-audit F2). */
.wp-block-post-content [style*="text-align: justify"],
.wp-block-post-content [style*="text-align:justify"] {
text-align: left !important;
}
/* Lebegő blogkép: a következő teljes szélességű kép / címsor törli a lebegést,
hogy tiszta sorban kezdődjön (magazin ritmus, NONOX blog 2026-07-08). */
.wp-block-post-content .wp-block-heading,
.wp-block-post-content > .wp-block-image:not(.alignleft):not(.alignright) {
clear: both;
}
/* Lebegő kép a középre zárt hasábban: a core a konténer (alignwide) széléhez
úsztat, nem a 760px-es tartalomhasábhoz — a margó a hasáb szélére tolja,
így a szöveg a kép mellett folyik (NONOX blog, post 3037, 2026-07-13). */
@media (min-width: 601px) {
.wp-block-post-content > .alignleft {
margin-inline-start: calc((100% - var(--wp--style--global--content-size, 760px)) / 2);
margin-inline-end: 32px;
}
.wp-block-post-content > .alignright {
margin-inline-end: calc((100% - var(--wp--style--global--content-size, 760px)) / 2);
margin-inline-start: 32px;
}
}
/* Lebegő képek mobilon: a jobbra/balra igazított kép ne szorítsa vékony
hasábba a szöveget kis kijelzőn — 600px alatt teljes szélességű, középre
igazított blokk lesz (a beállított float-szélességet is visszavonjuk). */
@media (max-width: 600px) {
.wp-block-post-content .alignright,
.wp-block-post-content .alignleft {
float: none;
width: auto !important;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.wp-block-post-content .alignright img,
.wp-block-post-content .alignleft img {
width: auto !important;
}
}
/* Idézet — égszínkék léc, halványkék felület. */
.wp-block-quote {
background: var(--mt-blue-tint);
border-radius: 0 var(--mt-radius-sm) var(--mt-radius-sm) 0;
font-style: italic;
}
/* Mobilon a böngésző-alap 40px oldalmargó keskeny hasábba préseli az
idézetet — a kártya teljes szélességét kapja meg. */
@media (max-width: 640px) {
.wp-block-quote {
margin-left: 0;
margin-right: 0;
}
}
/* Táblázatok — műszaki adatokhoz. */
.wp-block-table table {
border-collapse: collapse;
width: 100%;
}
.wp-block-table th,
.wp-block-table td {
border: 1px solid var(--wp--preset--color--border);
padding: 10px 14px;
font-size: 15px;
text-align: left;
vertical-align: top;
}
.wp-block-table th {
background: var(--wp--preset--color--section);
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
color: var(--wp--preset--color--heading);
}
.wp-block-code,
.wp-block-preformatted {
background: var(--wp--preset--color--section);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
padding: 20px;
font-size: 14px;
overflow: auto;
}
/* ── Kapcsolat oldal: térkép (örökölt tartalmi osztály) ────────── */
.mt-map {
position: relative;
aspect-ratio: 4 / 3;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
overflow: hidden;
box-shadow: var(--mt-shadow-sm);
}
.mt-map iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
}
/* ── Rólunk: történet + oldalsáv rács (about mockup) ───────────── */
.mt-about-grid {
display: grid;
grid-template-columns: minmax(0, 1fr) 320px;
gap: 48px;
align-items: start;
}
@media (max-width: 1023px) {
.mt-about-grid {
grid-template-columns: 1fr;
}
}
.mt-side-card {
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-sm);
overflow: hidden;
}
.mt-info-links {
list-style: none;
margin: 0;
padding: 0;
}
.mt-info-links li {
margin: 0;
}
.mt-info-links a {
display: flex;
align-items: center;
gap: 10px;
padding: 7px 0;
font-size: 14px;
text-decoration: none;
}
.mt-info-links a:hover,
.mt-info-links a:focus {
text-decoration: underline;
}
.mt-info-links svg {
width: 16px;
height: 16px;
color: var(--mt-gray-muted);
flex: none;
}
/* Az oldalfejléc statisztikái kisebbek, mint a főoldali sáv. */
.mt-page-hero .mt-stat__value {
font-size: clamp(24px, 2.6vw, 30px);
}
/* Kapcsolat-fejléc: elérhetőségi sorok ikonokkal a sötét sávban. */
.mt-hero-contact {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
gap: 14px 36px;
font-size: 15px;
}
.mt-hero-contact li {
display: flex;
align-items: center;
gap: 9px;
margin: 0;
color: rgba(255, 255, 255, 0.88);
}
.mt-hero-contact svg {
width: 16px;
height: 16px;
color: var(--wp--preset--color--accent);
flex: none;
}
.mt-hero-contact a {
color: var(--wp--preset--color--base);
text-decoration: underline;
text-underline-offset: 3px;
}
.mt-hero-contact a:hover,
.mt-hero-contact a:focus {
text-decoration-thickness: 2px;
}
/* Kapcsolati sorok világos háttéren (hero-ból áthelyezve). */
.mt-contact-rows li { color: var(--wp--preset--color--body); }
.mt-contact-rows a { color: var(--wp--preset--color--primary); }
.mt-contact-rows__label { color: var(--wp--preset--color--muted); }
/* A generikus .mt-info-card lista-szabályok elrontják ezt a flex sort:
a padding-left behúzza (nem középre esik), a li margin-bottom pedig
az align-items:center miatt felfelé tolja a sorokat (egyenetlen). */
.mt-info-card .mt-contact-rows { padding-left: 0; }
.mt-info-card .mt-contact-rows li { margin-bottom: 0; }
/* Kapcsolat oldal: a nyitvatartási táblák alatti kiegészítő bekezdés
(áruátvétel + útvonaltervezés) középre, hogy a két hasábhoz képest
szimmetrikus legyen. A className a sablon post-content blokkján ül,
így minden nyelvi változat örökli. */
.mt-kapcsolat-content > p { text-align: center; }
/* ── Hajónapló-hero: fotó + acélpala átmenet + bal élcsík ──────── */
.mt-story-hero {
position: relative;
background:
linear-gradient(90deg, rgba(26, 36, 49, 0.95) 0%, rgba(26, 36, 49, 0.88) 45%, rgba(26, 36, 49, 0.62) 100%),
url('assets/images/hero-4.jpg') center / cover no-repeat;
}
.mt-story-hero::before {
content: "";
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 6px;
background: linear-gradient(180deg, var(--wp--preset--color--accent), var(--wp--preset--color--primary));
}
/* ── Idővonal (hajónapló) ──────────────────────────────────────── */
.mt-milestone__head {
margin: 0;
display: flex;
align-items: baseline;
gap: 12px;
flex-wrap: wrap;
}
.mt-milestone__year {
font-family: var(--wp--preset--font-family--heading);
font-weight: 700;
font-size: 24px;
color: var(--wp--preset--color--primary);
line-height: 1;
}
.mt-milestone__title {
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 17px;
color: var(--wp--preset--color--heading);
line-height: 1.3;
}
.mt-milestone p {
font-size: 15px;
line-height: 1.66;
}
.mt-milestone .wp-block-quote {
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 15.5px;
font-style: normal;
line-height: 1.45;
}
/* Természetes képarány, magasságplafonnal — álló fotó nem torzul/vágódik. */
.mt-milestone img {
border-radius: var(--mt-radius-sm);
border: 1px solid var(--wp--preset--color--border);
box-shadow: none;
width: auto;
max-width: 100%;
height: auto;
/* Idővonal-fotók arányos méret (nem uralja a mérföldkövet). */
max-height: 380px;
}
.mt-timeline {
position: relative;
border-left: 2px solid var(--wp--preset--color--border);
padding-left: 28px;
margin-left: 8px;
display: flex;
flex-direction: column;
gap: 22px;
}
.mt-milestone {
position: relative;
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
padding: 20px;
box-shadow: var(--mt-shadow-sm);
}
.mt-milestone::before {
content: "";
position: absolute;
left: -38px;
top: 8px;
width: 18px;
height: 18px;
border-radius: 50%;
background: var(--wp--preset--color--primary);
border: 3px solid var(--wp--preset--color--section);
box-shadow: 0 0 0 1px var(--wp--preset--color--border);
}
/* ── Megjelenési animáció (JS kapcsolja élesre; JS nélkül látható) ── */
.mt-reveal.mt-armed {
opacity: 0;
transform: translateY(8px);
transition: opacity var(--mt-dur-slow) var(--mt-ease), transform var(--mt-dur-slow) var(--mt-ease);
will-change: opacity, transform;
}
.mt-reveal.mt-armed.is-in {
opacity: 1;
transform: none;
}
@media (prefers-reduced-motion: reduce) {
.mt-reveal.mt-armed {
opacity: 1;
transform: none;
transition: none;
}
.wp-block-button__link:hover,
.mt-cat-tile:hover,
.mt-card:hover {
transform: none;
}
.mt-choice input,
.mt-choice input::after,
.mt-field input,
.mt-field textarea,
.mt-field select {
transition: none;
}
}
/* ── ÁSZF / jogi oldal (page-altalanos-szerzodesi-feltetelek) ──────── */
/* Hero meta-chipek. */
.mt-legal-meta {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 20px;
}
.mt-legal-chip {
display: inline-flex;
align-items: center;
gap: 7px;
padding: 6px 13px;
border-radius: var(--mt-radius-pill);
background: rgba(255, 255, 255, 0.12);
border: 1px solid rgba(255, 255, 255, 0.2);
color: var(--wp--preset--color--base);
font-family: var(--wp--preset--font-family--heading);
font-size: 13px;
font-weight: 600;
line-height: 1;
}
.mt-legal-chip svg {
width: 15px;
height: 15px;
opacity: 0.85;
}
/* Rács: ragadós tartalomjegyzék (bal) + tartalom (jobb). */
.mt-legal-grid {
display: grid;
grid-template-columns: 300px minmax(0, 1fr);
gap: 44px;
/* Az oldalsáv nyúljon a teljes sormagasságra, hogy a ragadós
tartalomjegyzék végig látszódjon a hosszú jogi szövegnél. */
align-items: stretch;
}
@media (max-width: 1023px) {
.mt-legal-grid {
grid-template-columns: 1fr;
gap: 26px;
}
}
/* ── ÁSZF szövegkereső (a ragadós tartalomjegyzék tetején) ──────── */
.mt-docsearch {
margin-bottom: 14px;
padding-bottom: 14px;
border-bottom: 1px solid var(--wp--preset--color--border);
}
.mt-docsearch__field {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 10px;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--base);
transition: border-color var(--mt-dur-fast) var(--mt-ease);
}
.mt-docsearch__field:focus-within {
border-color: var(--wp--preset--color--primary);
}
.mt-docsearch__icon {
width: 16px;
height: 16px;
flex: none;
color: var(--wp--preset--color--muted);
}
.mt-docsearch__input {
flex: 1;
min-width: 0;
border: 0;
outline: 0;
background: transparent;
font-family: var(--wp--preset--font-family--body);
font-size: 14px;
color: var(--wp--preset--color--heading);
}
.mt-docsearch__input::-webkit-search-cancel-button {
display: none;
}
.mt-docsearch__clear {
flex: none;
border: 0;
background: transparent;
cursor: pointer;
font-size: 18px;
line-height: 1;
color: var(--wp--preset--color--muted);
padding: 0 2px;
transition: color var(--mt-dur-fast) var(--mt-ease);
}
.mt-docsearch__clear:hover {
color: var(--wp--preset--color--accent);
}
.mt-docsearch__status {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
margin-top: 8px;
font-size: 12.5px;
color: var(--wp--preset--color--muted);
}
/* A `display:flex` felülírja a böngésző [hidden] szabályát, ezért a rejtett
státusz-sáv ("nincs találat") keresés nélkül is látszana — visszazárjuk. */
.mt-docsearch__status[hidden] {
display: none;
}
.mt-docsearch__nav {
display: inline-flex;
gap: 4px;
}
.mt-docsearch__btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 26px;
height: 26px;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--heading);
cursor: pointer;
transition: border-color var(--mt-dur-fast) var(--mt-ease),
background var(--mt-dur-fast) var(--mt-ease),
color var(--mt-dur-fast) var(--mt-ease);
}
.mt-docsearch__btn:hover {
border-color: var(--wp--preset--color--primary);
background: var(--mt-blue-tint);
color: var(--wp--preset--color--primary);
}
.mt-docsearch__btn svg {
width: 15px;
height: 15px;
}
/* Találat-kiemelés a jogi törzsszövegben. */
mark.mt-legal-hit {
background: var(--mt-blue-tint);
color: inherit;
border-radius: 3px;
box-shadow: inset 0 0 0 1px rgba(6, 118, 182, 0.28);
scroll-margin-top: 100px;
}
mark.mt-legal-hit.is-current {
background: var(--wp--preset--color--accent);
color: var(--wp--preset--color--base);
box-shadow: none;
}
/* Tartalomjegyzék oldalsáv. */
.mt-legal-toc {
position: sticky;
top: 88px;
padding: 18px 20px;
}
/* A ragadós fejléc bejelentkezve 32px-el lejjebb csúszik (lásd fent), ezért a
ragadós oldalsávnak is el kell tolódnia — különben a kártya teteje a fejléc
mögé kerül. A TOC csak 1024px felett ragadós, ott az admin-sáv mindig 32px. */
body.admin-bar .mt-legal-toc {
top: 120px;
}
@media (max-width: 1023px) {
.mt-legal-toc {
position: static;
}
}
.mt-legal-toc__title {
margin: 0 0 12px;
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 12.5px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--wp--preset--color--muted);
}
.mt-legal-toc__list {
list-style: none;
margin: 0;
padding: 0;
}
.mt-legal-toc__list li {
margin: 0;
}
.mt-legal-toc__list a {
display: flex;
gap: 9px;
align-items: baseline;
padding: 6px 9px;
margin: 1px 0;
border-radius: var(--mt-radius-sm);
text-decoration: none;
color: var(--wp--preset--color--body);
font-size: 13.5px;
line-height: 1.35;
transition: background var(--mt-dur-fast) var(--mt-ease),
color var(--mt-dur-fast) var(--mt-ease);
}
.mt-legal-toc__list a:hover,
.mt-legal-toc__list a:focus,
.mt-legal-toc__list a.is-active {
background: var(--mt-blue-tint);
color: var(--wp--preset--color--primary);
}
.mt-legal-toc__list a.is-active {
font-weight: 600;
}
.mt-legal-toc__n {
flex: none;
min-width: 20px;
text-align: right;
font-family: var(--wp--preset--font-family--heading);
font-weight: 700;
font-size: 12px;
color: var(--wp--preset--color--primary);
}
/* Segítség kártya. */
.mt-legal-help {
margin-top: 16px;
padding: 18px 20px;
}
.mt-legal-help__title {
margin: 0 0 6px;
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 15px;
line-height: 1.35;
color: var(--wp--preset--color--heading);
}
.mt-legal-help__text {
margin: 0 0 12px;
font-size: 13.5px;
line-height: 1.5;
color: var(--wp--preset--color--body);
}
.mt-legal-help__link {
display: block;
padding: 3px 0;
font-size: 14px;
font-weight: 600;
color: var(--wp--preset--color--primary);
text-decoration: none;
}
.mt-legal-help__link:hover,
.mt-legal-help__link:focus {
text-decoration: underline;
}
/* Tartalomoszlop. */
.mt-legal-main {
min-width: 0;
}
/* Figyelmeztető sáv (intro). */
.mt-legal-notice {
display: flex;
gap: 14px;
align-items: flex-start;
padding: 18px 20px;
margin: 0 0 30px;
background: var(--mt-blue-tint);
border: 1px solid var(--mt-blue-tint-border);
border-left: 4px solid var(--wp--preset--color--primary);
border-radius: var(--mt-radius-md);
}
.mt-legal-notice__icon {
flex: none;
width: 22px;
height: 22px;
margin-top: 1px;
color: var(--wp--preset--color--primary);
}
.mt-legal-notice__body p {
margin: 0 0 10px;
font-size: 14.5px;
line-height: 1.55;
color: var(--wp--preset--color--heading);
}
.mt-legal-notice__body p:last-child {
margin-bottom: 0;
}
.mt-legal-notice__body strong {
font-weight: 600;
}
/* wpautop néha üres
-t szúr a flex-sávba (ikon melletti fantomrés) — kilőjük. */
.mt-legal-notice > p:empty {
display: none;
}
/* wpautop a körüli sortörésekből fantom
-t csinál → üres sáv a
doboz tetején/alján, az ikon elcsúszik a szövegtől. A figyelmeztető sávban
nincs szándékos sortörés, ezért kilőjük. */
.mt-legal-notice__body br {
display: none;
}
/* Cégadatok kártya. */
.mt-legal-company {
padding: 22px 24px;
margin: 0 0 34px;
background: var(--wp--preset--color--section);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
}
/* Tag-kvalifikált címszelektorok ((0,1,1)): sorrendtől függetlenül verik a core
* :root :where(.is-layout-*) > * blokk-margókat — nem kell !important. */
h2.mt-legal-company__title {
margin: 0 0 14px;
font-size: 17px;
font-weight: 600;
color: var(--wp--preset--color--heading);
}
.mt-legal-dl {
margin: 0;
}
.mt-legal-dl__row {
display: grid;
grid-template-columns: 195px minmax(0, 1fr);
gap: 12px;
padding: 8px 0;
border-top: 1px solid var(--wp--preset--color--border);
}
.mt-legal-dl__row:first-child {
border-top: none;
padding-top: 0;
}
.mt-legal-dl dt {
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 13.5px;
color: var(--wp--preset--color--muted);
}
.mt-legal-dl dt::after {
content: ":";
}
.mt-legal-dl dd {
margin: 0;
font-size: 14.5px;
color: var(--wp--preset--color--body);
}
.mt-legal-dl dd a {
color: var(--wp--preset--color--primary);
text-decoration: none;
}
.mt-legal-dl dd a:hover {
text-decoration: underline;
}
@media (max-width: 480px) {
.mt-legal-dl__row {
grid-template-columns: 1fr;
gap: 2px;
}
}
/* Számozott fejezetek. */
.mt-legal-section {
padding: 26px 0 4px;
border-top: 1px solid var(--wp--preset--color--border);
}
.mt-legal-section:first-of-type {
border-top: none;
padding-top: 4px;
}
h2.mt-legal-h {
display: flex;
gap: 14px;
align-items: center;
margin: 0 0 16px;
font-size: 22px;
line-height: 1.25;
color: var(--wp--preset--color--heading);
}
.mt-legal-h__num {
flex: none;
display: inline-flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--gradient--brand);
color: var(--wp--preset--color--base);
font-family: var(--wp--preset--font-family--heading);
font-weight: 700;
font-size: 16px;
}
.mt-legal-h__title {
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
}
.mt-legal-section h6 {
margin: 18px 0 4px;
font-family: var(--wp--preset--font-family--heading);
font-weight: 700;
font-size: 13px;
letter-spacing: 0.02em;
color: var(--wp--preset--color--primary);
}
/* Címzett alfejezet (pl. GDPR §9: Cookie / Külső médiacégek). */
/* (0,2,1): kiegyenlíti az 1373-as prózai h3:not(:first-child) 35px-ét — később jön, ő nyer. */
.wp-block-post-content h3.mt-legal-sub {
margin: 22px 0 8px;
padding-left: 12px;
border-left: 3px solid var(--wp--preset--color--accent);
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 16px;
line-height: 1.3;
color: var(--wp--preset--color--heading);
}
/* ── Garancia program (marketing oldal) ──────────────────────────── */
/* Zöld "ok" chip a hero garancia-ígéretéhez. */
.mt-legal-chip--ok {
background: rgba(80, 173, 85, 0.2);
border-color: rgba(80, 173, 85, 0.45);
}
/* Összerágódás logó (kis, felül). */
.wp-block-post-content .mt-garancia-logo {
margin: 0 0 6px;
max-width: 150px;
}
.wp-block-post-content .mt-garancia-logo img {
width: 100%;
height: auto;
box-shadow: none;
border-radius: 0;
}
/* "NEM ..." kártyák. */
.mt-nem-cards {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 14px;
margin: 4px 0 26px;
}
@media (max-width: 720px) {
.mt-nem-cards {
grid-template-columns: 1fr;
}
}
.mt-nem-card {
display: flex;
align-items: center;
gap: 11px;
padding: 15px 17px;
background: var(--wp--preset--color--section);
border: 1px solid var(--wp--preset--color--border);
border-left: 3px solid var(--wp--preset--color--primary);
border-radius: var(--mt-radius-sm);
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 15px;
line-height: 1.25;
color: var(--wp--preset--color--heading);
}
.mt-nem-card svg {
flex: none;
width: 20px;
height: 20px;
color: var(--wp--preset--color--primary);
}
/* Beágyazott videó (16:9). */
.mt-embed {
position: relative;
aspect-ratio: 16 / 9;
margin: 6px 0 8px;
border-radius: var(--mt-radius-md);
overflow: hidden;
box-shadow: var(--mt-shadow-sm);
background: var(--wp--preset--color--heading);
}
.mt-embed iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
}
/* Garancia kiemelő doboz. */
.mt-guarantee {
display: grid;
grid-template-columns: minmax(0, 1fr) 200px;
gap: 28px;
align-items: center;
margin: 34px 0;
padding: 28px 30px;
background: var(--mt-green-tint);
border: 1px solid var(--mt-green-tint-border);
border-left: 4px solid var(--wp--preset--color--success);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-sm);
}
@media (max-width: 640px) {
.mt-guarantee {
grid-template-columns: 1fr;
text-align: center;
}
}
.mt-guarantee__eyebrow {
margin: 0 0 6px;
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 12.5px;
letter-spacing: 0.05em;
text-transform: uppercase;
/* impeccable F2 (2026-09-19): a success #50ad55 az #ecf6ed tinten 2,55:1 —
12,5px-es NAGYBETŰS szövegen ez WCAG AA bukás. A --mt-green-ink mérve 4,63:1.
VISSZAVONÁS: color: var(--wp--preset--color--success) + Version vissza. */
color: var(--mt-green-ink);
}
/* (0,2,1): kiegyenlíti az 1369-es prózai h2:not(:first-child) 45px-ét — később jön, ő nyer. */
.wp-block-post-content h2.mt-guarantee__title {
margin: 0 0 12px;
font-size: 22px;
line-height: 1.25;
color: var(--wp--preset--color--heading);
}
.mt-guarantee__promise {
margin: 0;
font-size: 15.5px;
line-height: 1.6;
color: var(--wp--preset--color--heading);
}
.mt-guarantee__promise strong {
font-weight: 600;
}
.mt-guarantee__media {
margin: 0;
text-align: center;
}
.mt-guarantee__media img {
width: 160px;
height: auto;
box-shadow: none;
border-radius: 0;
}
.mt-guarantee__media figcaption {
margin-top: 8px;
font-size: 12.5px;
color: var(--mt-gray-muted);
}
@media (max-width: 640px) {
.mt-guarantee__media img {
width: 130px;
}
}
/* Tartalmi CTA gombok. */
.mt-garancia-cta {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 30px;
}
.mt-btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 13px 24px;
border-radius: var(--mt-radius-sm);
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 15px;
text-decoration: none;
transition: background var(--mt-dur-fast) var(--mt-ease),
border-color var(--mt-dur-fast) var(--mt-ease),
transform var(--mt-dur-fast) var(--mt-ease);
}
.mt-btn--primary {
background: var(--wp--preset--color--primary);
color: var(--wp--preset--color--base);
}
.mt-btn--primary:hover,
.mt-btn--primary:focus {
background: var(--wp--preset--color--accent);
transform: translateY(-1px);
}
.mt-btn--ghost {
background: transparent;
border: 1px solid var(--wp--preset--color--border);
color: var(--wp--preset--color--heading);
}
.mt-btn--ghost:hover,
.mt-btn--ghost:focus {
border-color: var(--wp--preset--color--primary);
color: var(--wp--preset--color--primary);
}
/* Post-content-re szabott középre igazítás (videó szekció). */
.wp-block-post-content .mt-center {
text-align: center;
}
.mt-legal-section p {
margin: 0 0 12px;
font-size: 15px;
line-height: 1.62;
color: var(--wp--preset--color--body);
}
.mt-legal-section ul {
margin: 0 0 12px;
padding-left: 22px;
}
.mt-legal-section li {
font-size: 15px;
line-height: 1.6;
}
/* ── Rólunk-sáv csapatfotó (front-page FounderStory, about mockup) ── */
.mt-team-img {
border-radius: var(--mt-radius-md);
overflow: hidden;
box-shadow: var(--mt-shadow-md);
}
.mt-team-img img {
display: block;
width: 100%;
height: auto;
border-radius: var(--mt-radius-md);
}
/* ── Fejléc keresőgomb (parancssáv-kioldó) ─────────────────────── */
.mt-search-trigger {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 9px 12px;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--muted);
font-family: var(--wp--preset--font-family--heading);
font-weight: 500;
font-size: 14px;
line-height: 1;
text-decoration: none;
cursor: pointer;
transition: border-color var(--mt-dur-fast) var(--mt-ease),
color var(--mt-dur-fast) var(--mt-ease),
background var(--mt-dur-fast) var(--mt-ease);
}
.mt-search-trigger:hover,
.mt-search-trigger:focus-visible {
border-color: var(--wp--preset--color--primary);
color: var(--wp--preset--color--primary);
background: var(--mt-blue-tint);
}
.mt-search-trigger__icon {
width: 18px;
height: 18px;
flex: none;
}
.mt-search-trigger__label {
color: var(--wp--preset--color--heading);
transition: color var(--mt-dur-fast) var(--mt-ease);
}
.mt-search-trigger:hover .mt-search-trigger__label,
.mt-search-trigger:focus-visible .mt-search-trigger__label {
color: var(--wp--preset--color--primary);
}
.mt-search-trigger__kbd {
display: inline-flex;
align-items: center;
gap: 2px;
padding: 3px 7px;
border: 1px solid var(--wp--preset--color--border);
border-radius: 6px;
background: var(--wp--preset--color--section);
color: var(--mt-gray-muted);
font-family: var(--wp--preset--font-family--heading);
font-size: 11px;
font-weight: 600;
line-height: 1;
}
.mt-search-trigger__cmd {
font-size: 12px;
}
/* Szűk nézet: csak az ikon marad (a mobil-navigáció mellett is elfér). */
@media (max-width: 860px) {
.mt-search-trigger__label,
.mt-search-trigger__kbd {
display: none;
}
.mt-search-trigger {
padding: 9px;
}
}
/* Laptop-sáv (861–1023px): csak a ⌘K-billentyűjelzés tűnik el — a „Keresés"
címke marad (azt 860px-ig visszük). A jelzés ~44px-t ad vissza, hogy a
hosszabb nyelvi címkék (pl. a RO fiók-szöveg „Contul meu / Autentificare /
Înregistrare") ne lökjék a fejléc jobb csoportját második sorba. */
@media (max-width: 1023px) {
.mt-header .mt-search-trigger__kbd {
display: none;
}
}
/* ── Fejléc fiók-menü (Fiókom · Belépés / Regisztráció) ────────── */
.mt-account {
position: relative;
}
.mt-account__trigger {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 6px 10px;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--base);
line-height: 1;
cursor: pointer;
transition: border-color var(--mt-dur-fast) var(--mt-ease),
background var(--mt-dur-fast) var(--mt-ease),
transform var(--mt-dur-fast) var(--mt-ease);
}
.mt-account__trigger:hover,
.mt-account__trigger:focus-visible,
.mt-account.is-open .mt-account__trigger {
border-color: var(--wp--preset--color--primary);
background: var(--mt-blue-tint);
}
/* Kattintás-visszajelzés: apró benyomódás a triggeren. */
.mt-account__trigger:active {
transform: scale(0.97);
}
.mt-account__avatar {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
flex: none;
border-radius: var(--mt-radius-sm);
background: var(--mt-blue-tint);
color: var(--wp--preset--color--primary);
transition: background var(--mt-dur-fast) var(--mt-ease),
color var(--mt-dur-fast) var(--mt-ease);
}
.mt-account__avatar svg {
width: 18px;
height: 18px;
}
.mt-account__trigger:hover .mt-account__avatar,
.mt-account.is-open .mt-account__avatar {
background: var(--wp--preset--color--primary);
color: var(--wp--preset--color--base);
}
.mt-account__text {
display: flex;
flex-direction: column;
gap: 2px;
text-align: left;
}
.mt-account__title {
font-family: var(--wp--preset--font-family--heading);
font-size: 13.5px;
font-weight: 600;
color: var(--wp--preset--color--heading);
}
.mt-account__sub {
font-family: var(--wp--preset--font-family--heading);
font-size: 11px;
font-weight: 500;
color: var(--wp--preset--color--muted);
}
.mt-account__caret {
width: 14px;
height: 14px;
flex: none;
color: var(--wp--preset--color--muted);
transition: transform var(--mt-dur-base) var(--mt-ease);
}
.mt-account.is-open .mt-account__caret {
transform: rotate(180deg);
}
/* Legördülő réteg — fehér kártya, lágy árnyék, márka-tokenek. */
.mt-account__menu {
position: absolute;
top: calc(100% + 8px);
right: 0;
z-index: 30;
min-width: 210px;
padding: 6px;
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-md);
transform-origin: top right;
}
.mt-account__menu:not([hidden]) {
animation: mt-account-in var(--mt-dur-base) var(--mt-ease);
}
@keyframes mt-account-in {
from { opacity: 0; transform: translateY(-8px) scale(0.96); }
to { opacity: 1; transform: none; }
}
/* A két menüpont enyhén léptetve úszik be (kaszkád) a réteg nyílásakor. */
.mt-account.is-open .mt-account__item {
animation: mt-account-item-in var(--mt-dur-base) var(--mt-ease) backwards;
}
.mt-account.is-open .mt-account__item:nth-child(1) { animation-delay: 60ms; }
.mt-account.is-open .mt-account__item:nth-child(2) { animation-delay: 120ms; }
@keyframes mt-account-item-in {
from { opacity: 0; transform: translateX(-6px); }
to { opacity: 1; transform: none; }
}
.mt-account__item {
display: flex;
align-items: center;
gap: 10px;
padding: 9px 12px;
border-radius: var(--mt-radius-sm);
font-family: var(--wp--preset--font-family--heading);
font-size: 14px;
font-weight: 500;
color: var(--wp--preset--color--heading);
text-decoration: none;
transition: background var(--mt-dur-fast) var(--mt-ease), color var(--mt-dur-fast) var(--mt-ease);
}
.mt-account__item svg {
width: 17px;
height: 17px;
flex: none;
color: var(--wp--preset--color--primary);
}
.mt-account__item:hover,
.mt-account__item:focus-visible {
background: var(--mt-blue-tint);
color: var(--wp--preset--color--primary);
}
/* Szűk nézet: csak az avatar-ikon marad (mint a keresőgombnál). */
@media (max-width: 860px) {
.mt-account__text,
.mt-account__caret {
display: none;
}
.mt-account__trigger {
padding: 5px;
}
}
@media (prefers-reduced-motion: reduce) {
.mt-account__caret {
transition: none;
}
.mt-account__menu:not([hidden]),
.mt-account.is-open .mt-account__item {
animation: none;
}
.mt-account__trigger:active {
transform: none;
}
}
/* ── Fejléc nyelvválasztó (Polylang navigation-language-switcher) ─
A blokk lapos -listát ad (aktuális nyelv + 4 másik); a header.html
melletti script az aktuálisat triggerré, a többit .mt-lang__menu
legördülő panellé alakítja — a Fiókom-widget mintájára. */
.mt-lang {
position: relative;
display: inline-flex;
align-items: center;
list-style: none;
margin: 0;
padding: 0;
}
.mt-lang .lang-item {
margin: 0;
}
.mt-lang .lang-item.current-lang > a {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 6px 10px;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--heading);
font-family: var(--wp--preset--font-family--heading);
font-size: 13.5px;
font-weight: 600;
line-height: 1;
text-decoration: none;
cursor: pointer;
transition: border-color var(--mt-dur-fast) var(--mt-ease),
background var(--mt-dur-fast) var(--mt-ease),
transform var(--mt-dur-fast) var(--mt-ease);
}
.mt-lang .lang-item.current-lang > a:hover,
.mt-lang .lang-item.current-lang > a:focus-visible,
.mt-lang.is-open .lang-item.current-lang > a {
border-color: var(--wp--preset--color--primary);
background: var(--mt-blue-tint);
}
.mt-lang .lang-item.current-lang > a:active {
transform: scale(0.97);
}
.mt-lang .lang-item img {
display: block;
width: 18px;
height: 13px;
flex: none;
border-radius: 2px;
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
}
/* Nyílgomb a trigger jobb szélén (a Fiókom-caret mintájára, saját SVG nélkül). */
.mt-lang .lang-item.current-lang > a::after {
content: "";
width: 7px;
height: 7px;
margin-left: 2px;
flex: none;
border-right: 1.5px solid var(--wp--preset--color--muted);
border-bottom: 1.5px solid var(--wp--preset--color--muted);
transform: rotate(45deg);
transition: transform var(--mt-dur-base) var(--mt-ease);
}
.mt-lang.is-open .lang-item.current-lang > a::after {
transform: rotate(225deg);
}
/* Szűk nézet: a nyelvváltó TRIGGERE csak a zászlót + nyilat mutatja (a kereső/
fiók ikonná-esésének mintájára, :2754 / :2929). A show_names miatt a Polylang a
nyelvnevet külön -be teszi → azt rejtjük, a zászló-![]()
és a ::after nyíl
marad. A LEGÖRDÜLŐ nyelvnevei (.lang-item:not(.current-lang)) érintetlenek.
Indok: a nyelvváltó ~115px-t adott a fejléc jobb csoportjához, amitől az ~620px
alatt MÁSODIK SORBA tört (logó + Menü | nyelv + kereső + fiók nem fért ki). */
@media (max-width: 640px) {
.mt-header .mt-lang .lang-item.current-lang > a > span {
display: none;
}
/* Zászló + nyíl KÖZÉPRE zárva, DOBOZ NÉLKÜL: a keret + háttér (a „blob") lekerül,
csak a zászló + nyíl marad (44px tapp-magasság a :6187 min-height-ből, átlátszó).
A hover/focus/nyitott állapot kékes dobozát is semlegesítjük (lásd :2989). */
.mt-header .mt-lang .lang-item.current-lang > a,
.mt-header .mt-lang .lang-item.current-lang > a:hover,
.mt-header .mt-lang .lang-item.current-lang > a:focus-visible,
.mt-header .mt-lang.is-open .lang-item.current-lang > a {
gap: 4px;
justify-content: center;
padding-left: 6px;
padding-right: 6px;
border-color: transparent;
background: transparent;
}
/* Nagyobb zászló, hogy a 44px-es gombot kitöltse (a kereső/fiók 18px-es
ikonjának súlyához illően) — a beégetett inline `width:16px`-et üti. 22px:
arányos, de a sávot 360px-en sem tolja második sorba. */
.mt-header .mt-lang .lang-item.current-lang > a img {
width: 22px !important;
height: 15px !important;
}
}
/* A legszűkebb telefonokon (~≤420px) a zászló-only nyelvváltó SEM elég: a logót és
a fejléc-hézagokat is szűkítjük, hogy mind az öt elem egy sorban maradjon (~16px
tartaléktér 375px-en). A 44px-es érintőcélok (kereső/fiók, :2760 / :2935)
SÉRTHETETLENEK — ezért a helyet a logóból és a hézagokból nyerjük vissza. */
@media (max-width: 420px) {
/* A fejléc oldalsó globális paddingja 20px → 14px: ~12px hasznos szélességet
ad vissza a sávnak (360px-es androidokon ennyi hiányzott), a logó
olvashatóságának feláldozása nélkül. Csak a fejlécre, a törzs paddingja marad. */
.mt-header {
padding-left: 14px;
padding-right: 14px;
}
.mt-header > .wp-block-group,
.mt-header > .wp-block-group > div {
column-gap: 4px;
}
.mt-header .wp-block-site-logo {
width: 96px;
}
}
/* Legördülő réteg — fehér kártya, lágy árnyék, márka-tokenek (mt-account__menu-val azonos idióma). */
.mt-lang__menu {
position: absolute;
top: calc(100% + 8px);
/* JOBBRA horgonyzott: a nyelvváltó a fejléc jobb csoportjában ül (kereső/fiók
előtt), így a `left:0` a 180px-es panelt jobbra, a képernyőről KILÓGATTA
(mobilon a jobb szél alá). A `right:0` a triggerhez képest balra nyílik →
minden szélességen a nézeten belül marad (mint a .mt-account__menu). */
right: 0;
left: auto;
z-index: 30;
min-width: 180px;
padding: 6px;
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-md);
transform-origin: top right;
}
.mt-lang__menu:not([hidden]) {
animation: mt-account-in var(--mt-dur-base) var(--mt-ease);
}
.mt-lang__menu .lang-item {
list-style: none;
}
.mt-lang__menu .lang-item + .lang-item {
margin-top: 2px;
}
.mt-lang__menu .lang-item a {
display: flex;
align-items: center;
gap: 10px;
padding: 9px 12px;
border-radius: var(--mt-radius-sm);
font-family: var(--wp--preset--font-family--heading);
font-size: 14px;
font-weight: 500;
color: var(--wp--preset--color--heading);
text-decoration: none;
transition: background var(--mt-dur-fast) var(--mt-ease), color var(--mt-dur-fast) var(--mt-ease);
}
.mt-lang__menu .lang-item a:hover,
.mt-lang__menu .lang-item a:focus-visible {
background: var(--mt-blue-tint);
color: var(--wp--preset--color--primary);
}
/* Szűk nézet: a trigger csak zászlót mutat (mint a fiók-gomb csak avatart). */
@media (max-width: 860px) {
.mt-lang .lang-item.current-lang > a {
padding: 5px 7px;
}
}
@media (prefers-reduced-motion: reduce) {
.mt-lang .lang-item.current-lang > a::after,
.mt-lang .lang-item.current-lang > a:active {
transition: none;
transform: none;
}
.mt-lang__menu:not([hidden]) {
animation: none;
}
}
/* ── Kereső réteg (parancssáv / command palette) ───────────────── */
.mt-search {
position: fixed;
inset: 0;
z-index: var(--mt-z-search);
display: flex;
justify-content: center;
align-items: flex-start;
padding: clamp(56px, 12vh, 140px) 16px 24px;
background: rgba(31, 42, 56, 0.55);
-webkit-backdrop-filter: blur(3px);
backdrop-filter: blur(3px);
opacity: 0;
transition: opacity var(--mt-dur-base) var(--mt-ease);
}
.mt-search.is-open {
opacity: 1;
}
.mt-search[hidden] {
display: none;
}
.mt-search__backdrop {
position: absolute;
inset: 0;
cursor: default;
}
.mt-search__panel {
position: relative;
z-index: 1;
width: 100%;
max-width: 620px;
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-md);
overflow: hidden;
/* Nyitás: a legördülő menü látványos beúszásához igazítva (2.2.54) —
nagyobb skálázás + csúszás, hosszabb idő, hogy jól látható legyen. */
transform: translateY(-16px) scale(0.9);
transition: transform var(--mt-dur-slow) var(--mt-ease);
}
.mt-search.is-open .mt-search__panel {
transform: none;
}
/* Keresőmező sor. */
.mt-search__box {
display: flex;
align-items: center;
gap: 12px;
padding: 15px 18px;
border-bottom: 1px solid var(--wp--preset--color--border);
}
.mt-search__box-icon {
width: 20px;
height: 20px;
flex: none;
color: var(--wp--preset--color--primary);
}
.mt-search__input {
flex: 1;
min-width: 0;
border: none;
outline: none;
background: transparent;
padding: 4px 0;
font-family: var(--wp--preset--font-family--body);
font-size: 17px;
color: var(--wp--preset--color--body);
}
.mt-search__input::placeholder {
color: var(--mt-gray-muted);
}
.mt-search__esc {
flex: none;
padding: 3px 8px;
border: 1px solid var(--wp--preset--color--border);
border-radius: 6px;
background: var(--wp--preset--color--section);
color: var(--mt-gray-muted);
font-family: var(--wp--preset--font-family--heading);
font-size: 10.5px;
font-weight: 600;
letter-spacing: 0.04em;
}
/* Állapotsor (aria-live). */
.mt-search__status {
padding: 9px 18px;
font-size: 12.5px;
color: var(--wp--preset--color--muted);
background: var(--wp--preset--color--section);
border-bottom: 1px solid var(--wp--preset--color--border);
}
.mt-search__status:empty {
display: none;
}
/* Találati lista. */
.mt-search__list {
list-style: none;
margin: 0;
padding: 6px;
max-height: min(52vh, 440px);
overflow-y: auto;
overscroll-behavior: contain;
}
.mt-search__opt {
margin: 0;
}
.mt-search__opt > a {
display: flex;
align-items: center;
gap: 13px;
padding: 11px 12px;
border-radius: var(--mt-radius-sm);
text-decoration: none;
color: var(--wp--preset--color--body);
}
.mt-search__opt.is-active > a {
background: var(--mt-blue-tint);
}
.mt-search__opt-icon {
flex: none;
width: 34px;
height: 34px;
display: grid;
place-items: center;
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--section);
color: var(--wp--preset--color--muted);
}
.mt-search__opt.is-active .mt-search__opt-icon {
background: var(--wp--preset--color--primary);
color: var(--wp--preset--color--base);
}
.mt-search__opt-icon svg {
width: 18px;
height: 18px;
}
.mt-search__opt-main {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
gap: 2px;
}
.mt-search__opt-title {
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 14.5px;
line-height: 1.3;
color: var(--wp--preset--color--heading);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.mt-search__opt-title mark {
background: transparent;
color: var(--wp--preset--color--primary);
font-weight: 700;
}
.mt-search__opt-url {
font-size: 12px;
color: var(--mt-gray-muted);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.mt-search__opt-type {
flex: none;
padding: 3px 9px;
border-radius: var(--mt-radius-pill);
background: var(--wp--preset--color--section);
border: 1px solid var(--wp--preset--color--border);
color: var(--wp--preset--color--muted);
font-family: var(--wp--preset--font-family--heading);
font-size: 11px;
font-weight: 600;
line-height: 1.5;
letter-spacing: 0.02em;
}
.mt-search__opt-type.is-post {
background: var(--mt-blue-tint);
border-color: transparent;
color: var(--wp--preset--color--primary);
}
/* „Összes találat" sor. */
.mt-search__all {
margin-top: 4px;
border-top: 1px solid var(--wp--preset--color--border);
padding-top: 4px;
}
.mt-search__all .mt-search__opt-title {
font-weight: 500;
color: var(--wp--preset--color--body);
white-space: normal;
}
.mt-search__all .mt-search__opt-title strong {
color: var(--wp--preset--color--heading);
font-weight: 700;
}
/* Görgetészár, ha réteg nyitva van. Komponensenként saját osztály (kereső /
* lightbox), mert a paletta a lightbox fölé is nyílhat — közös osztálynál az
* egyik zárása feloldaná a másik zárját. */
.mt-search-lock,
.mt-lightbox-lock {
overflow: hidden;
}
@media (max-width: 600px) {
.mt-search {
padding-top: 8px;
padding-left: 8px;
padding-right: 8px;
}
.mt-search__panel {
max-width: none;
}
.mt-search__esc {
display: none;
}
}
@media (prefers-reduced-motion: reduce) {
.mt-search,
.mt-search__panel {
transition: none;
}
.mt-search__panel {
transform: none;
}
}
/* ── Információs oldalak: táblázatok + kártyák (szállítás, árukiadás) ─ */
/* Táblázat-burkoló: lekerekített, vízszintesen görgethető szűk kijelzőn. */
.mt-table-wrap {
overflow-x: auto;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-sm);
-webkit-overflow-scrolling: touch;
}
.mt-table {
width: 100%;
border-collapse: collapse;
font-size: 14.5px;
}
.mt-table th,
.mt-table td {
padding: 11px 15px;
border: 1px solid var(--wp--preset--color--border);
text-align: left;
vertical-align: middle;
}
.mt-table thead th {
background: var(--wp--preset--color--heading);
color: var(--wp--preset--color--base);
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
white-space: nowrap;
}
.mt-table tbody tr:nth-child(even) {
background: var(--wp--preset--color--section);
}
/* Örökölt szürke fej-/címkecellák (árukiadás mátrix) → márkás felület. */
.mt-table--matrix td[style*="EEE"] {
background: var(--wp--preset--color--section) !important;
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
color: var(--wp--preset--color--heading);
}
.mt-table--matrix td {
font-size: 13.5px;
line-height: 1.4;
}
.mt-table--matrix p {
margin: 0 0 4px;
font-size: 13.5px;
}
.mt-table--matrix p:last-child {
margin-bottom: 0;
}
/* Ár-táblázatok: jobbra zárt díjoszlop. */
.mt-table--price td:last-child,
.mt-table--price th:last-child {
text-align: right;
font-variant-numeric: tabular-nums;
}
/* Két ár-táblázat egymás mellett. */
.mt-price-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 22px;
align-items: start;
margin-bottom: 6px;
}
@media (max-width: 720px) {
.mt-price-grid {
grid-template-columns: 1fr;
}
}
.mt-price-card > h2 {
margin: 0 0 2px;
font-size: 18px;
}
.mt-price-card__sub {
margin: 0 0 12px;
font-size: 13px;
color: var(--mt-gray-muted);
}
/* Táblázat-jelmagyarázat. */
.mt-table-legend {
margin: 2px 0 6px;
font-size: 13px;
line-height: 1.7;
color: var(--mt-gray-muted);
}
/* Árukiadás mátrix-tábla mobil kártya-változata (a facade szúrja be a
jelmagyarázat elé — functions.php menet_trend_arukiadasi_cards). Asztali
nézetben rejtve; ≤720px alatt (ahol az .mt-info-2col és .mt-price-grid is
egy hasábra vált) a kártyák veszik át a görgethető táblázat helyét. */
.mt-arukiadasi-cards {
display: none;
}
@media (max-width: 720px) {
body.mt-slug-arukiadasi-informaciok .mt-table-wrap {
display: none;
}
.mt-arukiadasi-cards {
display: grid;
gap: 14px;
margin-bottom: 10px;
}
.mt-aru-card {
padding: 16px 18px;
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-sm);
}
.mt-aru-card > h3 {
margin: 0 0 10px;
padding-bottom: 8px;
border-bottom: 1px solid var(--wp--preset--color--border);
font-size: 15px;
color: var(--wp--preset--color--heading);
}
.mt-aru-card dl {
margin: 0;
}
.mt-aru-card__row {
display: grid;
grid-template-columns: minmax(0, 42%) minmax(0, 1fr);
gap: 10px;
padding: 6px 0;
}
.mt-aru-card__row + .mt-aru-card__row {
border-top: 1px solid var(--wp--preset--color--section);
}
.mt-aru-card__row dt {
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 12.5px;
line-height: 1.45;
color: var(--mt-gray-muted);
}
.mt-aru-card__row dd {
margin: 0;
font-size: 14px;
line-height: 1.45;
color: var(--wp--preset--color--body);
}
.mt-aru-card__note {
margin: -4px 0 8px;
font-size: 12.5px;
color: var(--mt-gray-muted);
}
/* Csillag-lábjegyzet linkek: a * ** *** a jelmagyarázatra, a
nyitvatartás-csillagok a nyitvatartás-kártyára ugranak. */
.mt-aru-fn {
padding: 2px 3px;
font-weight: 700;
text-decoration: none;
color: var(--wp--preset--color--primary);
}
}
/* A csillag-célpontok ne csússzanak a ragadós fejléc alá, és odaugráskor
villanjanak fel finoman (:target — a facade adja az id-kat). */
#mt-aru-legend,
#mt-aru-hours,
#mt-aru-fn-1,
#mt-aru-fn-2,
#mt-aru-fn-3 {
scroll-margin-top: 96px;
}
/* :target = JS nélküli tartalék; .mt-aru-flash = a kártya-script által
újra-indíthatóan rátett osztály (ismételt koppintásra is villan). */
#mt-aru-hours:target,
#mt-aru-fn-1:target,
#mt-aru-fn-2:target,
#mt-aru-fn-3:target,
.mt-aru-flash {
animation: mt-aru-flash 0.8s var(--mt-ease) 2;
}
@keyframes mt-aru-flash {
50% {
background-color: var(--mt-blue-tint);
}
}
@media (prefers-reduced-motion: reduce) {
#mt-aru-hours:target,
#mt-aru-fn-1:target,
#mt-aru-fn-2:target,
#mt-aru-fn-3:target,
.mt-aru-flash {
animation: none;
}
}
/* Akció-jelvény — design-rendszer Badge, sale tón (Signal Red).
Solid = hero/kiemelt státusz; --soft = táblázatcella (piros tint felület). */
.mt-badge-sale {
display: inline-block;
padding: 4px 11px;
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--cta);
color: var(--wp--preset--color--base);
font-family: var(--wp--preset--font-family--heading);
font-size: 13px;
font-weight: 600;
letter-spacing: 0.05em;
line-height: 1.4;
text-transform: uppercase;
vertical-align: middle;
}
.mt-badge-sale--soft {
padding: 3px 9px;
background: var(--mt-red-tint);
color: var(--wp--preset--color--cta);
}
/* Kiárusítás: térköz az ártáblázat-kártya és a feltétel-kártya között
(egy wp:html blokkon belül ülnek, a blockGap nem hat rájuk). */
.mt-sale .mt-info-card {
margin-top: 28px;
}
/* ── Űrlapok (Journal3-ból migrált ajánlatkérő / vélemény formok) ──── */
.mt-form-card {
max-width: 640px;
padding: 26px 28px 30px;
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-sm);
}
.mt-form {
display: grid;
gap: 18px;
margin: 0;
}
.mt-field {
display: block;
}
.mt-field__label {
display: block;
margin-bottom: 6px;
padding: 0;
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 13.5px;
color: var(--wp--preset--color--heading);
}
.mt-field input,
.mt-field textarea {
width: 100%;
box-sizing: border-box;
padding: 11px 13px;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--base);
font: inherit;
font-size: 15px;
line-height: 1.4;
color: var(--wp--preset--color--body);
transition: border-color var(--mt-dur-fast) var(--mt-ease),
box-shadow var(--mt-dur-fast) var(--mt-ease);
}
.mt-field input:focus,
.mt-field textarea:focus {
outline: none;
border-color: var(--wp--preset--color--primary);
box-shadow: 0 0 0 3px var(--mt-blue-tint);
}
/* Átméretező fogantyú ki: szabad resize széttörheti az űrlapkártyát. */
.mt-field textarea {
resize: none;
}
/* Kártya-cím (Journal3 module-title). */
h2.mt-form-card__title {
margin: 0 0 18px;
font-size: 20px;
color: var(--wp--preset--color--heading);
}
/* Legördülő — design-rendszer Select: input-megjelenés + saját nyíl
(a data-URI-ban a nyíl színe a slate token értéke, #37485e — CSS-változó
URL-ben nem használható). */
.mt-field select {
width: 100%;
box-sizing: border-box;
padding: 11px 38px 11px 13px;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--base)
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2337485e' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E")
right 12px center / 16px no-repeat;
font: inherit;
font-size: 15px;
line-height: 1.4;
color: var(--wp--preset--color--body);
appearance: none;
-webkit-appearance: none;
cursor: pointer;
transition: border-color var(--mt-dur-fast) var(--mt-ease),
box-shadow var(--mt-dur-fast) var(--mt-ease);
}
.mt-field select:focus {
outline: none;
border-color: var(--wp--preset--color--primary);
box-shadow: 0 0 0 3px var(--mt-blue-tint);
}
.mt-fieldset {
margin: 0;
padding: 0;
border: 0;
min-width: 0;
}
.mt-choice-row {
display: flex;
flex-wrap: wrap;
gap: 8px 20px;
}
.mt-choice {
display: inline-flex;
align-items: center;
gap: 8px;
font-size: 15px;
color: var(--wp--preset--color--body);
cursor: pointer;
}
/* Pipa-rajz + rádió-pont animáció (design-rendszer motion: 120/200ms,
ease-out, skálázó belépés — nincs pattogás). */
.mt-choice input {
appearance: none;
-webkit-appearance: none;
width: 18px;
height: 18px;
margin: 0;
flex: none;
display: grid;
place-items: center;
border: 1px solid var(--wp--preset--color--border);
border-radius: 4px;
background: var(--wp--preset--color--base);
cursor: pointer;
transition: background var(--mt-dur-fast) var(--mt-ease),
border-color var(--mt-dur-fast) var(--mt-ease);
}
.mt-choice input:checked {
background: var(--wp--preset--color--primary);
border-color: var(--wp--preset--color--primary);
}
.mt-choice input:focus-visible {
outline: 2px solid var(--wp--preset--color--primary);
outline-offset: 2px;
}
/* Pipa = beágyazott SVG (tökéletesen középre esik; a forgatott
border-L trükk 18px-en láthatóan félrecsúszott). */
.mt-choice input[type="checkbox"]::after {
content: "";
width: 11px;
height: 11px;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / contain no-repeat;
transform: scale(0);
transform-origin: center;
transition: transform var(--mt-dur-base) var(--mt-ease);
}
.mt-choice input[type="checkbox"]:checked::after {
transform: scale(1);
}
.mt-choice input[type="radio"] {
border-radius: 50%;
}
.mt-choice input[type="radio"]::after {
content: "";
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--wp--preset--color--base);
transform: scale(0);
transition: transform var(--mt-dur-base) var(--mt-ease);
}
.mt-choice input[type="radio"]:checked::after {
transform: scale(1);
}
/* GDPR-elfogadó sor: apróbetűs, felül igazított pipa. */
.mt-agree {
align-items: flex-start;
font-size: 13.5px;
line-height: 1.55;
color: var(--wp--preset--color--muted);
}
.mt-agree input {
margin-top: 2px;
}
.mt-form .mt-btn {
border: 0;
cursor: pointer;
justify-self: start;
}
/* Sokmezős űrlap: rövid szöveges mezők két hasábban. */
.mt-form-cols {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 18px 16px;
}
@media (max-width: 640px) {
.mt-form-cols {
grid-template-columns: 1fr;
}
}
/* Fájlmező (natív file input, szaggatott keret). */
.mt-field--file input[type="file"] {
padding: 10px 12px;
border-style: dashed;
cursor: pointer;
}
.mt-field input[type="file"]::file-selector-button {
margin-right: 12px;
padding: 7px 14px;
border: 0;
border-radius: var(--mt-radius-sm);
background: var(--wp--preset--color--primary);
color: var(--wp--preset--color--base);
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 13.5px;
cursor: pointer;
}
/* Mézesbödön spam-csapda (mt_form kezelő injektálja, MT-MED-003) —
vizuálisan rejtett, de a botok számára kitölthető marad. */
.mt-hp {
position: absolute !important;
width: 1px;
height: 1px;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
}
/* Beküldés utáni státusz-értesítő (?mt-form=… visszairányítás). */
.mt-form-notice {
max-width: 640px;
box-sizing: border-box;
margin: 0 0 18px;
padding: 14px 18px;
border-radius: var(--mt-radius-sm);
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 15px;
color: var(--wp--preset--color--heading);
scroll-margin-top: 90px; /* a #mt-form-notice horgony ne fusson a ragadós fejléc alá */
}
.mt-form-notice--ok {
background: var(--mt-green-tint);
border: 1px solid var(--mt-green-tint-border);
border-left: 4px solid var(--wp--preset--color--success);
}
.mt-form-notice--err {
background: var(--mt-red-tint);
border: 1px solid var(--mt-red-tint-border);
border-left: 4px solid var(--wp--preset--color--cta);
}
/* Termékleírás-szekció: próza + ragadós termékkép (űrlapoldalak). */
.mt-desc-grid {
display: grid;
grid-template-columns: minmax(0, 1fr) 300px;
gap: 30px;
align-items: start;
margin-bottom: 30px;
}
.mt-desc-prose h2 {
margin: 0 0 14px;
font-size: 22px;
color: var(--wp--preset--color--heading);
}
.mt-desc-prose p {
margin: 0 0 13px;
font-size: 15px;
line-height: 1.62;
color: var(--wp--preset--color--body);
}
.mt-desc-prose p:last-child {
margin-bottom: 0;
}
.mt-desc-aside {
position: sticky;
top: 90px;
}
/* Ugyanaz az admin-sáv korrekció, mint a .mt-legal-toc-nál. Ez az oldalsáv
819px felett ragadós, ott az admin-sáv mindig 32px. */
body.admin-bar .mt-desc-aside {
top: 122px;
}
.mt-desc-aside img {
display: block;
width: 100%;
height: auto;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
}
@media (max-width: 819px) {
.mt-desc-grid {
grid-template-columns: 1fr;
}
.mt-desc-aside {
position: static;
max-width: 340px;
}
}
/* Info-kártya (tudnivalók, listák). */
.mt-info-card {
padding: 22px 24px;
background: var(--wp--preset--color--section);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
}
.mt-info-card > h3 {
margin: 0 0 12px;
font-size: 16px;
color: var(--wp--preset--color--heading);
}
.mt-info-card ul {
margin: 0;
padding-left: 20px;
}
.mt-info-card li {
margin-bottom: 7px;
font-size: 15px;
line-height: 1.55;
}
.mt-info-card li:last-child {
margin-bottom: 0;
}
/* Nyitvatartás + figyelmeztetés két hasábban. */
.mt-info-2col {
display: grid;
grid-template-columns: 260px minmax(0, 1fr);
gap: 20px;
align-items: stretch;
}
@media (max-width: 720px) {
.mt-info-2col {
grid-template-columns: 1fr;
}
}
.mt-hours-card {
padding: 20px 22px;
}
.mt-hours-card h3 {
margin: 0 0 8px;
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 15px;
color: var(--wp--preset--color--heading);
}
.mt-hours-card p {
margin: 0;
font-size: 15px;
line-height: 1.7;
color: var(--wp--preset--color--body);
}
/* Figyelmeztető változat (sárga léc). */
.mt-legal-notice--warn {
margin: 0;
background: var(--mt-warn-tint);
border-color: var(--mt-warn-border);
border-left-color: var(--mt-warn-accent);
}
.mt-legal-notice--warn .mt-legal-notice__icon {
color: var(--mt-warn-icon);
}
/* A rács `stretch`-eli a figyelmeztetőt a nyitvatartás-kártya magasságára, a sáv
viszont `align-items: flex-start` — így a rövidebb szöveg alatt üres sáv maradt
(1920px-en ~81px, mindhárom nyelven). A szöveg marad felül; a doboz zsugorodik
a tartalmához, így nincs üres sáv alatta. Csak a figyelmeztetőre — a
nyitvatartás-kártya stretch-e (a rács magasabb eleme) érintetlen. */
.mt-info-2col .mt-legal-notice {
align-self: start;
}
/* Érvényességi láb-megjegyzés. */
.mt-valid-note {
margin-top: 6px;
font-size: 13.5px;
color: var(--mt-gray-muted);
}
/* ── Katalógusok (page-katalogusaink + márka-katalógus oldalak) ─────── */
/* Belépés-mögötti katalógusok borító-kártyarácsa (portré 600×850 borítók). */
.mt-catalog-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 22px;
margin: 6px 0 0;
}
@media (max-width: 1023px) {
.mt-catalog-grid {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 640px) {
.mt-catalog-grid {
grid-template-columns: repeat(2, 1fr);
}
}
/* Nem kattintható statikus borítók (a webshop-linket az owner eltávolította). */
.mt-catalog-card {
display: flex;
margin: 0;
}
.mt-catalog-card img {
width: 100%;
height: auto;
aspect-ratio: 600 / 850;
object-fit: cover;
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-sm);
}
/* Egy-borítós márka-katalógus oldal (page-hikoki/metabo/szerszam): központosított kártya. */
.mt-catalog-grid--single {
grid-template-columns: minmax(0, 260px);
justify-content: center;
}
/* ── Karrier (page-karrier hub + állás oldalak) ───────────────────── */
/* Nyitott pozíciók kártyarácsa a hubon. A kártyák KATTINTHATÓK — belső
navigáció a valós helyi állás-oldalakra (nem a webshop-redirect). */
.mt-career-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 22px;
margin: 6px 0 0;
}
@media (max-width: 640px) {
.mt-career-grid {
grid-template-columns: 1fr;
}
}
.mt-career-card {
display: flex;
flex-direction: column;
overflow: hidden;
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-sm);
text-decoration: none;
transition: transform var(--mt-dur-base) var(--mt-ease),
box-shadow var(--mt-dur-base) var(--mt-ease);
}
.mt-career-card:hover,
.mt-career-card:focus-visible {
transform: translateY(-3px);
box-shadow: var(--mt-shadow-hover);
}
.mt-career-card__media {
display: block;
aspect-ratio: 600 / 400;
overflow: hidden;
}
.mt-career-card__media img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform var(--mt-dur-slow) var(--mt-ease);
}
.mt-career-card:hover .mt-career-card__media img {
transform: scale(1.04);
}
.mt-career-card__body {
display: flex;
flex-direction: column;
gap: 6px;
padding: 20px 52px 22px 22px;
position: relative;
}
.mt-career-card__eyebrow {
font-family: var(--wp--preset--font-family--heading);
font-size: 12px;
font-weight: 600;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--wp--preset--color--primary);
}
.mt-career-card__role {
font-family: var(--wp--preset--font-family--heading);
font-size: 20px;
font-weight: 700;
line-height: 1.25;
color: var(--wp--preset--color--heading);
}
.mt-career-card__arrow {
position: absolute;
right: 22px;
bottom: 22px;
font-size: 20px;
line-height: 1;
color: var(--wp--preset--color--primary);
transition: transform var(--mt-dur-base) var(--mt-ease);
}
.mt-career-card:hover .mt-career-card__arrow {
transform: translateX(4px);
}
/* Állás oldal (page-karrier-ertekesito / -raktarvezeto-helyettes). */
.mt-job {
display: flex;
flex-direction: column;
gap: 22px;
}
.mt-job-intro,
.mt-job-closing {
margin: 0;
font-size: 16px;
line-height: 1.7;
color: var(--wp--preset--color--body);
}
.mt-job-heading {
margin: 0 0 14px;
font-family: var(--wp--preset--font-family--heading);
font-size: 20px;
font-weight: 700;
line-height: 1.25;
color: var(--wp--preset--color--heading);
}
/* „Amit kínálunk" — zöld kiemelt kártya pipás listával (a forrás zöld + ikonjai). */
.mt-job-offer {
background: var(--mt-green-tint);
border: 1px solid var(--mt-green-tint-border); /* #cfe6d2 → d0-ra normalizálva (MT-INFO-011) */
border-radius: var(--mt-radius-md);
padding: 26px 28px;
box-shadow: var(--mt-shadow-sm);
}
.mt-job-list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 10px;
}
.mt-job-list li {
font-size: 15px;
line-height: 1.55;
color: var(--wp--preset--color--body);
}
.mt-job-list--check li {
display: flex;
align-items: flex-start;
gap: 10px;
}
.mt-job-check {
flex: 0 0 auto;
width: 18px;
height: 18px;
margin-top: 2px;
color: var(--wp--preset--color--success);
}
/* Nem-kínálunk szekciók (Feladatok / Elvárások / NEM elvárás) kártyarácsban. */
.mt-job-cols {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 18px;
}
.mt-job-card {
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
padding: 22px 24px;
box-shadow: var(--mt-shadow-sm);
}
.mt-job-card .mt-job-heading {
font-size: 17px;
margin-bottom: 12px;
}
.mt-job-card .mt-job-list li {
position: relative;
padding-left: 16px;
font-size: 14px;
}
.mt-job-card .mt-job-list li::before {
content: "";
position: absolute;
left: 0;
top: 9px;
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--wp--preset--color--primary);
}
.mt-job-cta {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 4px;
}
/* ── Hűségprogram (page-husegprogram + archívumok) ─────────────────── */
.mt-huseg {
display: flex;
flex-direction: column;
gap: 30px;
}
/* Külső márka-katalógus bélyegképek (kattintható, új lapon nyílnak). */
.mt-cat-links {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
gap: 18px;
}
.mt-cat-link {
display: block;
overflow: hidden;
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-sm);
transition: transform var(--mt-dur-base) var(--mt-ease),
box-shadow var(--mt-dur-base) var(--mt-ease);
}
.mt-cat-link:hover,
.mt-cat-link:focus-visible {
transform: translateY(-3px);
box-shadow: var(--mt-shadow-hover);
}
.mt-cat-link img {
display: block;
width: 100%;
height: auto;
}
/* Régebbi archívumok: szöveges katalógus-gombok (a.btn PDF linkek). */
.mt-cat-buttons {
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.mt-cat-btn {
align-items: center;
}
.mt-cat-btn__icon {
width: 17px;
height: 17px;
flex: none;
}
.mt-huseg-heading {
margin: 0 0 14px;
font-family: var(--wp--preset--font-family--heading);
font-size: 22px;
font-weight: 700;
line-height: 1.2;
color: var(--wp--preset--color--heading);
}
/* Szabályzat + kuponfüzet borító 2 oszlopban (a borító sticky aside). */
.mt-huseg-rules-grid {
display: grid;
grid-template-columns: 1fr 300px;
gap: 32px;
align-items: start;
}
@media (max-width: 782px) {
.mt-huseg-rules-grid {
grid-template-columns: 1fr;
}
}
.mt-huseg-rules__intro {
margin: 0 0 12px;
font-size: 15px;
color: var(--wp--preset--color--heading);
}
.mt-huseg-list {
margin: 0;
padding-left: 20px;
display: flex;
flex-direction: column;
gap: 4px;
}
.mt-huseg-list li {
font-size: 14.5px;
line-height: 1.5;
color: var(--wp--preset--color--body);
}
.mt-huseg-booklet {
margin: 0;
}
.mt-huseg-booklet img {
display: block;
width: 100%;
height: auto;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-md);
}
/* A borító alá helyezett kiegészítő szabálypontok — hogy a jobb oszlop
ne maradjon üresen, amikor lejjebb görgetünk. */
.mt-huseg-booklet .mt-huseg-list {
margin-top: 18px;
}
@media (max-width: 782px) {
.mt-huseg-booklet {
position: static;
max-width: 300px;
}
}
/* ── NONOX márka (page-mit-takar-a-nonox-markanev) ─────────────────── */
.mt-brand {
display: flex;
flex-direction: column;
gap: 24px;
}
.mt-brand > h2 {
margin: 8px 0 -6px;
font-size: 24px;
line-height: 1.3;
color: var(--wp--preset--color--heading);
}
.mt-brand > p {
margin: 0;
font-size: 15.5px;
line-height: 1.65;
color: var(--wp--preset--color--body);
}
/* Számozott jellemző-kártyák (Alapanyag / NONOX termékek).
align-items:start — a rövidebb kártya nem nyúlik meg a sor magasságára
(üres fehér tér volt az 1. kártya alján, tulaj kérte ki). */
.mt-brand-cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 18px;
align-items: start;
}
.mt-brand-card {
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
padding: 24px 26px;
box-shadow: var(--mt-shadow-sm);
}
.mt-brand-card > h3 {
display: flex;
align-items: center;
gap: 12px;
margin: 0 0 14px;
font-size: 17px;
color: var(--wp--preset--color--heading);
}
.mt-brand-list {
margin: 0;
padding: 0;
list-style: none;
}
.mt-brand-list li {
position: relative;
padding-left: 16px;
margin-bottom: 8px;
font-size: 14.5px;
line-height: 1.6;
color: var(--wp--preset--color--body);
}
.mt-brand-list > li:last-child {
margin-bottom: 0;
}
.mt-brand-list li::before {
content: "";
position: absolute;
left: 0;
top: 10px;
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--wp--preset--color--primary);
}
/* Beágyazott al-lista: üres (körvonalas) pötty. */
.mt-brand-list li ul {
margin: 8px 0 0;
padding: 0;
list-style: none;
}
.mt-brand-list li ul li::before {
background: transparent;
border: 1.5px solid var(--wp--preset--color--primary);
width: 5px;
height: 5px;
}
/* Záró NONOX logó középre, csupaszon — keretkártya NEM kell (tulaj).
border-radius:0 KÖTELEZŐ: a globális .wp-block-post-content img
radius-md lekerekítés levágta a védjegy-tábla sarkait („hajlított
szél" hatás — ez volt az eredeti panasz gyökere). */
.mt-brand-logo {
margin: 10px auto 0;
max-width: 420px;
}
.mt-brand-logo img {
display: block;
width: 100%;
height: auto;
border-radius: 0;
}
/* ── Médiamegjelenések (page-mediamegjelenesek) ────────────────────── */
.mt-media {
display: flex;
flex-direction: column;
gap: 24px;
}
.mt-media > h2 {
margin: 8px 0 -6px;
font-size: 24px;
line-height: 1.3;
color: var(--wp--preset--color--heading);
}
.mt-media .mt-table td {
vertical-align: middle;
font-size: 14.5px;
}
.mt-media__date {
white-space: nowrap;
}
.mt-media__logo {
width: 190px;
}
.mt-media__logo a {
display: inline-block;
}
/* Sajtólogók: fehér táblaalapú grafikák — radius 0 (a globális
tartalomkép-lekerekítés levágná a sarkokat, ld. 3024 NONOX logó). */
.mt-media__logo img {
display: block;
width: 100%;
max-width: 170px;
height: auto;
border-radius: 0;
}
/* ── Környezeti nyilatkozat (page-kornyezeti-elkotelezettseg-…) ────── */
.mt-eco .mt-desc-prose > p {
margin: 22px 0;
font-size: 15.5px;
}
/* Aláírás-blokk (Kelt + cégalapító) — levélzáró kártya. */
.mt-eco-sig {
padding: 18px 22px;
background: var(--wp--preset--color--section);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
font-size: 14.5px;
line-height: 1.55;
color: var(--wp--preset--color--body);
}
.mt-eco-sig p {
margin: 0;
font-size: 14.5px;
}
.mt-eco-sig__date {
color: var(--wp--preset--color--muted);
}
.mt-eco-sig__name {
margin-top: 10px;
font-family: var(--wp--preset--font-family--heading);
font-weight: 700;
color: var(--wp--preset--color--heading);
}
/* ── Hogyan vásárolhat (page-hogyan-vasarolhat) ────────────────────── */
.mt-buy {
display: flex;
flex-direction: column;
gap: 24px;
}
.mt-buy > h2 {
margin: 8px 0 -6px;
font-size: 24px;
line-height: 1.3;
color: var(--wp--preset--color--heading);
}
.mt-buy > p {
margin: 0;
font-size: 15.5px;
line-height: 1.65;
color: var(--wp--preset--color--body);
}
/* Regisztrációs módok: számozott kártya, badge felül, szöveg alatta. */
.mt-buy-card .mt-legal-h__num {
margin-bottom: 12px;
}
.mt-buy-card p {
margin: 0;
font-size: 14.5px;
line-height: 1.62;
color: var(--wp--preset--color--body);
}
/* GYIK: natív akkordeon-kártyák (forrás: Journal3 accordion). */
.mt-faq {
display: flex;
flex-direction: column;
gap: 12px;
margin-top: 6px;
}
.mt-faq-item {
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-sm);
}
.mt-faq-item summary {
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
padding: 16px 20px;
cursor: pointer;
list-style: none;
font-family: var(--wp--preset--font-family--heading);
font-size: 15.5px;
font-weight: 600;
color: var(--wp--preset--color--heading);
transition: color var(--mt-dur-fast) var(--mt-ease);
}
.mt-faq-item summary::-webkit-details-marker {
display: none;
}
.mt-faq-item summary:hover {
color: var(--wp--preset--color--primary);
}
.mt-faq-caret {
flex: 0 0 auto;
width: 18px;
height: 18px;
color: var(--wp--preset--color--primary);
transition: transform var(--mt-dur-base) var(--mt-ease);
}
.mt-faq-item[open] .mt-faq-caret {
transform: rotate(180deg);
}
/* Zárás-animáció alatt (mt.js) a pöcök már az alaphelyzet felé fordul. */
.mt-faq-item.is-closing .mt-faq-caret {
transform: none;
}
.mt-faq-body {
padding: 2px 20px 18px;
border-top: 1px solid var(--wp--preset--color--border);
overflow: hidden; /* nyitás/zárás animáció (mt.js) vágja a tartalmat */
}
.mt-faq-body p {
margin: 12px 0 0;
font-size: 14.5px;
line-height: 1.62;
color: var(--wp--preset--color--body);
}
@media (prefers-reduced-motion: reduce) {
.mt-faq-caret,
.mt-faq-item summary {
transition: none;
}
}
/* ── Felmérés / beágyazott űrlap (page-felmeres-*) ──────────────────── */
.mt-survey {
display: flex;
flex-direction: column;
align-items: center;
gap: 16px;
}
.mt-survey-frame {
display: block;
width: 100%;
max-width: 640px;
border: 0;
}
.mt-survey__copyright {
margin: 0;
font-size: 13px;
color: var(--wp--preset--color--muted);
}
/* ── Hírlevél (Mailchimp-migrált űrlap, page-hirlevel-*) ────────────── */
/* Apróbetűs kísérőszöveg a kártyában (kötelező-jelmagyarázat, GDPR-szöveg). */
.mt-form__note {
margin: 0;
font-size: 13.5px;
line-height: 1.55;
color: var(--wp--preset--color--muted);
}
/* Kötelező mező csillaga. */
.mt-req {
color: var(--wp--preset--color--cta);
}
/* ── Videógaléria (page-videok) ─────────────────────────────────────── */
.mt-videos {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 20px;
}
.mt-video-card {
margin: 0;
display: flex;
flex-direction: column;
background: var(--wp--preset--color--base);
border: 1px solid var(--wp--preset--color--border);
border-radius: 16px;
overflow: hidden;
box-shadow: 0 4px 14px rgba(31, 42, 56, 0.06);
transition: box-shadow var(--mt-dur-base) var(--mt-ease), transform var(--mt-dur-base) var(--mt-ease);
}
.mt-video-card:hover {
transform: translateY(-2px);
box-shadow: 0 10px 24px rgba(31, 42, 56, 0.12);
}
/* Kattintható YouTube-előnézet (mt.js cseréli iframe-re). */
.mt-video-thumb {
position: relative;
display: block;
width: 100%;
aspect-ratio: 16 / 9;
padding: 0;
border: 0;
background: var(--wp--preset--color--heading);
cursor: pointer;
/* hover-zoom a dobozON BELÜL maradjon (átlátszó hátterű borítóknál
a kép alja kilógott a feliratsávra — tulajdonosi hibajelentés) */
overflow: hidden;
}
.mt-video-thumb img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 0; /* globális tartalomkép-lekerekítés ellen (3024-trap) */
transition: transform var(--mt-dur-base) var(--mt-ease);
}
.mt-video-thumb:hover img,
.mt-video-thumb:focus-visible img {
transform: scale(1.04);
}
.mt-video-thumb:focus-visible {
outline: 3px solid var(--wp--preset--color--primary);
outline-offset: -3px;
}
.mt-video-play {
position: absolute;
top: 50%;
left: 50%;
width: 56px;
height: 56px;
margin: -28px 0 0 -28px;
display: grid;
place-items: center;
color: var(--wp--preset--color--base);
background: var(--wp--preset--color--primary);
border-radius: 50%;
box-shadow: 0 6px 18px rgba(6, 118, 182, 0.45);
transition: transform var(--mt-dur-base) var(--mt-ease);
}
.mt-video-play svg {
width: 22px;
height: 22px;
margin-left: 3px;
}
.mt-video-thumb:hover .mt-video-play,
.mt-video-thumb:focus-visible .mt-video-play {
transform: scale(1.08);
}
/* Videó-lightbox: középre úszó lejátszó, áttetsző háttérrel (mt.js hozza
létre; a kereső-overlay mintáit követi — tulajdonosi kérés 2026-07-07). */
.mt-video-modal {
position: fixed;
inset: 0;
z-index: var(--mt-z-lightbox);
display: flex;
align-items: center;
justify-content: center;
padding: 32px 16px;
opacity: 0;
transition: opacity var(--mt-dur-base) var(--mt-ease);
}
.mt-video-modal.is-open {
opacity: 1;
}
.mt-video-modal[hidden] {
display: none;
}
.mt-video-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(31, 42, 56, 0.72);
-webkit-backdrop-filter: blur(3px);
backdrop-filter: blur(3px);
cursor: default;
}
.mt-video-modal__dialog {
position: relative;
z-index: 1;
width: min(920px, 100%);
/* Nyitás: a legördülő menü látványos beúszásához igazítva (2.2.54). */
transform: translateY(18px) scale(0.9);
transition: transform var(--mt-dur-slow) var(--mt-ease);
}
.mt-video-modal.is-open .mt-video-modal__dialog {
transform: none;
}
.mt-video-modal__media {
width: 100%;
aspect-ratio: 16 / 9;
background: var(--wp--preset--color--heading);
border-radius: var(--mt-radius-md);
overflow: hidden;
box-shadow: var(--mt-shadow-md);
}
.mt-video-modal__media iframe,
.mt-video-modal__media video {
display: block;
width: 100%;
height: 100%;
border: 0;
/* álló telefonos mp4-ek: pillarbox a 16:9 dobozban, nem levágás */
object-fit: contain;
background: var(--wp--preset--color--heading);
}
.mt-video-modal__close {
position: absolute;
top: -14px;
right: -14px;
z-index: 2;
width: 40px;
height: 40px;
display: grid;
place-items: center;
border: 1px solid var(--wp--preset--color--border);
border-radius: 50%;
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--heading);
cursor: pointer;
box-shadow: var(--mt-shadow-md);
transition: background-color var(--mt-dur-fast) var(--mt-ease),
color var(--mt-dur-fast) var(--mt-ease),
transform var(--mt-dur-fast) var(--mt-ease);
}
.mt-video-modal__close:hover,
.mt-video-modal__close:focus-visible {
background: var(--wp--preset--color--primary);
color: var(--wp--preset--color--base);
transform: scale(1.06);
}
.mt-video-modal__close:focus-visible {
outline: 3px solid var(--mt-blue-tint);
outline-offset: 2px;
}
.mt-video-modal__close svg {
width: 18px;
height: 18px;
}
.mt-video-card__title {
padding: 12px 16px 14px;
font-size: 14.5px;
font-weight: 600;
line-height: 1.45;
color: var(--wp--preset--color--heading);
}
@media (prefers-reduced-motion: reduce) {
.mt-video-card,
.mt-video-thumb img,
.mt-video-play,
.mt-video-modal,
.mt-video-modal__dialog,
.mt-video-modal__close {
transition: none;
}
.mt-video-card:hover {
transform: none;
}
.mt-video-modal__dialog,
.mt-video-modal__close:hover,
.mt-video-modal__close:focus-visible {
transform: none;
}
.mt-video-thumb:hover img,
.mt-video-thumb:focus-visible img,
.mt-video-thumb:hover .mt-video-play,
.mt-video-thumb:focus-visible .mt-video-play {
transform: none;
}
}
/* ── Fotógaléria (page-kepek) ────────────────────────────────────────
A videórács testvére: sűrűbb, felirat nélküli 16:9 kártyák; kattintásra
ugyanaz a .mt-video-modal lightbox nyílik, fotóknál előző/következő
nyilakkal (tulajdonosi döntés 2026-07-07 — a forrásoldal lightgallery-je
is nyilakkal lapozott). */
.mt-photos {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 14px;
}
.mt-photo-card {
margin: 0;
border: 1px solid var(--wp--preset--color--border);
border-radius: 16px;
overflow: hidden;
box-shadow: 0 4px 14px rgba(31, 42, 56, 0.06);
transition: box-shadow var(--mt-dur-base) var(--mt-ease), transform var(--mt-dur-base) var(--mt-ease);
}
.mt-photo-card:hover {
transform: translateY(-2px);
box-shadow: 0 10px 24px rgba(31, 42, 56, 0.12);
}
.mt-photo-thumb {
position: relative;
display: block;
width: 100%;
aspect-ratio: 16 / 9;
padding: 0;
border: 0;
background: var(--wp--preset--color--heading);
cursor: zoom-in;
overflow: hidden; /* hover-zoom a dobozon belül maradjon (2.2.26-lecke) */
}
.mt-photo-thumb img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 0; /* globális tartalomkép-lekerekítés ellen (3024-trap) */
transition: transform var(--mt-dur-base) var(--mt-ease);
}
.mt-photo-thumb:hover img,
.mt-photo-thumb:focus-visible img {
transform: scale(1.04);
}
.mt-photo-thumb:focus-visible {
outline: 3px solid var(--wp--preset--color--primary);
outline-offset: -3px;
}
/* Fotó a lightbox médiadobozában (16:9 doboz, contain — a galéria képei
pont 16:9-esek, de álló kép se vágódna). */
.mt-video-modal__media img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
background: var(--wp--preset--color--heading);
}
/* Lapozó nyilak a lightboxban — csak fotógalériánál látszanak (mt.js
veszi le a hidden-t), a záró gomb kör-idiómáját követik. */
.mt-video-modal__nav {
position: absolute;
top: 50%;
z-index: 2;
width: 44px;
height: 44px;
margin-top: -22px;
display: grid;
place-items: center;
border: 1px solid var(--wp--preset--color--border);
border-radius: 50%;
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--heading);
cursor: pointer;
box-shadow: var(--mt-shadow-md);
transition: background-color var(--mt-dur-fast) var(--mt-ease),
color var(--mt-dur-fast) var(--mt-ease),
transform var(--mt-dur-fast) var(--mt-ease);
}
.mt-video-modal__nav[hidden] {
display: none;
}
.mt-video-modal__nav--prev {
left: -14px;
}
.mt-video-modal__nav--next {
right: -14px;
}
.mt-video-modal__nav:hover,
.mt-video-modal__nav:focus-visible {
background: var(--wp--preset--color--primary);
color: var(--wp--preset--color--base);
transform: scale(1.06);
}
.mt-video-modal__nav:focus-visible {
outline: 3px solid var(--mt-blue-tint);
outline-offset: 2px;
}
.mt-video-modal__nav svg {
width: 20px;
height: 20px;
}
@media (prefers-reduced-motion: reduce) {
.mt-photo-card,
.mt-photo-thumb img,
.mt-video-modal__nav {
transition: none;
}
.mt-photo-card:hover,
.mt-photo-thumb:hover img,
.mt-photo-thumb:focus-visible img,
.mt-video-modal__nav:hover,
.mt-video-modal__nav:focus-visible {
transform: none;
}
}
/* ── GDPR-eszközök (3010/3012/3016) ──────────────────────────────────
Ikeroldali e-mail űrlapok: vissza + tovább gombsor a kártya alján. */
.mt-form__actions {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
gap: 12px;
margin-top: 6px;
}
.mt-form__actions .mt-btn {
border: 0; /* button-elem alap kerete ellen (a --ghost sajátot ad) */
cursor: pointer;
}
.mt-form__actions .mt-btn--ghost {
border: 1px solid var(--wp--preset--color--border);
}
/* GDPR-eszköztár hub: 2×2 szekciókártya-rács (mobilon 1 oszlop). */
.mt-gdpr-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 20px;
}
@media (max-width: 720px) {
.mt-gdpr-grid {
grid-template-columns: 1fr;
}
}
/* ── Süti-hozzájárulás (cookie consent) — NONOX arculat ────────── */
/* Journal3/isenselabs sáv 1:1 tartalommal, de a saját design rendszerrel
* (tokenek, NONOX kék), oldalt lent lebegve. Az „Elfogadom" a valódi
* menet-trend.hu végpontot hívja. Logika: functions.php inline szkript. */
.mt-cookie {
position: fixed;
left: 20px;
bottom: 20px;
z-index: var(--mt-z-cookie-bar);
width: 380px;
max-width: calc(100vw - 40px);
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--body);
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-md);
box-shadow: var(--mt-shadow-md);
padding: 20px 22px;
font-size: 14px;
line-height: 1.55;
opacity: 0;
transform: translateY(16px) scale(0.98);
transform-origin: left bottom;
transition: opacity 0.3s var(--mt-ease),
transform 0.3s var(--mt-ease);
}
.mt-cookie[hidden],
.mt-cookie-revoke[hidden],
.mt-cookie-settings[hidden] {
display: none;
}
.mt-cookie.is-active {
opacity: 1;
transform: none;
}
.mt-cookie__text {
margin: 0 0 15px;
}
.mt-cookie__text a {
color: var(--wp--preset--color--primary);
font-weight: 600;
text-decoration: none;
}
.mt-cookie__text a:hover,
.mt-cookie__text a:focus-visible {
text-decoration: underline;
}
.mt-cookie__actions {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.mt-cookie__btn {
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 13.5px;
line-height: 1.2;
padding: 9px 16px;
border-radius: var(--mt-radius-sm);
border: 1px solid transparent;
cursor: pointer;
transition: background-color var(--mt-dur-fast) var(--mt-ease),
border-color var(--mt-dur-fast) var(--mt-ease),
color var(--mt-dur-fast) var(--mt-ease),
transform var(--mt-dur-fast) var(--mt-ease),
box-shadow var(--mt-dur-fast) var(--mt-ease);
}
.mt-cookie__btn:hover {
transform: translateY(-1px);
}
.mt-cookie__btn:active {
transform: translateY(0) scale(0.97);
transition-duration: 60ms;
}
.mt-cookie__btn--primary {
background: var(--wp--preset--color--primary);
color: var(--wp--preset--color--base);
}
.mt-cookie__btn--primary:hover,
.mt-cookie__btn--primary:focus-visible {
background: var(--wp--preset--color--accent);
box-shadow: var(--mt-shadow-sm);
}
.mt-cookie__btn--ghost {
background: transparent;
color: var(--wp--preset--color--heading);
border-color: var(--wp--preset--color--border);
}
.mt-cookie__btn--ghost:hover,
.mt-cookie__btn--ghost:focus-visible {
border-color: var(--wp--preset--color--primary);
color: var(--wp--preset--color--primary);
}
/* Visszahívó „🍪 Sütik" fül (a hozzájárulás után marad, újranyitható). */
.mt-cookie-revoke {
position: fixed;
left: 20px;
bottom: 20px;
z-index: var(--mt-z-cookie-revoke);
display: inline-flex;
align-items: center;
gap: 6px;
font-family: var(--wp--preset--font-family--heading);
font-weight: 600;
font-size: 13px;
padding: 8px 14px;
border: 1px solid var(--wp--preset--color--border);
border-radius: var(--mt-radius-pill);
background: var(--wp--preset--color--base);
color: var(--wp--preset--color--heading);
box-shadow: var(--mt-shadow-sm);
cursor: pointer;
transition: border-color var(--mt-dur-fast) var(--mt-ease),
color var(--mt-dur-fast) var(--mt-ease),
transform var(--mt-dur-fast) var(--mt-ease);
}
.mt-cookie-revoke:hover,
.mt-cookie-revoke:focus-visible {
border-color: var(--wp--preset--color--primary);
color: var(--wp--preset--color--primary);
transform: translateY(-1px);
}
/* Belépő csak a kattintásos visszatéréskor (hideBar → .is-entering); betöltéskor
a fül az első festéssel, animáció nélkül látszik (tulaj 2026-09-08). */
.mt-cookie-revoke.is-entering {
animation: mt-cookie-revoke-in 0.3s var(--mt-ease);
}
@keyframes mt-cookie-revoke-in {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: none;
}
}
/* ── Chat-indító gomb (saját, a Smartsupp buborék helyett) ──────────
Az első festéssel jelenik meg (wp_body_open, statikus markup); kattintásra a
támogatott `smartsupp('chat:open')` API nyitja a valódi Smartsupp-ablakot, a
szolgáltató ~1,5 s késve érkező buborékját a wp_head