:root{--blue:#0b5cad;--blue-dark:#084a8a;--blue-light:#e8f1fb;--ink:#1f2933;--muted:#6b7785;--line:#dde3ea;--bg:#f3f6f9;--ok:#1b7f4c;--ok-bg:#e3f5ea;--warn:#9a6700;--warn-bg:#fff4d6;--bad:#b42318;--bad-bg:#fde8e6;--info:#0b5cad;--info-bg:#e8f1fb;--radius:10px}
*{box-sizing:border-box}
html{font-size:16px}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.5}
a{color:var(--blue)}
h1{font-size:1.6rem;margin:0 0 .75rem}h2{font-size:1.15rem;margin:1.25rem 0 .5rem}h3{font-size:1rem;margin:1rem 0 .4rem}
h1:first-child,h2:first-child{margin-top:0}
.container{max-width:1040px;margin:0 auto;padding:0 1rem}
.container.wide{max-width:1320px}
.site-header,.bo-header{background:#fff;border-bottom:3px solid var(--blue)}
.site-header .container,.bo-header .container{display:flex;align-items:center;gap:1.5rem;min-height:64px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink)}
.brand-mark{font-size:1.6rem}
.brand-text{display:flex;flex-direction:column;line-height:1.15}
.brand-text strong{font-size:1.05rem}.brand-text span:last-child{font-size:.8rem;color:var(--muted)}
.site-nav,.bo-nav{margin-left:auto;display:flex;gap:1rem;flex-wrap:wrap}
.site-nav a,.bo-nav a{text-decoration:none;color:var(--ink);font-weight:500;padding:.25rem 0;border-bottom:2px solid transparent}
.site-nav a:hover,.bo-nav a:hover{border-color:var(--blue)}
.bo-nav{margin-left:1rem}
.bo-user{margin-left:auto;display:flex;align-items:center;gap:.75rem;font-size:.9rem}
.bo-user a{text-decoration:none;color:var(--ink)}
main{padding:1.5rem 1rem 3rem}
.site-footer,.bo-footer{color:var(--muted);font-size:.85rem;padding:1rem 0 2rem}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;margin-bottom:1.25rem}
.card.narrow{max-width:560px;margin-left:auto;margin-right:auto}
.card.auth{margin-top:2rem}
.card.side{background:var(--blue-light);border-color:#cfe0f5}
.center{text-align:center}
.lead{font-size:1.05rem;color:#344054}
.muted{color:var(--muted)}.small{font-size:.9rem}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.02em}
.big{font-size:1.3rem}
.wrap{white-space:pre-wrap;word-break:break-word}
.upper{text-transform:uppercase}
.icon-big{font-size:3rem;margin-bottom:.5rem}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;align-items:start}
.grid-2.wide-left{grid-template-columns:3fr 2fr}
.public .grid-2{grid-template-columns:3fr 2fr}
@media (max-width:820px){.grid-2,.grid-2.wide-left,.public .grid-2{grid-template-columns:1fr}}
.form .field{margin-bottom:1rem}
.form label{display:block;font-weight:600;margin-bottom:.3rem}
.form .field.checkbox label,.form .inline-label,.radio-row label{font-weight:400;display:flex;gap:.5rem;align-items:flex-start}
.radio-row{display:flex;gap:1.5rem;flex-wrap:wrap}
.inline-label{display:inline-flex;margin-right:1rem}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],select,textarea{width:100%;padding:.6rem .7rem;border:1px solid #b9c3cf;border-radius:6px;font:inherit;background:#fff}
input:focus,select:focus,textarea:focus{outline:2px solid var(--blue);outline-offset:1px;border-color:var(--blue)}
textarea{resize:vertical}
.hint{margin:.3rem 0 0;font-size:.85rem;color:var(--muted)}
.req{color:var(--bad)}
.field-error{margin:.3rem 0 0;color:var(--bad);font-size:.9rem;font-weight:500}
.hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden}
.btn{display:inline-block;padding:.55rem 1rem;border:1px solid #b9c3cf;border-radius:6px;background:#fff;color:var(--ink);font:inherit;font-weight:600;cursor:pointer;text-decoration:none;line-height:1.2}
.btn:hover{background:#f1f4f8}
.btn-primary{background:var(--blue);border-color:var(--blue);color:#fff}.btn-primary:hover{background:var(--blue-dark)}
.btn-danger{background:var(--bad);border-color:var(--bad);color:#fff}.btn-danger:hover{background:#8f1c13}
.btn-lg{padding:.8rem 1.4rem;font-size:1.05rem}
.btn-sm{padding:.3rem .6rem;font-size:.85rem}
.btn-link{background:none;border-color:transparent;color:var(--blue);font-weight:500;padding-left:.25rem;padding-right:.25rem}
.inline{display:inline}
.inline-form{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.inline-form input{flex:1;min-width:200px}
.alert{padding:.8rem 1rem;border-radius:6px;margin-bottom:1rem;border:1px solid transparent}
.alert-error{background:var(--bad-bg);color:var(--bad);border-color:#f4c7c3}
.alert-success{background:var(--ok-bg);color:var(--ok);border-color:#bfe6cd}
.alert-info{background:var(--info-bg);color:var(--info);border-color:#c8dcf3}
.badge{display:inline-block;padding:.15rem .55rem;border-radius:999px;font-size:.78rem;font-weight:600;white-space:nowrap;vertical-align:middle}
.badge-ok{background:var(--ok-bg);color:var(--ok)}.badge-warn{background:var(--warn-bg);color:var(--warn)}.badge-bad{background:var(--bad-bg);color:var(--bad)}.badge-info{background:var(--info-bg);color:var(--info)}.badge-muted{background:#e9edf1;color:var(--muted)}
.steps{padding-left:1.2rem}.steps li{margin-bottom:.5rem}
.dl{display:grid;grid-template-columns:max-content 1fr;gap:.35rem 1rem;margin:0}
.dl dt{color:var(--muted);font-weight:500}.dl dd{margin:0}
.table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:.93rem}
.table th,.table td{padding:.6rem .7rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.table th{background:#f7f9fb;font-weight:600;font-size:.85rem;color:#344054}
.table tr:last-child td{border-bottom:0}
.table.compact th,.table.compact td{padding:.4rem .5rem;font-size:.88rem}
.filters{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
.filters input[type=text]{flex:1;min-width:220px}.filters select{width:auto}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.page-head h1{margin:0}
.pagination{display:flex;gap:1rem;align-items:center;margin:1rem 0;font-size:.9rem}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.75rem;margin-bottom:1.25rem}
.tile{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1rem;text-decoration:none;color:var(--ink);display:flex;flex-direction:column}
a.tile:hover{border-color:var(--blue)}
.tile-n{font-size:1.9rem;font-weight:700;color:var(--blue)}.tile-l{font-size:.85rem;color:var(--muted)}
.action-box{border:1px solid var(--line);border-radius:8px;padding:1rem;margin-top:1rem;background:#fafbfc}
.action-box.danger{border-color:#f4c7c3}
.timeline{list-style:none;padding:0;margin:0 0 1rem}
.timeline li{display:grid;grid-template-columns:150px 1fr;gap:.75rem;padding:.5rem 0;border-bottom:1px solid var(--line);font-size:.92rem}
.timeline time{color:var(--muted);font-size:.82rem}
.timeline .note{margin:.25rem 0 0;white-space:pre-wrap;background:#f7f9fb;padding:.4rem .6rem;border-radius:6px}
.voucher-code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:1.5rem;font-weight:700;letter-spacing:.08em}
.actions{display:flex;gap:.5rem;flex-wrap:wrap}
hr{border:0;border-top:1px solid var(--line);margin:1.5rem 0}
fieldset{border:0;padding:0;margin:0 0 1rem}legend{font-weight:600;margin-bottom:.3rem}

/* ===================== Public site: mobile-first PWA styling ===================== */
.public{background:linear-gradient(180deg,#e8f1fb 0,#f3f6f9 260px)}
.public main{padding:1rem 1rem calc(4.5rem + env(safe-area-inset-bottom))}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:.5rem 1rem;z-index:100}
.skip:focus{left:1rem}
.public .site-header{position:sticky;top:0;z-index:20;box-shadow:0 1px 4px rgba(0,0,0,.06);padding-top:env(safe-area-inset-top)}
.public .site-header .container{min-height:60px;gap:1rem}
.brand-logo{width:40px;height:40px;border-radius:10px}
.public .site-nav a{padding:.4rem .2rem}
.public .site-nav a[aria-current]{border-color:var(--blue);color:var(--blue)}
.hero{padding:.5rem 0 1rem}
.hero h1{font-size:clamp(1.45rem,4.5vw,2rem);line-height:1.2;margin-bottom:.4rem}
.hero .lead{margin:0 0 1rem}
.hero.compact{padding:.25rem 0 .5rem}
.stepper{list-style:none;display:flex;gap:0;padding:0;margin:.5rem 0 0;counter-reset:step;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.stepper::-webkit-scrollbar{display:none}
.stepper li{flex:1 0 auto;min-width:92px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;padding:0 .25rem;font-size:.78rem;color:var(--muted)}
.stepper li+li::before{content:"";position:absolute;left:-50%;right:50%;top:14px;height:2px;background:#cfd8e3;z-index:0}
.stepper li.done+li::before,.stepper li.current+li::before{background:#cfd8e3}
.stepper li.done+li::before{background:var(--blue)}
.step-n{position:relative;z-index:1;width:28px;height:28px;border-radius:50%;background:#fff;border:2px solid #cfd8e3;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem;margin-bottom:.35rem;color:var(--muted)}
.stepper li.done .step-n{background:var(--blue);border-color:var(--blue);color:#fff}
.stepper li.current .step-n{border-color:var(--blue);color:var(--blue);box-shadow:0 0 0 4px rgba(11,92,173,.15)}
.stepper li.current{color:var(--ink);font-weight:600}
.step-t small{display:block;font-weight:400;color:var(--muted);font-size:.7rem;line-height:1.2}
.form-card{padding:1.25rem}
.form-section{font-size:.85rem;text-transform:uppercase;letter-spacing:.06em;color:var(--blue);margin:1.25rem 0 .6rem;padding-bottom:.3rem;border-bottom:1px solid var(--line)}
.form-section:first-of-type{margin-top:0}
.public input[type=text],.public input[type=email],.public input[type=tel]{min-height:48px;font-size:1rem;border-radius:8px}
.field.has-error input{border-color:var(--bad);background:#fffafa}
.optional{font-weight:400;color:var(--muted);font-size:.85rem}
.declaration label{align-items:flex-start;font-size:.92rem;line-height:1.45;background:#f7f9fb;padding:.8rem;border-radius:8px;border:1px solid var(--line)}
.declaration input{width:20px;height:20px;flex:0 0 20px;margin-top:.15rem}
.btn-block{display:block;width:100%;text-align:center}
.btn.is-busy{opacity:.7;position:relative}
.btn.is-busy::after{content:"";position:absolute;right:1rem;top:50%;width:16px;height:16px;margin-top:-8px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.submit-bar{margin-top:1.25rem}
.accordion{padding:0;overflow:hidden}
.accordion summary{padding:1rem 1.25rem;font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}
.accordion summary::-webkit-details-marker{display:none}
.accordion summary::after{content:"+";font-size:1.3rem;color:var(--blue)}
.accordion[open] summary::after{content:"–"}
.accordion>*:not(summary){padding:0 1.25rem 1rem;margin:0}
.accordion .steps{padding-left:2.4rem}
.side-cta{background:var(--blue);color:#fff;border-color:var(--blue)}
.side-cta p{margin:.25rem 0 .75rem;opacity:.9}
.side-cta .btn{background:#fff;color:var(--blue);border-color:#fff}
.result{padding:2rem 1.5rem}
.ref-box{background:var(--blue-light);border:1px dashed var(--blue);border-radius:10px;padding:.75rem 1rem;color:var(--muted);font-size:.9rem}
.ref-box strong{display:block;font-size:1.45rem;color:var(--ink);letter-spacing:.05em}
.nowrap{white-space:nowrap}
.status-card .status-line{font-size:1.1rem;font-weight:600;padding:.75rem 1rem;border-radius:8px;background:var(--info-bg);color:var(--info);margin:0 0 1rem}
.status-card .status-line.ok{background:var(--ok-bg);color:var(--ok)}
.status-card .status-line.bad{background:var(--bad-bg);color:var(--bad)}
.next-step{margin-top:1rem;padding:.9rem 1rem;border-radius:8px;background:var(--warn-bg);border:1px solid #f0d58a}
.next-step.ok{background:var(--ok-bg);border-color:#bfe6cd}
.install-banner{position:fixed;left:.75rem;right:.75rem;bottom:calc(4rem + env(safe-area-inset-bottom));z-index:30;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.15);padding:.75rem;display:flex;gap:.75rem;align-items:center}
.install-banner[hidden]{display:none}
.install-banner div{flex:1;font-size:.9rem;line-height:1.3}
.mobile-nav{display:none}
.offline-bar{background:#fff4d6;color:#7a5200;text-align:center;padding:.5rem;font-size:.9rem}
.offline-bar[hidden]{display:none}
.is-offline .submit-bar .btn{opacity:.5;pointer-events:none}
@media (max-width:720px){
  .public .site-nav{display:none}
  .public .grid-2{display:block}
  .side{margin-top:1rem}
  .mobile-nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:25;background:#fff;border-top:1px solid var(--line);padding:.35rem 0 calc(.35rem + env(safe-area-inset-bottom))}
  .mobile-nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:.1rem;text-decoration:none;color:var(--muted);font-size:.75rem;font-weight:600;padding:.25rem 0}
  .mobile-nav a span{font-size:1.25rem}
  .mobile-nav a[aria-current]{color:var(--blue)}
  .submit-bar{position:sticky;bottom:calc(3.6rem + env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(255,255,255,0),#fff 30%);padding:.75rem 0 .25rem;margin:1rem -1.25rem 0;padding-left:1.25rem;padding-right:1.25rem}
  .dl{grid-template-columns:1fr}.dl dt{margin-top:.5rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.04em}
  .card{padding:1.1rem}
  .result{padding:1.5rem 1.1rem}
  .install-banner{bottom:calc(3.9rem + env(safe-area-inset-bottom))}
}
@media (display-mode:standalone){.public .site-header{padding-top:max(env(safe-area-inset-top),0px)}}
/* backoffice touch-ups */
.nav-dbm{color:var(--blue)!important}
.lookup-card{border-color:var(--blue);background:var(--blue-light)}
.lookup-card input{min-height:48px;font-size:1.05rem}
@media (max-width:820px){.bo-nav{margin-left:0;width:100%;gap:.75rem;font-size:.9rem}.bo-user{margin-left:0}.tiles{grid-template-columns:repeat(2,1fr)}.table{display:block;overflow-x:auto;white-space:nowrap}}

/* ---- confirmation dialog ---- */
.confirm-dialog{border:0;border-radius:14px;padding:0;max-width:min(520px,calc(100vw - 2rem));width:100%;box-shadow:0 20px 60px rgba(0,0,0,.3);color:var(--ink)}
.confirm-dialog::backdrop{background:rgba(15,23,42,.55);backdrop-filter:blur(2px)}
.confirm-box{margin:0;padding:1.5rem}
.confirm-head{display:flex;align-items:center;gap:.75rem;margin-bottom:.5rem}
.confirm-head h2{margin:0;font-size:1.2rem}
.confirm-icon{width:40px;height:40px;border-radius:50%;background:var(--info-bg);display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex:0 0 40px}
.confirm-icon::before{content:"?";font-weight:700;color:var(--info)}
.confirm-dialog.is-danger .confirm-icon{background:var(--bad-bg)}
.confirm-dialog.is-danger .confirm-icon::before{content:"!";color:var(--bad)}
.confirm-dialog.is-success .confirm-icon{background:var(--ok-bg)}
.confirm-dialog.is-success .confirm-icon::before{content:"✓";color:var(--ok)}
.confirm-message{margin:.25rem 0 1rem;color:#344054}
.confirm-details{display:grid;grid-template-columns:max-content 1fr;gap:.4rem 1rem;margin:0 0 1rem;padding:.9rem 1rem;background:#f7f9fb;border:1px solid var(--line);border-radius:10px;font-size:.93rem}
.confirm-details:empty{display:none}
.confirm-details dt{color:var(--muted)}
.confirm-details dd{margin:0;font-weight:600;white-space:pre-wrap;word-break:break-word;max-height:9rem;overflow:auto}
.confirm-details dd.is-empty{font-weight:400;color:var(--muted);font-style:italic}
.confirm-consequence{margin:0 0 1.25rem;padding:.7rem .9rem;border-radius:8px;background:var(--warn-bg);color:#7a5200;font-size:.92rem}
.confirm-consequence:empty{display:none}
.confirm-dialog.is-danger .confirm-consequence{background:var(--bad-bg);color:var(--bad)}
.confirm-dialog.is-success .confirm-consequence{background:var(--ok-bg);color:var(--ok)}
.confirm-actions{display:flex;justify-content:flex-end;gap:.6rem}
.confirm-dialog.is-danger [data-ok]{background:var(--bad);border-color:var(--bad)}
@media (max-width:520px){.confirm-details{grid-template-columns:1fr}.confirm-details dt{margin-top:.3rem}.confirm-actions{flex-direction:column-reverse}.confirm-actions .btn{width:100%}}

/* ---- sticky footer, legal pages, banner, OTP ---- */
html,body{height:100%}
body{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
main{flex:1 0 auto;width:100%}
.site-footer,.bo-footer{flex-shrink:0;margin-top:auto;border-top:1px solid var(--line);background:#fff}
.public .site-footer{padding-bottom:calc(1rem + env(safe-area-inset-bottom))}
.footer-links{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;margin-bottom:.4rem}
.footer-links a{color:var(--ink);text-decoration:none;font-weight:600;font-size:.9rem}
.footer-links a:hover{color:var(--blue);text-decoration:underline}
.legal{max-width:760px;margin:0 auto 1.25rem;line-height:1.65}
.legal h2{margin-top:1.5rem}.legal p{margin:0 0 1rem}.legal ul{margin:0 0 1rem}
.hero-banner{padding:0;overflow:hidden;margin:0 0 1rem;border-color:#cfe0f5}
.hero-banner-img{display:block;width:100%;height:auto;max-height:320px;object-fit:cover}
.hero-banner-body{padding:1rem 1.25rem;background:var(--blue);color:#fff}
.hero-banner-body h2{margin:0 0 .25rem;font-size:1.15rem;color:#fff}
.hero-banner-body p{margin:0;opacity:.95}
.banner-preview{max-width:100%;height:auto;border-radius:8px;border:1px solid var(--line)}
.otp-input{font-size:1.6rem;letter-spacing:.5em;text-align:center}
@media (max-width:720px){.public .site-footer{padding-bottom:calc(4.2rem + env(safe-area-inset-bottom))}}
.banner-image-field{padding:1rem;border:1px dashed #b9c3cf;border-radius:10px;background:#fafbfc}
.banner-image-field .banner-preview{display:block;max-height:180px;margin:.25rem 0 .75rem}
.banner-image-field input[type=file]{margin:.5rem 0}
