/* MeansMGMT forms v2 (2026-10-16). Shared by index.html (main intake), campaign.html (Start now)
   and tour.html (Laylo tour). Editorial dark + light, Inter only, halftone art per step.
   Lane colour comes from <body data-lane="main|start|tour|doors">. Theme from <html data-theme>. */

@font-face{font-family:'Inter';src:url('/fonts/Inter-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url('/fonts/Inter-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Inter';src:url('/fonts/Inter-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Inter';src:url('/fonts/Inter-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Inter';src:url('/fonts/Inter-800.woff2') format('woff2');font-weight:800;font-display:swap}

:root{
  --maxw:560px; --ease:cubic-bezier(.2,.6,.2,1);
  --font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --r-tile:18px; --r-panel:22px; --r-field:14px;
}
html[data-theme="dark"]{
  --bg:#0f0f11; --surface:#18181b; --surface-2:#222226;
  --ink:#f3f3f1; --ink-2:rgba(243,243,241,.66); --ink-3:rgba(243,243,241,.52);
  --line:rgba(255,255,255,.12); --line-2:rgba(255,255,255,.22);
  --inv:#f3f3f1; --inv-ink:#0f0f11; --art:#efe8da;
  --good:#6fcf9f; --bad:#ff8a73;
  color-scheme:dark;
}
html[data-theme="light"]{
  --bg:#f4f4f1; --surface:#ffffff; --surface-2:#ebebe6;
  --ink:#0f0f11; --ink-2:rgba(15,15,17,.64); --ink-3:rgba(15,15,17,.56);
  --line:rgba(15,15,17,.1); --line-2:rgba(15,15,17,.2);
  --inv:#0f0f11; --inv-ink:#f3f3f1; --art:#0f0f11;
  --good:#1f6b47; --bad:#c0341d;
  color-scheme:light;
}
body{--lane:#2d8060;--lane-ink:#ffffff}
body[data-lane="start"]{--lane:#e8873a;--lane-ink:#0f0f11}
body[data-lane="tour"]{--lane:#4a7fe0;--lane-ink:#0f0f11}
body[data-lane="doors"]{--lane:#7c70ff;--lane-ink:#0f0f11}

*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{font-family:var(--font);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.45;min-height:100dvh;display:flex;flex-direction:column;transition:background .3s var(--ease),color .3s var(--ease);-webkit-tap-highlight-color:transparent}
body::before,body::after{content:none!important;display:none!important}
a{color:inherit}
.shell{position:relative;width:100%;max-width:var(--maxw);margin:0 auto;padding:16px 24px calc(28px + env(safe-area-inset-bottom));flex:1;display:flex;flex-direction:column}

/* ---------- top bar ---------- */
.top{height:44px;display:flex;align-items:center;justify-content:space-between;margin:0 0 4px}
.lock{display:inline-flex;align-items:center;gap:10px;border:0;background:none;padding:0;text-decoration:none;color:var(--ink)}
.lock .mm-mark{height:22px;width:auto;display:none}
html[data-theme="dark"] .lock .logo-white{display:block}
html[data-theme="light"] .lock .logo-black{display:block}
.brandword{font-weight:800;font-size:15px;letter-spacing:.01em;text-transform:uppercase;line-height:1;color:var(--ink)}
.brandword .lt{font-weight:800;color:inherit}
.lock .sep,.lock .sub{display:none}
.lock .co{font-weight:500;font-size:15px;letter-spacing:.01em;text-transform:uppercase;color:var(--ink-3)}
.top-right{display:flex;align-items:center;gap:12px}
.tg{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:999px;border:1px solid var(--line-2);background:none;color:var(--ink);cursor:pointer;transition:border-color .15s var(--ease)}
.tg:hover{border-color:var(--ink)}
.tg svg{width:16px;height:16px}
.tg .ico-sun{display:none}
html[data-theme="dark"] .tg .ico-sun{display:block}
html[data-theme="dark"] .tg .ico-moon{display:none}

/* ---------- art: halftone blob + line icon ---------- */
.art{position:relative;height:136px;margin:8px 0 16px;display:flex;align-items:center;justify-content:center;pointer-events:none;flex:none}
.art .ht{position:absolute;left:50%;top:50%;width:220px;height:170px;transform:translate(-50%,-50%) rotate(var(--rot,-8deg));
  background-image:radial-gradient(circle,var(--lane) 1.9px,transparent 2.2px);background-size:9px 9px;
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 30%,transparent 70%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 30%,transparent 70%);
  transition:transform .6s var(--ease);animation:htDrift 18s linear infinite,htBreathe 5s ease-in-out infinite alternate}
.art svg{position:relative;width:88px;height:88px;fill:none;stroke:var(--art);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;animation:artIn .45s var(--ease)}
.art.sm{height:112px;margin:4px 0 12px}
.art.sm .ht{width:200px;height:140px}
.art.sm svg{width:72px;height:72px}
@keyframes artIn{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}
/* Halftone dots drift about one pixel a second and breathe a little. Moves in whole
   multiples of the 9px grid so the loop is seamless. Off under reduced motion. */
@keyframes htDrift{from{background-position:0 0}to{background-position:18px 9px}}
@keyframes htDrift7{from{background-position:0 0}to{background-position:14px 7px}}
@keyframes htBreathe{from{opacity:.8}to{opacity:1}}

/* labels that only repeat the question heading stay for screen readers */
.qlabel.dup{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

/* ---------- tag pill ---------- */
.tag{display:inline-flex;align-items:center;align-self:flex-start;height:26px;padding:0 11px 0 12px;border-radius:999px;background:var(--lane);color:var(--lane-ink);font-size:11px;line-height:1;font-weight:800;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}

/* ---------- hero ---------- */
.hero{display:flex;flex-direction:column;gap:12px;margin:0 0 24px}
.hero h1{font-weight:800;font-size:clamp(36px,9.4vw,48px);line-height:1;letter-spacing:-.045em;color:var(--ink)}
.hero h1 .pd{color:inherit}
.hero p{font-size:15px;line-height:1.45;color:var(--ink-2);max-width:46ch;margin:0}
.hero .tag-line{font-size:12.5px;color:var(--ink-3)}

/* ---------- progress ---------- */
.progress{display:none;margin:4px 0 0}
.progress.show{display:block}
.progress .prow{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin-bottom:8px}
.progress .pstep{color:var(--ink-3);font-weight:700}
.progress .pstage{display:none}
.pbar{height:3px;background:var(--line);border-radius:999px;overflow:hidden}
.pbar i{display:block;height:100%;width:0;background:var(--ink);border-radius:999px;transition:width .45s var(--ease)}

/* ---------- form body ---------- */
.card{position:relative;background:none!important;border:0;padding:0;box-shadow:none;display:flex;flex-direction:column;flex:1;min-height:0;overflow:visible;-webkit-backdrop-filter:none;backdrop-filter:none}
.stepnum{display:none}
.cardbody{position:relative;flex:none}
.step{display:none}
.step.active{display:flex;flex-direction:column;animation:stepIn .4s var(--ease)}
[data-dir="back"] .step.active{animation:stepInBack .4s var(--ease)}
@keyframes stepIn{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
@keyframes stepInBack{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.step h2{font-weight:800;font-size:clamp(32px,8.8vw,40px);line-height:1;letter-spacing:-.045em;outline:none;margin:12px 0 0;max-width:none}
.step .sub{font-size:15px;line-height:1.45;color:var(--ink-2);margin:8px 0 0;max-width:46ch}
.q{margin-top:24px}
.q + .q{margin-top:20px}
.qlabel{display:block;font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-2);margin-bottom:8px}
.qlabel .req{color:var(--ink-3)}
.qlabel .opt-t{color:var(--ink-3);font-weight:500}
.qhint{font-size:13px;color:var(--ink-3);margin:-2px 0 8px}

/* option tiles */
.optgroup{display:grid;gap:12px}
.optgroup.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.opt{position:relative;display:flex;align-items:center;gap:12px;min-height:60px;padding:14px 16px;border-radius:var(--r-tile);background:var(--surface);border:1px solid var(--line);color:var(--ink);font-size:16px;font-weight:700;line-height:1.25;cursor:pointer;user-select:none;transition:transform .12s var(--ease),background .15s var(--ease),border-color .15s var(--ease),color .15s var(--ease)}
.opt::before{content:none}
.opt:hover{border-color:var(--line-2)}
.opt:active{transform:scale(.98)}
.opt:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.opt .txt{flex:1;min-width:0}
.opt .txt small{display:block;font-size:13px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink-3);margin-top:3px;line-height:1.35}
.opt .ic{flex:none;width:22px;height:22px;fill:none;stroke:var(--art);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.opt .mark{order:3;flex:none;width:22px;height:22px;border-radius:999px;border:1.5px solid var(--line-2);display:flex;align-items:center;justify-content:center;transition:all .15s var(--ease)}
.opt .mark svg{width:12px;height:12px;opacity:0;transform:scale(.6);transition:all .15s var(--ease)}
.opt.sel{background:var(--inv);color:var(--inv-ink);border-color:var(--inv)}
.opt.sel .txt small{color:var(--inv-ink);opacity:.62}
.opt.sel .ic{stroke:var(--inv-ink)}
.opt.sel .mark{background:var(--inv-ink);border-color:var(--inv-ink);color:var(--inv)}
.opt.sel .mark svg{opacity:1;transform:none}
/* square tiles: icon on top, label at the bottom */
.optgroup.cols-2 .opt.has-ic{flex-direction:column;align-items:flex-start;justify-content:space-between;min-height:104px;padding:16px}
.optgroup.cols-2 .opt.has-ic .txt{flex:none}
.optgroup.cols-2 .opt.has-ic .mark{position:absolute;top:14px;right:14px}
/* big value tiles (budgets, roster size) */
.optgroup.big .opt{min-height:72px;font-size:19px;font-weight:800;letter-spacing:-.03em}
.optgroup.big .opt .mark{position:absolute;top:12px;right:12px;width:20px;height:20px}
/* chips */
.optgroup.chips{display:flex;flex-wrap:wrap;gap:8px}
.optgroup.chips .opt{min-height:44px;padding:0 18px;border-radius:999px;font-size:15px}
.optgroup.chips .opt .mark{display:none}

/* text fields */
.field{margin-top:16px}
.field:first-child{margin-top:0}
.field label{display:block;font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-2);margin-bottom:8px}
.field label .req{color:var(--ink-3)}
.field label .opt-t{color:var(--ink-3);font-weight:500}
.field .micro{font-size:13px;color:var(--ink-3);margin:-2px 0 8px}
.field input,.field select,.field textarea{width:100%;height:52px;font-family:var(--font);font-size:16px;font-weight:500;color:var(--ink);background-color:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-field);padding:0 16px;transition:border-color .15s var(--ease),box-shadow .15s var(--ease)}
.field textarea{height:auto;min-height:104px;padding:14px 16px;line-height:1.45;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:var(--ink-3);font-weight:400}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--ink) 12%,transparent)}
.field.bad input,.field.bad select,.field.bad textarea{border-color:var(--bad)}
.field .err{display:none;font-size:13.5px;line-height:1.4;color:var(--bad);margin-top:8px}
.field.bad .err{display:block}
.step > .sub + .row-2,.step > .sub + .field,.step > h2 + .row-2,.step > h2 + .field{margin-top:24px}
.step > .q + .field{margin-top:20px}
.row-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.row-2 .field{margin-top:0}
select,.field select{appearance:none;-webkit-appearance:none;background-repeat:no-repeat;background-position:right 16px center;padding-right:40px!important}
html[data-theme="dark"] select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23f3f3f1' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")}
html[data-theme="light"] select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%230f0f11' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")}

.consent{display:flex;gap:12px;align-items:flex-start;margin-top:20px;padding-top:0;border-top:0}
.consent input{flex:none;width:18px;height:18px;margin-top:1px;accent-color:var(--ink)}
.consent label{font-size:13px;line-height:1.45;color:var(--ink-2)}
.consent a{color:inherit}

/* found card (song / profile lookup) */
.found{display:flex;gap:12px;align-items:center;margin-top:12px;padding:10px 12px;border-radius:16px;background:var(--surface);border:1px solid var(--line);animation:fade .35s var(--ease)}
.found[hidden]{display:none}
.found img,.found .ph{flex:none;width:56px;height:56px;border-radius:10px;object-fit:cover;background:var(--surface-2)}
.found .fx{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.found .ft{font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.found .fs{font-size:12.5px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.found .ok{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--good)}
.found .ok svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

/* ---------- nav ---------- */
.nav{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:28px;border-top:0;position:relative}
.btn{height:52px;padding:0 22px;border-radius:999px;font-family:var(--font);font-size:15px;font-weight:700;letter-spacing:0;text-transform:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;border:1px solid transparent;text-decoration:none;transition:transform .15s var(--ease),opacity .15s var(--ease),border-color .15s var(--ease)}
.btn:active{transform:scale(.98)}
.btn-primary{flex:1;background:var(--inv);color:var(--inv-ink);border-color:var(--inv)}
.btn-primary:hover{transform:translateY(-1px)}
.btn-ghost{background:none;color:var(--ink);border-color:var(--line-2)}
.btn-ghost:hover{border-color:var(--ink)}
.btn[disabled]{opacity:.6;cursor:default}
.btn:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.btn .ar{transition:transform .2s var(--ease)}
.btn-primary:hover .ar{transform:translateX(3px)}
.nav .btn[hidden]{display:none}

.senderr{display:none;margin-top:12px;font-size:13.5px;color:var(--bad);text-align:center;line-height:1.5}
.senderr.show{display:block}
.senderr a{color:var(--bad)}
.hintline{margin-top:12px;text-align:center;font-size:12.5px;letter-spacing:0;text-transform:none;color:var(--ink-3)}
.hintline .kbd{border:1px solid var(--line-2);border-radius:6px;padding:0 5px;font-size:11px;color:var(--ink-2)}
.hintline.warn{color:var(--bad);font-size:13.5px}
.autosave{margin-top:4px;text-align:center;font-size:12.5px;letter-spacing:0;text-transform:none;color:var(--ink-3)}
.trust{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:12.5px;letter-spacing:0;text-transform:none;color:var(--ink-3);text-align:center}
@media (hover:none){.hintline .kbd,.hintline .kb{display:none}}

/* ---------- done ---------- */
.done{display:none}
.done.show{display:flex;flex-direction:column;animation:fade .45s var(--ease)}
.done .seal,.done .uline{display:none}
.done .dh{display:flex;justify-content:space-between;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin:0;opacity:1;animation:none}
.done h2{font-weight:800;font-size:clamp(36px,9.4vw,48px);line-height:1;letter-spacing:-.045em;margin:12px 0 0;opacity:1;animation:none}
.done h2 .pd{color:inherit}
.done .lead{font-size:15px;line-height:1.45;color:var(--ink-2);margin:8px 0 0;max-width:46ch;opacity:1;animation:none}
.nextlist{margin-top:24px;border-top:1px solid var(--line)}
.nrow{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline;opacity:1;animation:none}
.nrow .nn{flex:none;width:28px;font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--ink-3)}
.nrow .nt{font-size:15px;color:var(--ink-2)}
.nrow .nt b{color:var(--ink);font-weight:700}

.book{margin-top:24px;padding:20px;border-radius:var(--r-panel);background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;gap:12px}
.book[hidden]{display:none}
.book .bt{font-size:18px;font-weight:800;letter-spacing:-.02em}
.book .bs{font-size:14px;color:var(--ink-2);line-height:1.45}
.book .btn{align-self:stretch;flex:none}
.book .btn[hidden]{display:none}
.book iframe{width:100%;height:640px;border:0;border-radius:14px;background:#fff}
.book .bnote{font-size:12.5px;color:var(--ink-3)}

.tyhub{position:relative;margin-top:32px;padding:0;border:0;background:none;overflow:visible}
.tyhub::before,.tyhub::after{content:none!important}
.tyhead{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin:0 0 12px}
.tycards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tycard{position:relative;display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:var(--r-panel);background:var(--surface);border:1px solid var(--line);text-decoration:none;color:var(--ink);box-shadow:none;transition:transform .2s var(--ease),border-color .15s var(--ease);opacity:1!important;animation:none!important;-webkit-backdrop-filter:none;backdrop-filter:none}
.tycard:hover{transform:translateY(-2px);border-color:var(--line-2)}
.tycard.wide{grid-column:1 / -1}
.tycard[hidden]{display:none}
.tycard .sheen{display:none}
.tycard .ic{width:24px;height:24px;color:var(--art);margin-bottom:2px}
.tycard .ic svg{width:100%;height:100%;display:block}
.tycard .kick{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.tycard .tt{font-size:16px;font-weight:700;letter-spacing:-.01em;line-height:1.25}
.tycard .td{font-size:13.5px;line-height:1.45;color:var(--ink-2)}
.tycard .go{margin-top:auto;padding-top:8px;display:flex;justify-content:space-between;align-items:center;font-size:13.5px;font-weight:700;color:var(--ink)}
.tycard .go .ar{transition:transform .2s var(--ease)}
.tycard:hover .go .ar{transform:translateX(3px)}
.tycard.skip{background:var(--inv);color:var(--inv-ink);border-color:var(--inv)}
.tycard.skip::before{content:none}
.tycard.skip .ic,.tycard.skip .go{color:var(--inv-ink)}
.tycard.skip .kick,.tycard.skip .td{color:var(--inv-ink);opacity:.66}
.socard .sorow{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:8px}
.solink{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);text-decoration:none;color:var(--ink);font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;background:none;transition:border-color .15s var(--ease)}
.solink:hover{border-color:var(--ink)}
.solink svg{width:14px;height:14px}

.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;pointer-events:none}

@media (min-width:700px){
  .shell{padding-top:28px}
  .art{height:156px}
}
@media (max-width:380px){
  .shell{padding-left:20px;padding-right:20px}
  .optgroup.cols-2 .opt.has-ic{min-height:96px}
}
@media (max-width:560px){
  .tycards{grid-template-columns:1fr}
  .row-2{grid-template-columns:1fr;gap:0}
  .row-2 .field + .field{margin-top:16px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* autosave + save-and-resume (v3 step 7) */
.rs-note{margin:0 0 14px;font-size:13px;line-height:1.45;color:var(--ink-2)}
.rs-row{margin:14px 0 0;text-align:center;font-size:13.5px;line-height:1.5;color:var(--ink-2)}
.rs-link{background:none;border:0;padding:4px 0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.rs-link:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.rs-link:disabled{opacity:.6;cursor:default}
.rs-row span{display:block;min-height:1.5em}