/* Portál - közös stíluslap (a CSP miatt nincs inline stílus és szkript).
   A megjelenés a honlap assets/css/main.css fájlját követi. A :root tokenjei
   onnan másoltak, változtatás nélkül; az egyezést a _server/portal-tests/run.php
   ellenőrzi. Új tokent csak a main.css-ben meglévő névvel és értékkel szabad
   felvenni. A portál saját szabályai a tokenekből dolgoznak. */

@font-face{font-family:'Noto Sans';src:url('fonts/noto-sans-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:optional;}
@font-face{font-family:'Noto Sans';src:url('fonts/noto-sans-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:optional;}
@font-face{font-family:'Noto Sans';src:url('fonts/noto-sans-900.woff2') format('woff2');font-weight:900;font-style:normal;font-display:optional;}

:root {
  --white: #fff;
  --color-primary-light: 34, 146, 212;
  --color-primary:       10, 116, 186;
  --color-primary-dark:  3, 67, 109;
  --color-action-light:  249, 168, 106;
  --color-action:        240, 124, 56;
  --color-action-dark:   192, 74, 22;
  --color-neutral-light: 245, 240, 225;
  --color-dark-light:    101, 107, 123;
  --color-dark:          64, 68, 79;
  --color-dark-dark:     42, 45, 52;
  --color-danger-light:  252, 235, 235;
  --color-danger:        217, 89, 76;
  --color-danger-dark:   185, 54, 39;
  --color-danger-bg-wan:  rgba(var(--color-danger-light),.75);
  --shadow-sm: 0 0.125rem 0.5rem rgba(6,123,194,0.08);
  --shadow:    0 0.25rem 1rem rgba(6,123,194,0.12);
  --shadow-dark:    0 0.25rem 1rem rgba(0, 0, 0, 0.12);
  --focus-ring-color: rgb(var(--color-action-dark));
  --focus-ring-contrast: var(--white);
  --focus-ring-width: .1875rem;
  --focus-ring-offset: .1875rem;
  --transition:        all .3s ease-in-out;
  --transition-slow:   all .5s ease-in-out;
  --transition-hover:  color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  --br-sm:     .5rem;
  --container-max: 1140px;
  --article-max: 760px;
  --text-size-base: 1.0625rem;
  --text-line-base: 1.9;
  --tone-base-text: rgb(var(--color-dark-dark));
  --tone-base-link: rgb(var(--color-primary));
  --tone-base-link-hover: rgb(var(--color-primary-dark));
  --tone-dark-bg: rgb(var(--color-dark-dark));
  --tone-dark-text: rgba(var(--color-neutral-light), .9);
  --tone-dark-heading:var(--white);
  --tone-dark-link: rgba(var(--color-neutral-light), .7);
  --tone-dark-link-hover: rgb(var(--color-neutral-light));
}

/* Alap: a honlap body-, link-, kép- és fókuszszabályai. */
*,::before,::after{box-sizing:border-box;}
body{margin:0;font-family:'Noto Sans',system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Liberation Sans",Arial,sans-serif;font-size:var(--text-size-base);line-height:var(--text-line-base);color:var(--tone-base-text);background-color:var(--white);-webkit-text-size-adjust:100%;text-size-adjust:100%;}
p{margin:0 0 1rem;}
a{color:var(--tone-base-link);text-decoration:none;transition:var(--transition);}
a:hover{color:var(--tone-base-link-hover);transition:var(--transition-slow);}
img{max-width:100%;height:auto;border-radius:var(--br-sm);}

:where(a[href],button,input:not([type="hidden"]),select,textarea,[tabindex]:not([tabindex="-1"])):focus-visible{
  outline:var(--focus-ring-width) solid var(--focus-ring-color) !important;
  outline-offset:var(--focus-ring-offset);
  box-shadow:0 0 0 .125rem var(--focus-ring-contrast) !important;
}

.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:.75rem;}
.section{padding:3rem 0 4.5rem;}
.article-shell{max-width:var(--article-max);margin-inline:auto;}

h1{margin:0 0 2rem;font-size:clamp(2.1rem, 3vw, 3.2rem);line-height:1.4;font-weight:900;background-image:linear-gradient(5deg, rgb(var(--color-primary-light)) 15%, rgb(var(--color-primary-dark)) 90%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* Fejléc: a honlap .navbar sávja, menü JavaScript nélkül. */
.navbar{height:70px;background-color:var(--white);border-bottom:1px solid rgba(var(--color-dark-light),.1);}
.navbar__inner{display:flex;align-items:center;justify-content:space-between;gap:0 1rem;height:100%;}
.navbar-brand{display:flex;align-items:center;padding:1rem 1rem 1rem 0;}
.navbar-brand img{display:block;width:auto;max-width:none;height:1.7rem;border-radius:0;}
.navbar-nav{display:flex;flex-wrap:wrap;gap:0 .5rem;margin:0;padding:0;list-style:none;}
.nav-link{display:block;padding:.5rem;color:rgb(var(--color-primary));font-weight:700;}
.nav-link.active,.nav-link:hover{color:rgb(var(--color-action-dark));}

/* Gombok: a honlap .btn, .btn-big és .btn-orange szabálya. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;text-align:center;color:#fff;font:inherit;font-size:1rem;font-weight:700;line-height:1.5;padding:.5rem 1.5rem;border:1px solid rgb(var(--color-primary));box-shadow:var(--shadow-sm);background-size:200% auto;border-radius:var(--br-sm);transition:var(--transition-hover),background-position .3s ease-in-out;background-repeat:no-repeat;cursor:pointer;}
.btn:hover{color:#fff;background-position:right center;box-shadow:var(--shadow);}
.btn-big{padding:.75rem 2.5rem;font-size:1rem;}
.btn-orange{color:#fff !important;background-color:rgb(var(--color-action-light));border-color:rgb(var(--color-action-light));background-image:linear-gradient(to left, rgb(var(--color-action-dark)), rgb(var(--color-action)), rgb(var(--color-action-dark)) );}
.btn-orange:hover{box-shadow:var(--shadow-dark);border-color:rgb(var(--color-action-light));}

/* Nyitóoldal. */
.home-urgent{margin-top:2rem;margin-bottom:.5rem;}
.home-phones{margin:0;padding:0;list-style:none;}
.home-phones a{font-weight:700;}

/* Hibaüzenet: a honlap .note--danger színvilága. */
.alert{margin:0 0 2rem;padding:1rem;background-color:var(--color-danger-bg-wan);border:1px solid rgba(var(--color-danger),.15);border-radius:var(--br-sm);}
.alert a{font-weight:700;}

/* Űrlap. A mezők halványszürke kitöltést kapnak, a fókusz a közös gyűrű. */
.lead{color:rgb(var(--color-dark-light));}
/* Sor: egy vagy két mező. 576 px felett a két mezős sor két oszlop; a mezők
   alulra igazodnak, így a címke feletti hibaüzenet nem csúsztatja el a párját. */
.form-row{display:grid;grid-template-columns:minmax(0,1fr);column-gap:1.25rem;}
.form-field{display:flex;flex-direction:column;margin-top:1.25rem;}
.form-field > input,.form-field > textarea{margin-top:auto;}
label{display:block;margin:0 0 .35rem;font-size:.875rem;font-weight:700;line-height:1.4;}
.field-hint{margin:0 0 .35rem;font-size:.875rem;line-height:1.4;color:rgb(var(--color-dark-light));}
.required{color:rgb(var(--color-danger-dark));}
input,textarea{display:block;width:100%;margin:0;padding:.55rem .85rem;border:1px solid transparent;border-radius:var(--br-sm);color:var(--tone-base-text);background-color:rgba(var(--color-dark-light),.08);font:inherit;font-size:1rem;line-height:1.5;transition:var(--transition-hover);}
input:hover,textarea:hover{border-color:rgba(var(--color-dark-light),.2);}
input:focus,textarea:focus{background-color:var(--white);border-color:rgb(var(--color-primary-light));outline:0;}
::placeholder{color:rgb(var(--color-dark-light));opacity:.8;}
textarea{min-height:8rem;resize:vertical;}
[aria-invalid="true"],input:user-invalid,textarea:user-invalid{border-color:rgb(var(--color-danger-dark));background-color:var(--color-danger-bg-wan);}
.field-error{margin:0 0 .35rem;font-size:.875rem;line-height:1.4;color:rgb(var(--color-danger-dark));}
.checkbox-label{display:flex;gap:.6rem;align-items:flex-start;margin-top:1.5rem;font-size:.875rem;font-weight:400;}
.checkbox-label input{flex:none;width:1.125rem;height:1.125rem;margin-top:.3rem;accent-color:rgb(var(--color-primary));}
.field-error--checkbox{margin:1.5rem 0 .35rem;}
.field-error--checkbox + .checkbox-label{margin-top:0;}
form .alert{margin:1.5rem 0 0;}
.form-submit{margin:2rem 0 0;}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

/* Lábléc: a honlap #footer szabályai, 768 px felett. */
#footer{font-size:1rem;color:var(--tone-dark-text);background-color:var(--tone-dark-bg);}
#footer a{color:var(--tone-dark-link);}
#footer a:hover{color:var(--tone-dark-link-hover);}
#footer p{margin-bottom:0;}
.footer-main{padding:3rem 0;}
.footer-grid{display:grid;grid-template-columns:1fr;column-gap:1.5rem;}
.footer-title{margin:1rem 0 1.5rem;font-size:.875rem;font-weight:700;line-height:1.2;text-transform:uppercase;letter-spacing:.03em;color:var(--tone-dark-heading);}
.footer-list{margin:0;padding:0;list-style:none;}
.footer-list li{margin-bottom:.5rem;}
.footer-list li:last-child{margin-bottom:0;}
.footer-address__part{display:inline-block;}
.time-card__open{display:flex;flex-direction:column;align-items:flex-start;}
.time-card__val{font-weight:700;white-space:nowrap;}
#copyright{padding-bottom:3rem;font-size:.875rem;}
.copyright-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 1.25rem;padding-top:1rem;border-top:1px solid rgba(var(--color-neutral-light),.2);}
.cblink{text-align:end;}

@media (min-width: 576px) {
  .form-row{grid-template-columns:none;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;}
}

@media (min-width: 768px) {
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (min-width: 992px) {
  .footer-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}

/* Lábléc mobilon: a honlap 768 px alatti szabályai (panel, gombformájú telefonszámok). */
@media (max-width: 767.98px) {
  .footer-main{padding:1.5rem 0;}
  #copyright{padding-bottom:1.5rem;}
  #footer,#footer a{font-size:.875rem;}
  .footer-grid{row-gap:3rem;}
  .footer-title{display:inline-flex;margin-top:0;padding-bottom:.25rem;font-size:1rem;}
  .footer-list li{margin-bottom:1.5rem;}
  .footer-phone{text-align:center;}
  .footer-action{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:.5rem 1.25rem;border:1px solid rgba(var(--color-neutral-light),.3);border-radius:var(--br-sm);}
  .footer-time-card{padding:1rem;background:rgba(var(--color-neutral-light),.07);border-radius:var(--br-sm);}
  .time-card__open{flex-direction:row;justify-content:space-between;align-items:center;gap:.5rem;padding:.5rem 0;}
  .time-card__open + .time-card__open{border-top:1px solid rgba(var(--color-neutral-light),.12);}
}

/* Mobil: a logó és a menü egy sorban, kisebb menübetűvel; nagyon keskeny
   kijelzőn a menü a logó alá törik. Az űrlap gombja teljes szélességű. */
@media (max-width: 575.98px) {
  .navbar{height:auto;}
  .navbar__inner{flex-wrap:wrap;min-height:70px;}
  .navbar-nav{gap:0 .25rem;}
  .nav-link{padding:.5rem .4rem;font-size:.875rem;}
  .section{padding:2rem 0 3rem;}
  .form-submit .btn{width:100%;}
  #copyright{text-align:center;}
  .copyright-row{flex-direction:column;align-items:center;}
  .cblink{text-align:center;margin-top:.5rem;}
}