/*
Theme Name: PizzaFoodTruck
Theme URI: https://pizzafoodtruck.hu/
Author: Párkányi Tamás e.v.
Description: Saját, Elementor nélküli sablon a pizzafoodtruck.hu-hoz. Aszfaltszürke és jelzősárga, útburkolati jel motívum, Archivo betű (helyben tárolva). A pizzafoodtruck-core bővítménnyel együtt használandó.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
License: GPLv2 or later
Text Domain: pizzafoodtruck
*/

/* Betű: Archivo (SIL OFL), helyben tárolva, a Google-szerverek hívása nélkül. */
@font-face {
	font-family: 'Archivo Variable';
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	font-stretch: 62% 125%;
	src: url(fonts/archivo-latin-ext-wdth-normal.woff2) format('woff2-variations');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Archivo Variable';
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	font-stretch: 62% 125%;
	src: url(fonts/archivo-latin-wdth-normal.woff2) format('woff2-variations');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	--pft-szen: #17191d;
	--pft-aszfalt: #24282e;
	--pft-sarga: #ffc72c;
	--pft-sarga-sotet: #f0b400;
	--pft-sarga-halvany: #fff3c4;
	--pft-hatter: #f2f1ec;
	--pft-vonal: #d9d7cf;
	--pft-szurke: #595d64;
	--pft-radius: 12px;
	--pft-arnyek: 4px 4px 0 var(--pft-szen);
	--pft-betu: 'Archivo Variable', 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
	--pftt-szeles: 1180px;
	--pftt-szoveg: 72ch;
	/* Útburkolati jel: a márka visszatérő motívuma */
	--pftt-felfestes: repeating-linear-gradient(90deg, var(--pft-sarga) 0 46px, transparent 46px 78px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
[id] { scroll-margin-top: 84px; } /* a ragadós fejléc ne takarja ki a horgonyt */
body { margin: 0; font-family: var(--pft-betu); font-size: 1.0625rem; line-height: 1.6; color: var(--pft-szen); background: #fff; overflow-x: hidden; }
img { max-width: 100%; height: auto; }
h1, h2, h3, h4 { font-stretch: 78%; font-weight: 850; line-height: 1.08; letter-spacing: -.005em; margin: 1.6em 0 .5em; }
h1 { font-size: clamp(2.1rem, 4.4vw, 3.4rem); text-transform: uppercase; }
h2 { font-size: clamp(1.55rem, 2.8vw, 2.2rem); text-transform: uppercase; }
h2::after { content: ""; display: block; width: 110px; height: 7px; margin-top: 12px; background: var(--pftt-felfestes); background-size: 78px 7px; }
h3 { font-size: 1.32rem; }
h4 { font-size: 1.1rem; }
p, ul, ol { margin: 0 0 1em; }
a { color: var(--pft-szen); text-decoration-thickness: 2px; text-underline-offset: 3px; text-decoration-color: var(--pft-sarga-sotet); }
a:hover { background-color: var(--pft-sarga-halvany); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--pft-sarga); outline-offset: 2px; }
strong { font-weight: 750; }
table { border-collapse: collapse; width: 100%; margin: 1.2em 0; font-size: .97rem; }
th, td { padding: 10px 12px; border-bottom: 1px solid var(--pft-vonal); text-align: left; vertical-align: top; }
th { background: var(--pft-szen); color: #fff; font-stretch: 85%; text-transform: uppercase; font-size: .82rem; letter-spacing: .04em; }
tbody tr:nth-child(even) { background: #faf9f6; }
blockquote { margin: 1.2em 0; padding: 12px 18px; border-left: 6px solid var(--pft-sarga); background: var(--pft-hatter); }
hr { border: 0; height: 7px; background: var(--pftt-felfestes); background-size: 78px 7px; margin: 2.4em 0; }

.kontener { width: 100%; max-width: var(--pftt-szeles); margin: 0 auto; padding: 0 20px; }
.ugras { position: absolute; left: -9999px; top: 0; z-index: 100; background: var(--pft-sarga); color: var(--pft-szen); padding: 10px 16px; font-weight: 800; }
.ugras:focus { left: 10px; top: 10px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }

/* Gomb tartalék arra az esetre, ha a bővítmény stílusa nincs betöltve. :where() = nulla specificitás,
   így a bővítmény szabályai (például a fehér .pft-gomb-masodlagos) mindig erősebbek. */
:where(.pft-gomb) { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 8px; background: var(--pft-sarga); color: var(--pft-szen) !important; border: 2px solid var(--pft-szen); box-shadow: 3px 3px 0 var(--pft-szen); font-weight: 800; font-size: .95rem; line-height: 1.2; text-decoration: none !important; cursor: pointer; transition: transform .12s ease, box-shadow .12s ease; }
:where(.pft-gomb):hover { background: var(--pft-sarga); transform: translate(-1px, -1px); box-shadow: 4px 4px 0 var(--pft-szen); }

/* Fejléc ------------------------------------------------------------------- */
.fejlec { background: var(--pft-szen); color: #fff; position: sticky; top: 0; z-index: 50; }
.admin-bar .fejlec { top: 32px; }
.fejlec-sor { display: flex; align-items: center; gap: 18px; min-height: 68px; }
.logo { display: inline-flex; align-items: baseline; gap: 6px; text-decoration: none; color: #fff; font-stretch: 72%; font-weight: 900; font-size: 1.45rem; letter-spacing: .01em; text-transform: uppercase; white-space: nowrap; }
.logo:hover { background: none; }
.logo-truck { background: var(--pft-sarga); color: var(--pft-szen); padding: 1px 8px 2px; border-radius: 5px; transform: rotate(-2deg); display: inline-block; }
.logo-hu { font-size: .9rem; color: #b9bcc2; letter-spacing: 0; text-transform: none; font-stretch: 90%; }
.logo img { max-height: 44px; width: auto; }
.fomenu { margin-left: auto; }
.fomenu ul { list-style: none; margin: 0; padding: 0; }
.fomenu-lista { display: flex; align-items: center; gap: 2px; }
.fomenu-lista > li { position: relative; }
.fomenu a { display: block; padding: 10px 9px; color: #fff; text-decoration: none; font-weight: 700; font-size: .95rem; font-stretch: 86%; white-space: nowrap; border-radius: 6px; }
.fomenu a:hover, .fomenu .current-menu-item:not(.menu-item-type-custom) > a, .fomenu .current-menu-ancestor > a, .single-post .fomenu .current_page_parent > a, .category .fomenu .current_page_parent > a { background: var(--pft-aszfalt); color: var(--pft-sarga); }
.oldal-bevezeto + .cikk-meta { margin-top: 12px; }
.fomenu .sub-menu { display: none; position: absolute; top: 100%; left: 0; min-width: 260px; background: var(--pft-aszfalt); padding: 8px; border-radius: 0 0 10px 10px; box-shadow: 0 12px 24px rgba(0, 0, 0, .25); }
.fomenu li:hover > .sub-menu, .fomenu li:focus-within > .sub-menu { display: block; }
.fomenu .sub-menu a { font-weight: 600; }
.fomenu .menu-item-has-children > a::after { content: " ▾"; font-size: .8em; color: var(--pft-sarga); }
.fejlec-cta { margin-left: 6px; white-space: nowrap; }
.menu-gomb { display: none; margin-left: auto; background: transparent; color: #fff; border: 2px solid #fff; border-radius: 8px; padding: 8px 12px; font: inherit; font-weight: 800; cursor: pointer; }

@media (max-width: 1160px) {
	.menu-gomb { display: inline-flex; }
	.fomenu { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--pft-szen); padding: 8px 20px 20px; border-top: 1px solid var(--pft-aszfalt); max-height: calc(100vh - 68px); overflow: auto; }
	.menu-nyitva .fomenu { display: block; }
	.fomenu-lista { flex-direction: column; align-items: stretch; }
	.fomenu .sub-menu { display: block; position: static; box-shadow: none; background: transparent; padding: 0 0 0 14px; min-width: 0; }
	.fejlec-cta { padding: 8px 12px; font-size: .88rem; }
}
@media (max-width: 560px) {
	.logo { font-size: 1.15rem; }
	.fejlec-cta { display: none; }
	.menu-nyitva .fejlec-cta { display: none; }
}

/* Lábléc -------------------------------------------------------------------- */
.lablec { background: var(--pft-szen); color: #d6d8dc; margin-top: 64px; position: relative; padding-top: 30px; }
.lablec::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 8px; background: var(--pftt-felfestes); background-size: 78px 8px; }
.lablec a { color: #fff; }
.lablec a:hover { background: transparent; color: var(--pft-sarga); }
.lablec-racs { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; padding-top: 28px; padding-bottom: 28px; }
.lablec h2 { font-size: 1rem; color: var(--pft-sarga); margin: 0 0 12px; }
.lablec h2::after { display: none; }
.lablec ul { list-style: none; margin: 0; padding: 0; }
.lablec li { margin: 0 0 8px; }
.lablec-also { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding-top: 16px; padding-bottom: 26px; border-top: 1px solid var(--pft-aszfalt); font-size: .88rem; color: #9da1a8; }
.lablec-also p { margin: 0; }
@media (max-width: 1000px) { .lablec-racs { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .lablec-racs { grid-template-columns: 1fr; } }

/* Oldalfej: kompakt, a kép mellett a cím (nem nagy hangulatkép) ------------------ */
.oldal-fej { background: var(--pft-hatter); position: relative; padding: 34px 0 40px; }
.oldal-fej::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 7px; background: var(--pftt-felfestes); background-size: 78px 7px; opacity: .9; }
.oldal-fej-racs { display: grid; grid-template-columns: 1fr; gap: 26px; align-items: center; }
.van-kep .oldal-fej-racs { grid-template-columns: 1.15fr .85fr; }
.oldal-cim { margin: 6px 0 10px; }
.oldal-bevezeto { font-size: 1.12rem; color: var(--pft-szurke); max-width: 60ch; margin: 0; }
.oldal-fej-kep { margin: 0; }
.oldal-fej-kep img { display: block; width: 100%; height: 260px; object-fit: cover; border: 2px solid var(--pft-szen); border-radius: var(--pft-radius); box-shadow: var(--pft-arnyek); }
.oldal-fej-kep figcaption { font-size: .8rem; color: var(--pft-szurke); margin-top: 8px; }
.oldal-fej-kep figcaption a { color: inherit; }
.morzsa { font-size: .85rem; color: var(--pft-szurke); margin: 0; }
.morzsa a { color: var(--pft-szurke); }
.oldal-kicker { display: inline-block; margin: 0; padding: 3px 10px; background: var(--pft-sarga); border: 2px solid var(--pft-szen); border-radius: 6px; font-weight: 800; font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; }
.oldal-fej-gombok { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
@media (max-width: 820px) {
	.van-kep .oldal-fej-racs { grid-template-columns: 1fr; }
	.oldal-fej-kep img { height: 200px; }
}

.oldal-tartalom { padding-top: 26px; }
.oldal-tartalom > :where(p, ul, ol, h2, h3, h4, blockquote, .pft-forrasok, .pft-kepforras) { max-width: var(--pftt-szoveg); }
.oldal-tartalom > table { max-width: 900px; }
.oldal-tartalom > h2:first-child { margin-top: .6em; }

/* Adatlap (truck, cateringes): nagy fotó, mert a truckot meg kell mutatni ----------- */
.adatlap-fej-racs { display: grid; grid-template-columns: 1fr 1.1fr; gap: 30px; align-items: center; }
.adatlap-fej-kep img { height: 360px; }
@media (max-width: 820px) { .adatlap-fej-racs { grid-template-columns: 1fr; } .adatlap-fej-kep img { height: 240px; } }

/* Cikk ------------------------------------------------------------------------ */
.cikk-meta { color: var(--pft-szurke); font-size: .92rem; margin: 0; }
.cikk-tartalom { max-width: 760px; margin: 0 auto; padding-top: 26px; font-size: 1.1rem; line-height: 1.7; }
.cikk-tartalom figure { margin: 1.4em 0; }
.cikk-tartalom figcaption { font-size: .82rem; color: var(--pft-szurke); }
.cikk-vege { max-width: 760px; margin: 36px auto 0; padding: 20px 22px; background: var(--pft-sarga-halvany); border: 2px solid var(--pft-szen); border-radius: var(--pft-radius); }
.cikk-vege p { margin: 0 0 10px; }

/* Cikklista ------------------------------------------------------------------- */
.lista-ures { padding: 22px; border: 2px dashed var(--pft-vonal); border-radius: var(--pft-radius); background: var(--pft-hatter); }
.nav-links { display: flex; gap: 8px; flex-wrap: wrap; margin: 30px 0; }
.nav-links .page-numbers { padding: 8px 14px; border: 2px solid var(--pft-szen); border-radius: 8px; text-decoration: none; font-weight: 800; }
.nav-links .current { background: var(--pft-sarga); }

/* Főoldal: szakaszok ------------------------------------------------------------- */
.nyitolap > * { max-width: var(--pftt-szeles); margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; }
.nyitolap > .pft-hos { max-width: none; padding: 0; }
.nyitolap > .szekcio, .nyitolap > .pft-cikkek-szekcio { padding-top: 46px; padding-bottom: 10px; }
.nyitolap > .szekcio-teljes { max-width: none; padding-left: 0; padding-right: 0; background: var(--pft-hatter); margin-top: 46px; padding-bottom: 36px; }
.nyitolap > .szekcio-teljes > * { max-width: var(--pftt-szeles); margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; }
.nyitolap .szekcio > h2:first-child, .nyitolap .szekcio-teljes > h2:first-child, .pft-cikkek-szekcio > h2:first-child { margin-top: 0; }
.nyitolap .szekcio-teljes > h2:first-child { padding-top: 40px; }
.szekcio-bevezeto { color: var(--pft-szurke); max-width: 70ch; }
.tovabb { font-weight: 800; }
.tovabb a { text-decoration: none; border-bottom: 3px solid var(--pft-sarga); }

.nyitolap > .pft-hos { border-radius: 0; }
.nyitolap .szekcio > p:not(.tovabb) { max-width: 72ch; }

/* Lépések (Így működik) */
.lepesek { list-style: none; counter-reset: lepes; margin: 20px 0 22px; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 18px; }
.lepesek li { counter-increment: lepes; position: relative; padding: 58px 18px 18px; background: #fff; border: 2px solid var(--pft-szen); border-radius: var(--pft-radius); }
.lepesek li::before { content: counter(lepes); position: absolute; top: -2px; left: -2px; width: 48px; height: 46px; display: grid; place-items: center; background: var(--pft-sarga); border: 2px solid var(--pft-szen); border-radius: var(--pft-radius) 0 var(--pft-radius) 0; font-weight: 900; font-size: 1.55rem; font-stretch: 72%; }
.lepesek strong { display: block; font-size: 1.12rem; margin-bottom: 4px; }

/* Sötét sáv (truckosoknak) */
.nyitolap > .szekcio-sotet { max-width: none; padding: 0 0 40px; margin-top: 60px; background: var(--pft-szen); color: #fff; }
.nyitolap > .szekcio-sotet::before { content: ""; display: block; height: 8px; margin-bottom: 40px; background: var(--pftt-felfestes); background-size: 78px 8px; }
.nyitolap > .szekcio-sotet > * { max-width: var(--pftt-szeles); margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; }
.szekcio-sotet h2 { color: #fff; margin-top: 0; }
.ket-doboz { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 22px; }
.nyitolap > .szekcio-sotet > .ket-doboz { padding-left: 20px; padding-right: 20px; }
.doboz { background: var(--pft-aszfalt); border: 2px solid #3a3f47; border-radius: var(--pft-radius); padding: 22px 22px 8px; }
.doboz h3 { color: var(--pft-sarga); margin-top: 0; }
.doboz p { color: #d6d8dc; }
.doboz .pft-gomb { box-shadow: 3px 3px 0 #000; }

/* Gyakori kérdések */
.gyik h3 { margin: 24px 0 6px; padding-left: 14px; border-left: 6px solid var(--pft-sarga); font-size: 1.2rem; }
.gyik p { max-width: 72ch; }

/* Felhívás doboz az oldalak alján (régiós oldalak, Árak) */
.cta-doboz { margin: 36px 0; padding: 20px 22px; background: var(--pft-sarga-halvany); border: 2px solid var(--pft-szen); border-radius: var(--pft-radius); box-shadow: var(--pft-arnyek); max-width: 900px; }
.cta-doboz p { margin: 0 0 12px; max-width: 72ch; }
.cta-doboz p:last-child { margin-bottom: 0; }

/* 404, keresés --------------------------------------------------------------------- */
.kereso-urlap { display: flex; gap: 8px; max-width: 520px; }
.kereso-urlap input[type=search] { flex: 1; padding: 10px 12px; border: 2px solid var(--pft-szen); border-radius: 8px; font: inherit; }

/* WordPress-alapok */
.alignleft { float: left; margin: 0 1.2em 1em 0; }
.alignright { float: right; margin: 0 0 1em 1.2em; }
.aligncenter { display: block; margin: 0 auto 1em; }
.wp-caption-text, .wp-element-caption { font-size: .82rem; color: var(--pft-szurke); }