@import url('fonts.css');
@import url('tokens.css');
body{color:var(--oo-color-ink);background:var(--oo-color-background);font-family:var(--oo-font-sans)}
h1,h2,h3,.metrics strong{font-family:var(--oo-font-heading);letter-spacing:-.025em;color:var(--oo-color-ink)}
h1{font-weight:750}h2{font-weight:700}.brand{display:inline-flex;align-items:center;text-decoration:none}.brand img{display:block;width:240px;max-width:55vw;height:48px;object-fit:contain;object-position:left}
header{background:white;border-color:var(--oo-color-line)}.panel{border-color:var(--oo-color-line);border-radius:var(--oo-radius-lg)}
button,.button{background:var(--oo-color-primary);border-color:var(--oo-color-primary);color:white;border-radius:var(--oo-radius-md)}button:hover,.button:hover{background:var(--oo-color-primary-dark)}
button.secondary,.button.secondary{background:white;color:var(--oo-color-ink);border:1px solid var(--oo-color-line)}button.secondary:hover,.button.secondary:hover{background:var(--oo-color-soft)}button.text-button{background:transparent;color:var(--oo-color-primary)}
button:disabled{opacity:.48;cursor:not-allowed}.eyebrow,nav a{color:var(--oo-color-primary)}.help,.person-info span{color:#52647a}.badge{background:var(--oo-color-soft);color:var(--oo-color-primary-dark)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--oo-color-primary);outline-offset:2px}.step>span{background:var(--oo-color-primary)}progress{accent-color:var(--oo-color-accent)}
button.group-card.active{background:var(--oo-color-soft);border-color:var(--oo-color-primary)}.photo-camera-guide,.photo-guide{color:var(--oo-color-accent)}
.delivery-panel{padding:20px;background:var(--oo-color-soft);border:1px solid var(--oo-color-line);border-radius:10px;margin-top:20px}.delivery-panel h3{margin-top:0}.delivery-panel p{margin:8px 0}.proof-note{font-size:14px;color:#52647a}.logo-library{max-height:260px;overflow:auto;display:grid;gap:8px;margin:12px 0}.logo-library button{display:flex;align-items:center;gap:12px;text-align:left;padding:10px;margin:0;font-size:14px}.logo-library img{width:55px;height:38px;object-fit:contain}.logo-library span{overflow-wrap:anywhere}.logo-fields{padding:12px;border:1px solid var(--oo-color-line);border-radius:8px;margin-top:12px}
.proof-surface{position:relative}.proof-surface svg{user-select:none}.proof-tag{color:var(--oo-color-primary-dark);font-weight:600}
@media(max-width:600px){.brand img{width:205px;height:42px}h1{font-size:30px}}

/* Orlazo: shared identity across the existing participation and studio flows. */
header{padding-top:18px;padding-bottom:18px;flex-wrap:wrap;min-width:0}
.brand{flex-shrink:0;line-height:1}
.brand img{width:224px;height:72px;max-width:100%;object-fit:contain}
header nav{display:flex;flex-direction:row;flex-wrap:wrap;gap:12px 20px;align-items:center}
header nav a{font-weight:600;text-underline-offset:4px}
.intro{max-width:850px;padding-top:32px}
.intro p:not(.eyebrow){color:#52647a;max-width:70ch;font-size:1rem}
h1{font-size:clamp(2rem,4vw,3rem);font-weight:800;line-height:1.15}
h2,h3{font-family:var(--oo-font-heading)}
.eyebrow{font-size:.875rem;letter-spacing:.09em}
button,.button,input,select,textarea{font-family:var(--oo-font-sans)}
button,.button{transition:background-color .15s,border-color .15s;min-height:44px}
a{color:var(--oo-color-primary)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #087F75;outline-offset:4px}
.badge{border-color:#C4E5DD;background:var(--oo-color-soft);font-weight:600}
.preview{border-top-color:var(--oo-color-accent)}
#notice:not(.error){border-left-color:var(--oo-color-accent);background:#EDF4F7;color:var(--oo-color-ink)}
input[type=range],input[type=checkbox]{accent-color:#087F75}
.panel{box-shadow:0 4px 20px rgba(11,45,91,.025)}
.step>span{background:var(--oo-color-accent-light);color:var(--oo-color-primary);font-weight:700;flex-shrink:0}
.text-button{color:#983b35}
.access-grid .panel{border-top:3px solid var(--oo-color-accent)}
.access-grid .button{color:white}
footer{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;border-top:1px solid var(--oo-color-line);margin-top:24px;padding-top:24px}
footer strong{font-family:var(--oo-font-heading);font-size:1.125rem;color:var(--oo-color-primary)}
footer small{margin-left:auto;font-size:.875rem}
@media(max-width:720px){
  header{gap:16px;padding:16px}
  .brand img{width:188px;height:61px}
  header nav{width:100%;gap:12px 16px}
  header .badge{max-width:none}
  h1{font-size:2rem}
  footer{margin-left:16px;margin-right:16px;padding-left:0;padding-right:0}
  footer small{width:100%;margin-left:0}
}
@media(prefers-reduced-motion:reduce){button,.button{transition:none}}
