/* Vision Movie Workshops (/workshops/…), 2026-10-02. Everything else comes from base.css + site.css + polish.css.
   Same look as the home page: a faded picture fixed behind the page (a ::before layer, because iOS Safari ignores
   background-attachment:fixed) and part-transparent cards so it reads through. */
body.ws::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:#000 var(--ws-bg,url(/assets/home/judy-bg.jpg)) center/auto 100% no-repeat;opacity:.22}
body.ws-angel{--ws-bg:url(/assets/p1/angel-bg.jpg)}
body.ws-cellist{--ws-bg:url(/assets/p2/cellist-bg.jpg)}
body.ws .step{background:rgba(18,21,29,.55)}
body.ws .card{background:rgba(25,29,39,.6)}

.ws-prose{max-width:760px}
.ws-prose p{color:var(--txt-2);font-size:18.5px}
.ws-two{display:grid;gap:clamp(28px,5vw,60px);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
@media(max-width:860px){.ws-two{grid-template-columns:minmax(0,1fr)}}
.ws-form .btn{max-width:100%;white-space:normal}

.checks{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:10px}
.checks li{display:flex;gap:11px;align-items:flex-start;color:var(--txt-2);font-size:17px}
.checks li::before{content:"";width:16px;height:16px;flex:none;margin-top:5px;border-radius:50%;background:rgba(232,181,103,.16);border:1px solid rgba(232,181,103,.45)}

/* the hour-by-hour list inside a step card */
.ws-hours{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:7px}
.ws-hours li{display:grid;grid-template-columns:86px 1fr;gap:10px;font-size:16px;color:var(--txt-2)}
.ws-hours b{color:var(--gold);font-weight:500}

/* the logistics block */
.ws-spec{display:grid;gap:0;margin:22px 0 0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:rgba(18,21,29,.55)}
.ws-spec div{display:grid;grid-template-columns:150px 1fr;gap:14px;padding:13px 18px;border-top:1px solid var(--line);font-size:17px;color:var(--txt-2)}
.ws-spec div:first-child{border-top:0}
.ws-spec dt{color:var(--txt-3);margin:0}
.ws-spec dd{margin:0}
@media(max-width:520px){.ws-spec div{grid-template-columns:1fr;gap:2px}}

/* schedule widget (assets/workshops.js fills [data-workshops]) */
.ws-dates{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));margin-top:22px}
.ws-date{padding:24px}
.ws-date h3{margin:8px 0 12px}
.ws-when{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:6px;font-size:16.5px;color:var(--txt-2)}
.ws-when b{display:inline-block;min-width:104px;color:var(--txt);font-weight:600}
.ws-price{margin:0 0 16px;font-size:16.5px;color:var(--txt-2)}
.ws-price .amt{font-size:32px;font-weight:200;color:var(--txt);letter-spacing:-.03em;margin-right:8px}
.ws-price s{color:var(--txt-3);margin-right:8px}
.ws-date form{margin:0}
.ws-date .btn{width:100%}
.ws-empty{color:var(--txt-2);font-size:17.5px;margin:18px 0 0}

.banner{display:none;border:1px solid rgba(87,208,122,.4);background:rgba(87,208,122,.09);border-radius:var(--r);padding:16px 18px;margin:0 0 24px;color:var(--txt)}
.banner.warn{border-color:rgba(255,184,77,.45);background:rgba(255,184,77,.08)}
.banner.show,.banner:not([hidden])[data-flag]{display:block}

.faq details{border-top:1px solid var(--line);padding:14px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--gold);font-weight:300;font-size:23px;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq p{margin:10px 0 0;color:var(--txt-2);font-size:17px}

.ws-table{width:100%;border-collapse:collapse;margin:14px 0;font-size:16.5px}
.ws-table th,.ws-table td{text-align:left;padding:10px 12px;border-top:1px solid var(--line);color:var(--txt-2);vertical-align:top}
.ws-table th{color:var(--txt-3);font-weight:500}

/* the participant agreement */
.ws-legal{max-width:760px}
.ws-legal h2{font-size:22px;margin:30px 0 8px}
.ws-legal p,.ws-legal li{color:var(--txt-2);font-size:17px}
.ws-legal li{margin:6px 0}
.ws-scroll{max-height:min(60vh,520px);overflow:auto;border:1px solid var(--line-2);border-radius:var(--r);padding:6px 20px 16px;background:rgba(11,13,18,.6)}

/* the private preparation page */
body.ws-private:not([data-state]) main>section:not(#ws-gone){display:none}
.ws-form{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:18px}
.ws-form label{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;font-size:16px;color:var(--txt-2)}
.ws-form input[type=text],.ws-form input[type=tel],.ws-form input[type=number],.ws-form textarea{width:100%;box-sizing:border-box;background:rgba(11,13,18,.7);border:1px solid var(--line-2);border-radius:10px;color:var(--txt);font:inherit;font-size:17px;padding:11px 13px}
.ws-form textarea{min-height:74px;resize:vertical}
.ws-form .tick{display:flex;gap:11px;align-items:flex-start;font-size:17px;color:var(--txt)}
.ws-form .tick input{width:20px;height:20px;margin-top:3px;flex:none;accent-color:var(--gold)}
.ws-map{margin:16px 0 8px;border-radius:var(--r);overflow:hidden;border:1px solid var(--line-2);background:#05070b;aspect-ratio:16/10}
.ws-map iframe{width:100%;height:100%;border:0;display:block}
.ws-late{margin:22px 0;padding:20px 22px;border:1px solid rgba(232,181,103,.45);border-radius:var(--r);background:rgba(232,181,103,.07)}
.ws-late p{margin:0;color:var(--txt);font-size:17.5px}
.ws-code{font-size:26px;letter-spacing:.08em;font-weight:700;margin:10px 0}
.ws-links{display:flex;gap:12px;flex-wrap:wrap;margin:12px 0 0}

/* two finished movies side by side (landing + details); one column on a phone so each is big enough to watch */
.ws-movies{display:grid;grid-template-columns:repeat(2,minmax(0,300px));gap:clamp(20px,5vw,56px);justify-content:center;margin:6px 0 0}
.ws-movie{margin:0}
.ws-movie .phone{width:100%}
.ws-movie figcaption{text-align:center;margin-top:12px;color:var(--txt-2);font-size:16.5px}
.ws-movies-note{text-align:center;color:var(--txt-3);font-size:16px;margin:22px 0 clamp(30px,5vw,48px)}
@media(max-width:520px){.ws-movies{grid-template-columns:minmax(0,300px)}}
.ws-movie .sound{white-space:nowrap}