/* Vienna Summer Music Festival: apply and status pages. Owner 2026-10-28: Apple Human Interface Guidelines in the
   festival's colours, light and dark (the device setting decides). System font for everything people read; Cinzel
   only for the festival's name. 17px body, 50px buttons, 44px touch targets, text contrast at least 4.5:1. */
/* Cinzel (festival wordmark only). Each weight keeps the metrics set on 2026-10-28 so the header keeps its size. */
@font-face{font-family:'Cinzel';font-style:normal;font-weight:700 800;font-display:swap;size-adjust:99.3%;ascent-override:108.7%;descent-override:25.2%;line-gap-override:0%;src:url(/assets/fonts/cinzel-latin-ext.woff2) format('woff2');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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Cinzel';font-style:normal;font-weight:700 800;font-display:swap;size-adjust:99.3%;ascent-override:108.7%;descent-override:25.2%;line-gap-override:0%;src:url(/assets/fonts/cinzel-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:"Cinzel Fallback";font-weight:600 900;src:local("Georgia Bold");size-adjust:106.8%;ascent-override:91.4%;descent-override:34.8%;line-gap-override:0%}

:root{
  color-scheme:light;
  /* light: warm ivory, white panels, festival burgundy */
  --bg:#f7f4ee; --cell:#ffffff; --field:#ffffff; --bar:rgba(247,244,238,.94);
  --text:#1c1714; --sec:#5f554b; --sep:#ddd5c8; --field-line:#cfc6b8;
  --tint:#9a0f2e; --on-tint:#ffffff; --tint-soft:rgba(154,15,46,.10); --brand:#9a0f2e;
  --badge-bg:#f6e7c1; --badge-fg:#6b4a0b; --track:#e3ddd3; --off:#d9d1c4;
  --ok:#2e6b34; --ok-bg:#e3f1e4; --bad:#b3261e; --bad-bg:#fbe4e2;
  --shadow:0 1px 2px rgba(28,23,20,.06),0 1px 1px rgba(28,23,20,.04);
  --sc:"Cinzel","Cinzel Fallback",Georgia,serif;
  --ui:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --body:var(--ui);
}
@media (prefers-color-scheme:dark){
  :root{
    color-scheme:dark;
    /* dark: the festival's near-black, gold */
    --bg:#08060a; --cell:#17121a; --field:#1f1822; --bar:rgba(8,6,10,.94);
    --text:#f8efde; --sec:#cbbba0; --sep:#3a2f22; --field-line:#4a3d2c;
    --tint:#ecbb52; --on-tint:#1d1306; --tint-soft:rgba(236,187,82,.14); --brand:#ecbb52;
    --badge-bg:#3a2d10; --badge-fg:#ffe6a6; --track:#3a2f22; --off:#3f3528;
    --ok:#8bd08f; --ok-bg:rgba(139,208,143,.14); --bad:#ff8f8f; --bad-bg:rgba(255,143,143,.14);
    --shadow:none;
  }
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font:400 17px/1.47 var(--ui);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:var(--tint)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid color-mix(in srgb,var(--tint) 45%,transparent);outline-offset:2px}
.wrap{width:min(1100px,100% - 40px);margin-inline:auto}
.narrow{width:min(820px,100% - 40px);margin-inline:auto}
.skip{position:absolute;left:-9999px;top:0;background:var(--tint);color:var(--on-tint);padding:10px 14px;z-index:100;border-radius:10px}
.skip:focus{left:12px;top:12px}
.foil{background:none;color:inherit}
.hidden{display:none !important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* header */
.site-head{position:sticky;top:0;z-index:10;border-bottom:1px solid var(--sep);background:var(--bar);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px)}
.bar{display:flex;align-items:center;gap:18px;min-height:60px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);margin-right:auto}
.brand img{width:26px;height:32px}
.brand span{font:700 14px/1.15 var(--sc);letter-spacing:.06em;color:var(--brand);border-left:1px solid var(--sep);padding-left:12px;white-space:nowrap}
.brand small{display:block;font:500 14px/1.3 var(--ui);letter-spacing:0;color:var(--sec);margin-top:2px}
.safe{font:400 15px var(--ui);color:var(--sec);display:flex;align-items:center;gap:8px}
.safe b{background:var(--ok-bg);color:var(--ok);padding:3px 9px;border-radius:999px;font-size:14px;font-weight:600}

/* hero */
.hero{padding:30px 0 6px}
.hero h1{font:700 clamp(30px,4.4vw,44px)/1.12 var(--ui);letter-spacing:.003em;margin:12px 0 6px}
.tagline{font:400 19px/1.35 var(--ui);color:var(--sec)}
.lede{font-size:17px;line-height:1.47;max-width:60ch;color:var(--sec);margin-top:10px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{font:600 14px/1 var(--ui);padding:7px 10px;border-radius:8px;background:var(--badge-bg);color:var(--badge-fg)}
.act-label{font:600 14px var(--ui);text-transform:uppercase;letter-spacing:.03em;color:var(--sec)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font:600 17px/1.2 var(--ui);letter-spacing:0;padding:0 22px;border:0;border-radius:12px;cursor:pointer;text-align:center;min-height:50px}
.btn-gold{background:var(--tint);color:var(--on-tint)}
.btn-gold:hover{filter:brightness(1.06)}
.btn-gold[disabled]{opacity:.6;cursor:wait}
.btn-line{background:var(--tint-soft);color:var(--tint)}
.btn-line:hover{filter:brightness(1.04)}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}

/* layout */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:start;padding:22px 0 80px}
aside .card+.card{margin-top:14px}
.card{background:var(--cell);border-radius:16px;padding:18px 20px 20px;box-shadow:var(--shadow)}
.card h2{font:600 19px/1.25 var(--ui);margin:0 0 10px;color:var(--text)}
.card p,.card li{color:var(--sec);font-size:16px}
.card ol{padding-left:20px;display:grid;gap:6px}
.sum{display:grid;grid-template-columns:1fr auto;gap:6px 12px;font-size:16px;font-variant-numeric:tabular-nums}
.sum dt{color:var(--sec)}
.sum dd{text-align:right;font-weight:600}
.sum .tot{border-top:1px solid var(--sep);padding-top:6px;color:var(--text)}

/* the form */
.form{background:var(--cell);border-radius:18px;padding:26px;text-align:left;box-shadow:var(--shadow)}
.form fieldset{border:0;border-top:1px solid var(--sep);padding:20px 0 8px}
.form fieldset:first-of-type{border-top:0;padding-top:0}
.form legend{font:600 20px var(--ui);padding-right:12px;color:var(--text)}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form label,.form .lbl{display:block;font:600 16px var(--ui);color:var(--text);margin:14px 0 6px}
.form input,.form select,.form textarea{width:100%;font:400 17px var(--ui);color:var(--text);background:var(--field);border:1px solid var(--field-line);border-radius:10px;padding:12px 14px;min-height:48px}
.form input[type=file]{padding:10px;font-size:16px}
.form textarea{min-height:120px;resize:vertical}
.form .hint{font-size:15px;color:var(--sec);margin-top:6px}
.form .opt{display:flex;align-items:flex-start;gap:12px;margin-top:14px;font:400 17px var(--ui);color:var(--text)}
.form .opt input{width:22px;height:22px;min-height:0;margin-top:2px;padding:0;flex:none;accent-color:var(--tint)}
/* scholarship: an iOS switch, text first */
.form .opt:has(input.switch){align-items:center;justify-content:space-between;flex-direction:row-reverse;background:var(--bg);border-radius:12px;padding:10px 14px;min-height:52px}
.form input.switch{-webkit-appearance:none;appearance:none;width:51px;height:31px;min-height:0;border:0;border-radius:16px;background:var(--off);position:relative;cursor:pointer;margin:0;transition:background .2s}
.form input.switch::before{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.25);transition:transform .2s}
.form input.switch:checked{background:var(--tint)}
.form input.switch:checked::before{transform:translateX(20px)}
/* program cards: who it is for, what you do, dates, price, early bird */
.form .pick{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:10px}
.form .pick .prog{position:relative;display:block;margin:0;padding:16px;border:1px solid var(--sep);border-radius:14px;background:var(--cell);cursor:pointer;font:400 16px/1.4 var(--ui);color:var(--text)}
.form .pick .prog:has(input:checked){border-color:var(--tint);box-shadow:0 0 0 1px var(--tint)}
.form .pick .prog:has(input:focus-visible){outline:3px solid color-mix(in srgb,var(--tint) 45%,transparent);outline-offset:2px}
.form .pick .prog input{position:absolute;opacity:0;width:1px;height:1px;min-height:0}
.prog-body{display:flex;flex-direction:column;gap:3px}
.prog-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.prog-head b{font:600 19px/1.25 var(--ui)}
.tick{width:24px;height:24px;flex:none;border-radius:50%;border:2px solid var(--off);display:grid;place-items:center}
.prog:has(input:checked) .tick{background:var(--tint);border-color:var(--tint)}
.prog:has(input:checked) .tick::after{content:"\2713";color:var(--on-tint);font:700 14px/1 var(--ui)}
.prog-who{font-weight:600;font-size:15px;color:var(--tint)}
.prog-what{font-size:15.5px;line-height:1.35;color:var(--sec)}
.form .pick em{display:block;font-style:normal;color:var(--text);font-size:15.5px;margin-top:4px}
.form .pick .price{color:var(--text);font-variant-numeric:tabular-nums}
.form .pick .price strong{font-weight:600}
.form .pick .price s{color:var(--sec);text-decoration-thickness:1px}
.form .pick .tier{display:inline-block;align-self:flex-start;font:600 13.5px var(--ui);padding:3px 8px;border-radius:6px;background:var(--badge-bg);color:var(--badge-fg);margin-top:6px}
.form .field-error{color:var(--bad);font:400 15px var(--ui);margin-top:6px}
.form .invalid{border-color:var(--bad)}
.upload-state{font:400 15px var(--ui);color:var(--sec);margin-top:6px}
.upload-state.ok{color:var(--ok)}
.upload-state.bad{color:var(--bad)}
.links-list{display:grid;gap:8px}
.add-link{margin-top:10px;font:600 15px var(--ui);background:var(--tint-soft);border:0;border-radius:10px;color:var(--tint);padding:10px 14px;min-height:44px;cursor:pointer}
.submit{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;margin-top:22px}
.secure{font-size:15px;color:var(--sec);max-width:44ch}
.notice{background:var(--cell);border-left:4px solid var(--tint);border-radius:12px;padding:14px 18px;font-size:17px;margin:0 0 18px;box-shadow:var(--shadow)}
.notice.bad{border-left-color:var(--bad);background:var(--bad-bg)}
.notice b{display:block;font:600 14px var(--ui);text-transform:uppercase;letter-spacing:.03em;color:var(--sec);margin-bottom:4px}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* steps */
.steps{list-style:none;counter-reset:s;margin-top:20px;display:grid;grid-template-columns:repeat(6,1fr);gap:0 8px}
.steps li{counter-increment:s;padding-top:10px;border-top:4px solid var(--track);font:400 15px/1.35 var(--ui);color:var(--sec)}
.steps li::before{content:counter(s) ". ";font-weight:700;color:var(--tint)}
.steps li.now{border-color:var(--tint);color:var(--text)}
.steps li.done{border-color:var(--ok)}
.steps li small{display:block;font-size:14px;color:var(--sec)}

/* status page */
.pay{list-style:none;display:grid}
.pay li{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--sep)}
.pay li:first-child{border-top:0}
.pay b{font:600 17px var(--ui)}
.pay small{display:block;color:var(--sec);font-size:15px}
.pay .amt{font:600 19px var(--ui);font-variant-numeric:tabular-nums}
.tag{font:600 14px var(--ui);border-radius:999px;padding:4px 10px;background:var(--badge-bg);white-space:nowrap;color:var(--badge-fg)}
.tag.paid{background:var(--ok-bg);color:var(--ok)}
.tag.failed{background:var(--bad-bg);color:var(--bad)}
.total{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding-top:12px;border-top:1px solid var(--sep)}
.total span{font:700 24px var(--ui);font-variant-numeric:tabular-nums}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.files{list-style:none;display:grid;gap:8px}
.files li{display:flex;justify-content:space-between;gap:10px;background:var(--bg);border-radius:10px;padding:12px 14px;font-size:16px}
.files li span{color:var(--ok);font:600 14.5px var(--ui)}
.status-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;padding:28px 0 80px;align-items:start}
.status-grid section+section{margin-top:22px}
.resend{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.resend input{flex:1 1 220px;font:400 17px var(--ui);color:var(--text);background:var(--field);border:1px solid var(--field-line);border-radius:10px;padding:12px 14px;min-height:48px}

/* journey: start, code, saved form */
.linkbtn{background:none;border:0;color:var(--tint);font:400 17px var(--ui);text-decoration:none;cursor:pointer;padding:10px 4px;min-height:44px}
.linkbtn:hover{text-decoration:underline}
.site-head .linkbtn{font:400 15px var(--ui);background:var(--tint-soft);border-radius:10px;padding:8px 12px;min-height:40px;white-space:nowrap;flex:none}
.refs{margin-top:6px}
.refs .hint{margin-top:0}
.stage{animation:stage-in .25s ease-out}
@keyframes stage-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.stage{animation:none}.form input.switch,.form input.switch::before{transition:none}}
.stage-title{font:700 26px/1.2 var(--ui);color:var(--text);margin:0 0 8px}
.form .stage-title+.hint{margin:0 0 6px;font-size:17px}
.switch:not(input){margin-top:18px;color:var(--sec);font-size:16px}
.note{font-size:15px;color:var(--sec);border-left:2px solid var(--sep);padding:4px 0 4px 12px;margin-top:14px}
.code-input{font:600 28px/1 var(--ui) !important;letter-spacing:.3em;font-variant-numeric:tabular-nums;text-align:center;max-width:320px;padding:14px 10px 14px 20px !important;border:2px solid var(--tint) !important;border-radius:12px !important}
.resend .code-input{flex:0 1 240px;font-size:24px !important}
.apps{list-style:none;display:grid;gap:10px;margin-top:10px}
.apps li{display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--bg);border-radius:12px;padding:12px 14px}
.apps b{display:block;font:600 18px var(--ui);font-variant-numeric:tabular-nums}
.apps small{display:block;color:var(--sec);font-size:15px}
.apps .btn{min-height:44px;padding:0 16px;flex:none}
.app-bar{position:sticky;top:61px;z-index:5;display:grid;grid-template-columns:auto 1fr auto;gap:8px 20px;align-items:center;background:var(--bar);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);border:1px solid var(--sep);border-radius:14px;padding:12px 16px;margin-bottom:14px}
.app-id small{display:block;font:400 14px var(--ui);color:var(--sec)}
.app-id b{font:600 19px var(--ui);letter-spacing:0;font-variant-numeric:tabular-nums;color:var(--text);margin-right:10px;white-space:nowrap}
.app-id span{color:var(--sec);font-size:15px}
.progress,.bar-track{height:6px;background:var(--track);border-radius:3px;overflow:hidden}
.progress span,.bar-track span{display:block;height:100%;background:var(--tint);border-radius:3px;transition:width .4s ease}
.progress-text{font:400 15px var(--ui);color:var(--sec);text-align:right;white-space:nowrap}
.progress-text #progress-pct{color:var(--text);font-weight:600}
.saved{display:block;font-size:15px;color:var(--ok)}
.saved.bad{color:var(--bad)}
.w0{width:0%}.w5{width:5%}.w10{width:10%}.w15{width:15%}.w20{width:20%}.w25{width:25%}.w30{width:30%}.w35{width:35%}.w40{width:40%}.w45{width:45%}.w50{width:50%}.w55{width:55%}.w60{width:60%}.w65{width:65%}.w70{width:70%}.w75{width:75%}.w80{width:80%}.w85{width:85%}.w90{width:90%}.w95{width:95%}.w100{width:100%}
.uploads{display:grid;gap:14px;margin-top:14px}
.up label{display:block;font:600 16px var(--ui);color:var(--text);margin-bottom:6px}
.up input[type=file]{width:100%;font:400 16px var(--ui);color:var(--text);background:var(--field);border:1px solid var(--field-line);border-radius:10px;padding:10px;min-height:44px}
.bar-track{margin-top:8px}
.files .empty{color:var(--sec)}
.picker,.signin{margin:30px 0 80px;max-width:640px}
.signin .note{flex:1 1 100%;margin:0 0 4px;border:0;padding:0}
.signin .switch{flex:1 1 100%;margin-top:4px}
.signin .field-error{flex:1 1 100%;color:var(--bad);font:400 15px var(--ui)}
#uploads-signin .btn{margin-top:10px}
@media (max-width:560px){
  .app-bar{grid-template-columns:minmax(0,1fr) auto;padding:10px 14px}
  .progress-text{white-space:normal;max-width:10em}
  .app-bar .progress{grid-column:1/-1;grid-row:2}
  .app-id span{display:none}
  .app-id b{font-size:17px}
  .apps li{flex-wrap:wrap}
  .apps .btn{width:100%}
  .code-input{max-width:none}
  .stage-title{font-size:24px}
  .site-head .linkbtn{padding:6px 10px}
}
@media (max-width:420px){
  .bar{gap:12px}
  .safe:has(~.linkbtn:not(.hidden)){display:none}
}

/* footer */
.site-foot{border-top:1px solid var(--sep);padding:26px 0;color:var(--sec);font-size:15px}
.site-foot .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px}

@media (max-width:900px){
  .layout,.status-grid{grid-template-columns:minmax(0,1fr)}
  .steps{grid-template-columns:repeat(3,1fr);row-gap:14px}
}
@media (max-width:560px){
  .wrap,.narrow{width:calc(100% - 32px)}
  .form{padding:18px 16px;border-radius:16px}
  .form .row,.form .pick{grid-template-columns:1fr}
  .steps li small{display:none}
  .safe span{display:none}
  .btn{width:100%}
  .pay li{grid-template-columns:1fr auto}
  .pay .tag{grid-column:1/-1;justify-self:start}
}