.rendeles{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;padding-top:56px;padding-bottom:72px}
.rendeles-kesz{padding-top:72px;padding-bottom:96px;max-width:760px}
.arak{margin:28px 0;padding:0;border-top:1px solid var(--vonal)}
.arak div{display:grid;grid-template-columns:8em 1fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--vonal)}
.arak dt{font-weight:700}
.arak dd{margin:0}
.arak dd span{display:block;color:var(--tinta-2);font-size:.95rem}
.rendeles-urlap form{background:var(--halvany);border-radius:10px;padding:28px}
.rendeles-urlap fieldset{border:0;margin:0 0 18px;padding:0}
.rendeles-urlap legend{font-weight:800;font-size:1.15rem;margin-bottom:8px}
.mezo{margin:0 0 14px}
.mezo label{display:block;font-weight:600;font-size:.95rem;margin-bottom:4px}
.mezo input{width:100%;font:inherit;font-size:1rem;padding:10px 12px;border:2px solid var(--vonal);border-radius:6px;background:var(--papir);color:var(--tinta)}
.mezo input:focus-visible{outline:3px solid var(--piros);outline-offset:1px;border-color:var(--tinta)}
.mezo-hibas input{border-color:var(--piros)}
.hiba{color:var(--piros-sotet);font-size:.92rem;font-weight:600;margin:4px 0 0}
.figyelem{border-left:4px solid var(--piros);padding:10px 14px;background:var(--papir);font-weight:600}
.rendeles-urlap button{font:inherit;font-weight:800;font-size:1.05rem;background:var(--piros);color:#fff;border:0;border-radius:6px;padding:14px 24px;cursor:pointer;width:100%}
.rendeles-urlap button:hover{background:var(--piros-sotet)}
.rendeles-urlap button:focus-visible{outline:3px solid var(--tinta);outline-offset:2px}
.telepito-sor{margin:8px 0 14px;padding:14px 16px;background:var(--tinta);color:#fff;border-radius:6px;overflow-x:auto;white-space:pre-wrap;word-break:break-all;user-select:all}
.telepito-sor code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.95rem}
.rendeles-kesz h2{margin:28px 0 6px;font-size:1.2rem}
.rendeles-kesz .gomb{display:inline-block;font-weight:800;background:var(--piros);color:#fff;border-radius:6px;padding:14px 24px;text-decoration:none}
.rendeles-kesz .gomb:hover{background:var(--piros-sotet)}
.rendeles-kesz .gomb:focus-visible{outline:3px solid var(--tinta);outline-offset:2px}
@media (max-width:860px){.rendeles{grid-template-columns:1fr;gap:28px;padding-top:32px}}
.fizetes{max-width:760px;padding-top:40px;padding-bottom:72px}
.zarolas{border-left:6px solid var(--piros);background:var(--halvany);border-radius:0 10px 10px 0;padding:22px 26px;margin:0 0 24px}
.zarolas h1{font-size:clamp(1.5rem,1.1rem + 1.6vw,2.1rem);line-height:1.15;margin:0 0 12px}
.zarolas p{margin:0 0 10px}
.zarolas p:last-child{margin-bottom:0}
.checkout.betolt{min-height:120px}
.tartalek{margin:20px 0;padding:18px 20px;border:2px solid var(--vonal);border-radius:10px}
.tartalek p{margin:0 0 12px}
.tartalek button{font:inherit;font-weight:800;background:var(--tinta);color:#fff;border:0;border-radius:6px;padding:12px 20px;cursor:pointer}
.tartalek button:hover{background:var(--piros-sotet)}
.tartalek button:focus-visible{outline:3px solid var(--piros);outline-offset:2px}
.tartalek.halk{border:0;padding:0;font-size:.92rem;color:var(--tinta-2)}
.tartalek.halk button{background:none;color:var(--tinta);text-decoration:underline;padding:0;font-weight:600}
@media (max-width:480px){.fizetes{padding-top:20px}.zarolas{padding:16px 16px;margin-bottom:18px}.zarolas p{font-size:.97rem}}

/* Kai 1030 (card d1d9f99f): the e-mail field's frame at 3:1 (WCAG 1.4.11:
   3.52:1 on the panel, 3.96:1 on white), and on a 390 px phone the order
   button on the first screen (measured: y 953 -> 758, the bottom under 844). */
.mezo input{border-color:#857f77}
@media (max-width:480px){
  .rendeles{padding-top:20px;gap:20px}
  .rendeles h1{font-size:1.6rem;line-height:1.15;margin-bottom:10px}
  .rendeles .bevezeto{font-size:1rem;line-height:1.5}
  .arak{margin:16px 0}
  .arak div{padding:10px 0;grid-template-columns:6.5em 1fr}
  .rendeles-urlap form{padding:20px}
  .rendeles-urlap fieldset{margin-bottom:12px}
}

/* The consent bar stays at the bottom on every width (card c11d19e7, Zoltán
   TG 67735: „Valamiért felül van a cookie-sáv”, the top bar of Kai 1030,
   card d1d9f99f, covered the title on a phone). The bar
   (static/hozzajarulas.js) publishes how much of the viewport it takes as
   --kk-sav-hely and drops it after the choice, so the page end gets that much
   room: every field and the payment block can be scrolled clear of the bar.
   scroll-padding-bottom does the same for focus scrolling (Tab, the phone
   keyboard's next key), which would otherwise park a control under the bar. */
body{padding-bottom:var(--kk-sav-hely,0px)}
html{scroll-padding-bottom:var(--kk-sav-hely,0px)}

/* ÁSZF v3 E1 (card c11d19e7): the five 30.1 groups, each in its own
   highlighted box apart from the other terms (ÁSZF 30.1), the full clause text
   scrollable inside it, the box under the text. Boxes 24 px, label beside. */
.rendeles-urlap fieldset.jogi{margin-top:6px}
.csoport{margin:0 0 18px;padding:14px 14px 4px;background:var(--papir);border:2px solid var(--vonal);border-left:6px solid var(--piros);border-radius:8px}
.csoport h3{font-size:1rem;margin:0 0 8px}
.csoport-szoveg{max-height:13em;overflow-y:auto;padding:4px 10px 4px 0;margin:0 0 10px;font-size:.9rem;line-height:1.5;border-bottom:1px solid var(--vonal)}
.csoport-szoveg:focus-visible{outline:3px solid var(--piros);outline-offset:2px}
.csoport-szoveg p,.csoport-szoveg ul{margin:0 0 8px}
.csoport-szoveg ul{padding-left:1.2em}
.pipa{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:start;margin:0 0 14px}
.pipa input{width:24px;height:24px;margin:2px 0 0;accent-color:var(--piros);cursor:pointer}
.pipa input:focus-visible{outline:3px solid var(--piros);outline-offset:2px}
.pipa label{font-size:.95rem;line-height:1.45;cursor:pointer}
.pipa .hiba{grid-column:2}
.pipa-hibas input{outline:2px solid var(--piros);outline-offset:1px}
@media (max-width:480px){.csoport{padding:12px 12px 2px}.csoport-szoveg{max-height:11em}}
/* One-line acceptance (jogi.mjs EGY_SOR, Zoltán TG 66065): the line that
   placing the order accepts the ÁSZF, then the highlighted terms as a short
   list in one marked box, each with its full text behind a <details>. */
.elfogadas-sor{margin:4px 0 12px;font-weight:600;line-height:1.45}
.kiemelt{margin:0 0 18px;padding:12px 14px 6px;background:var(--papir);border:2px solid var(--vonal);border-left:6px solid var(--piros);border-radius:8px}
.kiemelt-cim{margin:0 0 8px;font-size:.95rem}
.kiemelt-lista{list-style:none;margin:0;padding:0}
.kiemelt-lista li{border-top:1px solid var(--vonal);padding:8px 0}
.kiemelt-lista li:first-child{border-top:0}
.kiemelt-lista summary{cursor:pointer;line-height:1.45}
.kiemelt-lista summary:focus-visible{outline:3px solid var(--piros);outline-offset:2px}
.kiemelt-lista .pontok{color:var(--tinta-2);font-size:.85rem;white-space:normal}
/* No inner scroll box here: an open group shows its whole text, so a keyboard
   user needs no focusable scroll region (Codex P2 on d2abe521e2). */
.kiemelt-lista .csoport-szoveg{margin:8px 0 4px;max-height:none;overflow:visible}
/* Box-free order form (ÁSZF 1.2, card c11d19e7, Lead 86586 point 2): the
   buyer-type switch, the private-buyer block and the two button labels. The
   page has no script, so the switch works by :has on the checked radio. A
   browser without :has shows the private block and the private label to
   everyone (the label 45/2014. 15. § (2) requires), never the other way. */
.vevo-tipus{border:0;margin:0 0 14px;padding:0}
.vevo-tipus legend{font-weight:700;margin-bottom:6px}
.valaszto{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:start;margin:0 0 8px;font-size:.95rem;line-height:1.45;cursor:pointer}
.valaszto input{width:22px;height:22px;margin:1px 0 0;accent-color:var(--piros);cursor:pointer}
.valaszto input:focus-visible{outline:3px solid var(--piros);outline-offset:2px}
.jogi-linkek{margin:0 0 14px;font-size:.95rem;line-height:1.45}
.csak-magan{margin:0 0 14px;padding:12px 14px;border:2px solid var(--vonal);border-radius:8px;background:var(--papir)}
.csak-magan p{margin:0 0 8px;font-size:.95rem;line-height:1.45}
.csak-magan p:last-child{margin-bottom:0}
.magan-cim{font-weight:700}
.ar-egyszer{font-weight:700;color:var(--signal-text)}
.rendeles-urlap button .gomb-ceg{display:none}
.rendeles-urlap form:has(#vevo_tipus_vallalkozas:checked) .gomb-ceg{display:inline}
.rendeles-urlap form:has(#vevo_tipus_vallalkozas:checked) .gomb-magan{display:none}
.rendeles-urlap form:has(#vevo_tipus_vallalkozas:checked) .csak-magan{display:none}
.rendeles-urlap form:has(#vevo_tipus_maganszemely:checked) .csak-ceg{display:none}

/* Üzleti Pilóta look of the order, thank-you and payment pages (Zoltán TG 66770, card b5c71102). Tokens are the
   landing's (uzletipilota-fooldal/stilus.css, read 2026-11-02): ink #070C18, muted #4F5B72, line #DCE3ED, ground
   #F1F4F9, signal #FFB020, error #A3141F; the order card follows the landing's #jelentkezes form. Only these pages
   load this file, so the install page (telepito.css) keeps its look.
   Fonts come from the landing's own path, because on uzletipilota.hu (where buyers order) nginx proxies
   only a fixed /static/ list to this service (sites-enabled/uzletipilota-hu line 88, read 2026-11-02): /betuk/ is
   same-origin there. On the telepites-* hosts it 404s, so each face falls back to the instance's own
   /static/betuk/ copy (byte-equal files, card 501c71a7). The header robot (rendeles.mjs PILOTA_MARKA) uses the
   same two-path trick, see .marka-robot below. */
@font-face{font-family:'Archivo';font-style:normal;font-weight:400 900;font-display:swap;src:url(/betuk/archivo-latin.woff2) format('woff2'),url(/static/betuk/archivo-latin.woff2) format('woff2');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}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400 900;font-display:swap;src:url(/betuk/archivo-latin-ext.woff2) format('woff2'),url(/static/betuk/archivo-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C4,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/betuk/instrument-sans-latin.woff2) format('woff2'),url(/static/betuk/instrument-sans-latin.woff2) format('woff2');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}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/betuk/instrument-sans-latin-ext.woff2) format('woff2'),url(/static/betuk/instrument-sans-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C4,U+2C60-2C7F,U+A720-A7FF}
body{--tinta:#070C18;--tinta-2:#4F5B72;--vonal:#DCE3ED;--halvany:#F1F4F9;--papir:#fff;--piros:#A3141F;--piros-sotet:#A3141F;--pl-jel:#FFB020;--pl-jel-vilagos:#FFC048;
  background:var(--halvany);font-family:'Instrument Sans','Public Sans',system-ui,-apple-system,'Segoe UI',sans-serif}
h1,h2,h3,.rendeles-urlap legend,.arak dt,.rendeles-urlap button,.rendeles-kesz .gomb{font-family:'Archivo','Public Sans',system-ui,-apple-system,'Segoe UI',sans-serif}
h1{letter-spacing:-.02em}
a{color:var(--tinta);text-decoration-thickness:1.5px;text-underline-offset:3px}
a:hover{color:var(--tinta-2)}
/* header bar = the landing header (uzletipilota-fooldal/eszkoz/vegleges.css .fej, measured on uzletipilota.hu 2026-11-02), Zoltán TG 67408 */
.fej{background:rgba(30,28,150,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.12)}
.fej-belso{min-height:72px}
.marka-pilota{gap:10px;color:#fff;text-decoration:none;font-family:'Archivo','Public Sans',system-ui,sans-serif;font-weight:800;font-size:1.15rem;letter-spacing:-.01em}
.marka-pilota svg{width:40px;height:40px;flex:none}
/* the robot tile: landing copy first (uzletipilota.hu), instance copy under it (telepites-* hosts), card 501c71a7 */
.marka-robot{display:block;width:40px;height:40px;flex:none;border-radius:10px;background:#F4F6FA url(/logo/pilota-robot-192.png) center/cover no-repeat;background-image:url(/logo/pilota-robot-192.png),url(/static/pilota-robot-192.png)}
.marka-pilota:hover{color:#fff}
.marka-pilota:focus-visible{outline:3px solid var(--pl-jel);outline-offset:4px;border-radius:4px}
/* the order card: white on the ground, as the landing's form */
.rendeles-urlap form{background:#fff;border:1px solid var(--vonal);border-radius:14px;padding:30px;box-shadow:0 30px 60px -40px rgba(7,12,24,.35)}
.csak-magan,.csoport,.kiemelt{background:var(--halvany)}
.csoport,.kiemelt,.zarolas{border-left-color:var(--pl-jel)}
.zarolas{background:#fff}
/* field frame #6E7A90: 4.33:1 on white (WCAG 1.4.11 needs 3:1); the landing's #9AA6BC would be 2.5:1 */
.mezo input{min-height:48px;border:1.5px solid #6E7A90;border-radius:8px;padding:11px 14px}
.mezo input:focus-visible{border-color:var(--tinta);outline:3px solid rgba(255,176,32,.55);outline-offset:1px}
.mezo-hibas input{border-color:var(--piros)}
.valaszto input,.pipa input{accent-color:var(--tinta)}
.valaszto input:focus-visible,.pipa input:focus-visible,.csoport-szoveg:focus-visible,.kiemelt-lista summary:focus-visible{outline-color:var(--tinta)}
.pipa-hibas input{outline-color:var(--piros)}
.rendeles-urlap button,.rendeles-kesz .gomb{background:var(--pl-jel);color:var(--tinta);border-radius:10px;min-height:52px;
  box-shadow:0 10px 30px -10px rgba(255,176,32,.55);transition:transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s,background .2s}
.rendeles-urlap button:hover,.rendeles-kesz .gomb:hover{background:var(--pl-jel-vilagos);color:var(--tinta);transform:translateY(-2px);box-shadow:0 16px 36px -12px rgba(255,176,32,.7)}
.rendeles-urlap button:focus-visible,.rendeles-kesz .gomb:focus-visible{outline:3px solid var(--tinta);outline-offset:2px}
/* the quiet variant (.halk, set by fizetes.js once Stripe mounts) stays a plain text link: hover kept off it (Codex P2 on 2d3348c9b5) */
.tartalek:not(.halk) button{background:var(--tinta)}
.tartalek:not(.halk) button:hover{background:#1B2438}
.tartalek:not(.halk) button:focus-visible{outline-color:var(--pl-jel)}
.figyelem{background:#fff}
/* the note under the button cleared the button's 30 px shadow by 0 px (capture 2026-11-02) */
.rendeles-urlap button+.megjegyzes,.rendeles-urlap .megjegyzes{margin-top:14px}
@media (prefers-reduced-motion:reduce){.rendeles-urlap button,.rendeles-kesz .gomb{transition:none}.rendeles-urlap button:hover,.rendeles-kesz .gomb:hover{transform:none}}
@media (max-width:480px){.marka-pilota svg{width:34px;height:34px}.marka-pilota{font-size:1.05rem}.fej-belso{min-height:62px}.rendeles-urlap form{padding:20px}}

/* Order and payment pages on the /vegleges/ colour field (card 501c71a7, f93dcc8d; Zoltán TG 66986, 67055, 67068).
   Colours and layers are a copy of uzletipilota-fooldal/eszkoz/vegleges.css .hos (read 2026-11-02); the --szin-*
   tokens come from telepito.css, loaded before this file. The field is a fixed layer the size of the window, as the
   /vegleges/ hero is about one window: the text column stays on blue and indigo, the warm colours sit behind the white
   order card and the payment box. Only pages whose main is .rendeles or .fizetes get it (the thank-you page keeps the
   light ground); a browser without :has keeps the light ground too. */
body:has(> main.rendeles),body:has(> main.fizetes){background:#1B23A6}
body:has(> main.rendeles)::before,body:has(> main.fizetes)::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:
  radial-gradient(34% 46% at 66% 0%,rgba(var(--szin-borostyan),1),rgba(var(--szin-borostyan),.55) 42%,transparent 74%),
  radial-gradient(30% 56% at 100% 16%,rgba(var(--szin-korall),1),rgba(var(--szin-korall),.5) 48%,transparent 76%),
  radial-gradient(36% 46% at 96% 70%,rgba(var(--szin-magenta),.95),rgba(var(--szin-magenta),.4) 50%,transparent 74%),
  radial-gradient(36% 42% at 62% 82%,rgba(var(--szin-ibolya),.9),transparent 72%),
  radial-gradient(30% 34% at 20% 100%,rgba(var(--szin-korall),.75),transparent 72%),
  radial-gradient(22% 30% at 80% 44%,rgba(var(--szin-cian),.6),transparent 72%),
  radial-gradient(56% 74% at 0% 0%,rgba(var(--szin-kek),1),rgba(var(--szin-kek),.6) 40%,transparent 72%),
  linear-gradient(165deg,#2338D8 0%,#1B23A6 38%,#2A1C94 66%,#4A1F96 100%)}
@media (max-width:860px){
  /* phone: one column, the text on top on blue, the warm colours low in the window behind the card */
  body:has(> main.rendeles)::before,body:has(> main.fizetes)::before{background:
    radial-gradient(240px 190px at 82% calc(100% - 170px),rgba(var(--szin-borostyan),1),rgba(var(--szin-borostyan),.5) 46%,transparent 76%),
    radial-gradient(220px 230px at 104% calc(100% - 160px),rgba(var(--szin-korall),1),rgba(var(--szin-korall),.45) 50%,transparent 76%),
    radial-gradient(230px 210px at 0% calc(100% - 170px),rgba(var(--szin-magenta),.95),rgba(var(--szin-magenta),.4) 50%,transparent 76%),
    radial-gradient(150px 110px at 34% calc(100% - 200px),rgba(var(--szin-cian),.6),transparent 72%),
    radial-gradient(300px 260px at 100% 30%,rgba(var(--szin-ibolya),.9),transparent 74%),
    radial-gradient(260px 260px at 0% 100%,rgba(var(--szin-korall),.7),transparent 72%),
    radial-gradient(320px 300px at 100% 100%,rgba(var(--szin-magenta),.7),transparent 72%),
    radial-gradient(360px 260px at 0% 0%,rgba(var(--szin-kek),1),transparent 72%),
    linear-gradient(170deg,#2338D8 0%,#1B23A6 40%,#2A1C94 70%,#4A1F96 100%)}
}
/* text straight on the field: white and the light ink, as in the /vegleges/ hero; only where the field itself can show
   (Codex P2 on ec702c66fb: without :has the ground stays light, the text must stay dark) */
@supports selector(:has(*)){
  .rendeles-szoveg h1{color:#fff}
  .rendeles-szoveg .bevezeto,.rendeles-szoveg .megjegyzes{color:var(--on-ink)}
  .rendeles-szoveg .arak,.rendeles-szoveg .arak div{border-color:rgba(255,255,255,.22)}
  .rendeles-szoveg .arak dt,.rendeles-szoveg .arak dd{color:#fff}
  .rendeles-szoveg .arak dd span{color:var(--on-ink)}
  .rendeles-szoveg a,.fizetes>.megjegyzes a,.tartalek.halk button{color:var(--pl-jel)}
  .rendeles-szoveg a:hover,.fizetes>.megjegyzes a:hover{color:#fff}
  .fizetes>.megjegyzes,.tartalek.halk{color:var(--on-ink)}
}
/* the payment page: the lock box, the embedded checkout and the fallback sit on white cards */
.fizetes .zarolas{border-radius:14px;box-shadow:0 30px 60px -40px rgba(7,12,24,.5)}
.fizetes .checkout{background:#fff;border-radius:14px;padding:8px;box-shadow:0 30px 60px -40px rgba(7,12,24,.5)}
.tartalek:not(.halk){background:#fff;border-color:transparent}
/* foreign-order branch (card 2f3252c2, Zoltán TG 68022): the country list framed like the inputs (#6E7A90, 4.33:1), the small link line under the tax number */
.mezo select{width:100%;font:inherit;font-size:1rem;min-height:48px;padding:11px 14px;border:1.5px solid #6E7A90;border-radius:8px;background:#fff;color:var(--tinta)}
.mezo select:focus-visible{border-color:var(--tinta);outline:3px solid rgba(255,176,32,.55);outline-offset:1px}
.mezo-hibas select{border-color:var(--piros)}
.kulfold-link{margin:6px 0 0;font-size:.92rem}
.kulfold-link a{color:var(--tinta);font-weight:600}