/* The Business page (LO-379): The Telios Symphony program and its intake.
   Two columns on desktop, what's included on the left and the request card on
   the right. Indigo and gold on white, the same palette as site.css. */
:root{
  --paper:#FFFFFF; --surface:#FFFFFF; --tint:#FBFAF7;
  --ink:#221049; --indigo:#2E1A6B; --indigo-2:#3b2488; --muted:#6E648C;
  --gold:#C7A049; --gold-ink:#A9791F; --gold-soft:#F3EAD4; --line:#E7DECC;
  --error:#A3281B;
  color-scheme:light;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Jost","Avenir Next",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-weight:400;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%}
a{color:inherit}
[hidden]{display:none!important}
.wrap{max-width:1120px;margin:0 auto;padding-inline:24px}
.narrow{max-width:760px;margin-inline:auto}

.eyebrow{font-family:var(--sans);font-weight:500;font-size:.72rem;letter-spacing:.26em;
  text-transform:uppercase;color:var(--gold-ink);margin:0 0 16px}
h1,h2,h3{font-family:var(--serif);color:var(--indigo);font-weight:600;margin:0;text-wrap:balance;line-height:1.08}
h1{font-size:clamp(2.1rem,5.2vw,3.3rem);letter-spacing:-.01em}
h2{font-size:clamp(1.8rem,4.4vw,2.6rem)}
p{margin:1rem 0 0}

/* top brand */
.top{display:flex;flex-direction:column;align-items:center;padding-block:clamp(26px,5vh,46px)}
.top a{display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none}
.top img{width:clamp(50px,8vw,62px);height:auto}
.top .name{font-family:var(--serif);font-weight:600;font-size:1.05rem;color:var(--indigo);letter-spacing:.01em}
.top .name sup,.hero .eyebrow sup{font-size:.42em;vertical-align:.95em;margin-left:.1em}
.hero .eyebrow sup{font-size:.7em;vertical-align:.5em}

/* hero */
.hero{text-align:center;padding-block:clamp(20px,4vh,40px) clamp(40px,7vh,72px)}
.hero p{color:var(--ink);font-size:clamp(1.1rem,2.5vw,1.3rem);max-width:60ch;margin-inline:auto}
.hero .kicker{font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,3.2vw,1.7rem);
  color:var(--gold-ink);margin-top:20px}
.hero h1{text-wrap:initial}
.hero h1 .l1,.hero h1 .l2{white-space:nowrap;display:inline-block}
@media (max-width:600px){.hero h1 .l1,.hero h1 .l2{white-space:normal;display:inline}}

/* journey */
.journey{padding-block:clamp(40px,6vh,72px);border-top:1px solid var(--line)}
.journey>.eyebrow,.journey>h2{text-align:center}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:44px}
.step{position:relative;padding-top:30px;border-top:2px solid var(--gold)}
.step .mv{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);background:var(--paper);
  padding:0 16px;font-family:var(--serif);font-weight:600;color:var(--indigo);
  font-size:clamp(1.25rem,2.6vw,1.55rem);line-height:1;white-space:nowrap}
.step h3{font-size:clamp(1.3rem,2.6vw,1.6rem);margin-top:4px}
.step .mo{font-family:var(--sans);font-weight:500;font-size:.64rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted);margin-top:6px}
.step p{font-size:1rem;color:var(--ink);margin-top:10px}

/* two column */
.cols{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:48px;align-items:start;
  padding-block:clamp(44px,6vh,76px);border-top:1px solid var(--line)}
.included .lead-p{max-width:60ch;color:var(--ink)}
.cards{display:flex;flex-direction:column;gap:20px;margin-top:30px}
.card{display:flex;gap:18px;padding:26px;border:1px solid var(--line);border-radius:8px;background:var(--surface);
  box-shadow:0 18px 44px -34px rgba(46,26,107,.5)}
.badge{flex:0 0 auto;width:46px;height:46px;border-radius:50%;background:var(--gold-soft);
  display:flex;align-items:center;justify-content:center}
.badge svg{width:22px;height:22px;stroke:var(--indigo);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.card .cad{font-family:var(--sans);font-weight:500;font-size:.64rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold-ink)}
.card h3{font-size:clamp(1.25rem,2.4vw,1.5rem);margin-top:3px}
.card p{font-size:.98rem;color:var(--ink);margin-top:.5rem;max-width:52ch}

/* request card */
.request{background:var(--surface);border:1px solid var(--line);border-radius:10px;
  padding:clamp(24px,3vw,32px);box-shadow:0 30px 70px -44px rgba(46,26,107,.5);scroll-margin-top:24px}
.request h3{font-size:clamp(1.5rem,3vw,1.85rem)}
.request .intro{font-size:.96rem;color:var(--muted);margin-top:8px}
.field{display:flex;flex-direction:column;gap:6px;margin-top:16px;min-width:0}
.field label{font-family:var(--sans);font-size:.68rem;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--indigo)}
.field input,.field textarea,.field select{font-family:var(--sans);font-size:.98rem;color:var(--ink);
  background:var(--tint);border:1px solid var(--line);border-radius:5px;padding:11px 13px;width:100%}
.field textarea{resize:vertical}
.field select{padding-right:36px;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E1A6B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:12px}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--indigo);box-shadow:0 0 0 3px rgba(46,26,107,.12)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
@media (max-width:420px){.field-row{grid-template-columns:1fr}}
.qgroup{border:0;padding:0;margin:18px 0 0;min-width:0}
.qgroup legend{font-family:var(--sans);font-size:.68rem;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--indigo);padding:0;margin-bottom:4px}
.choice{display:flex;gap:10px;align-items:flex-start;margin-top:8px;font-size:.92rem;color:var(--ink);line-height:1.4;cursor:pointer}
.choice input{margin-top:3px;accent-color:var(--indigo);flex:0 0 auto}
.ack{display:flex;gap:10px;align-items:flex-start;margin-top:18px;font-size:.88rem;color:var(--ink);line-height:1.45}
.ack input{margin-top:3px;accent-color:var(--indigo);flex:0 0 auto}
.ack.fine{font-size:.76rem;color:var(--muted);line-height:1.5}
.ack.fine a{color:var(--gold-ink);text-decoration:underline;text-underline-offset:2px}
.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.turnstile{margin-top:18px}
.submit{margin-top:20px;width:100%;font-family:var(--sans);font-weight:500;font-size:.8rem;
  letter-spacing:.18em;text-transform:uppercase;color:var(--paper);background:var(--indigo);
  border:1px solid var(--indigo);border-radius:5px;padding:1rem 1.25rem;cursor:pointer;transition:background .25s,transform .2s}
.submit:hover{background:var(--indigo-2);transform:translateY(-2px)}
.submit:focus-visible{outline:none;box-shadow:0 0 0 3px var(--gold)}
.submit[disabled]{opacity:.6;cursor:progress;transform:none}
.form-error{margin-top:14px;color:var(--error);font-size:.92rem;text-align:center}
.alt{margin-top:14px;font-size:.86rem;color:var(--muted);text-align:center}
.alt a{color:var(--gold-ink);text-decoration:underline;text-underline-offset:3px}
.thanks{font-family:var(--serif);font-size:clamp(1.3rem,3vw,1.6rem);color:var(--indigo);line-height:1.3;text-align:center;padding:20px 0;margin:0}

/* measurement band */
.measure{background:var(--indigo);color:#F3EFFA;padding-block:clamp(48px,7vh,86px)}
.measure .eyebrow{color:var(--gold)}
.measure h2{color:#fff}
.measure p{color:#E4DEF3;max-width:62ch;font-size:1.1rem}
.measure .big{font-family:var(--serif);font-style:italic;color:#fff;font-size:clamp(1.4rem,3vw,2rem);
  line-height:1.3;max-width:34ch;margin-top:22px}
.measure .big b{color:var(--gold);font-style:normal;font-weight:600}

/* start with a book */
.library{padding-block:clamp(48px,7vh,86px);scroll-margin-top:24px}
.library .h2-stack{display:flex;flex-direction:column;gap:clamp(4px,.9vh,11px)}
.library .h2-stack span:last-child{font-size:.62em;color:var(--gold-ink);font-style:italic}
.library>p{max-width:62ch}
.books{margin-top:30px;display:flex;flex-direction:column}
.book{display:grid;grid-template-columns:112px minmax(0,1fr) auto;gap:22px;align-items:center;padding:24px 0;border-top:1px solid var(--line)}
.book:last-child{border-bottom:1px solid var(--line)}
.cover{width:112px;height:auto;aspect-ratio:2/3;object-fit:cover;border-radius:3px;box-shadow:0 14px 30px -18px rgba(34,16,73,.55);background:var(--gold-soft)}
.bk-main{min-width:0}
.book h3{font-size:clamp(1.3rem,2.8vw,1.6rem)}
.book p{font-size:1rem;color:var(--ink);margin-top:.5rem;max-width:54ch}
.act{display:flex;align-items:center;min-height:1.5em}
.read{font-family:var(--sans);font-weight:500;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-ink);text-decoration:none;white-space:nowrap;cursor:pointer}
.read:hover{color:var(--indigo)}
.read:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
@media (max-width:640px){
  .book{grid-template-columns:84px minmax(0,1fr);gap:16px}
  .cover{width:84px}
  .act{grid-column:2}
}

/* close */
.close{text-align:center;padding-block:clamp(48px,7vh,90px);border-top:1px solid var(--line)}
.close img{width:48px;height:auto;margin:0 auto 20px;display:block;opacity:.9}
.close .spark{font-family:var(--serif);font-style:italic;color:var(--indigo);
  font-size:clamp(1.3rem,3.6vw,2rem);line-height:1.3;max-width:24ch;margin:0 auto}
footer{text-align:center;padding-block:32px;font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--line)}
footer a{text-decoration:none}
footer a:hover{color:var(--indigo)}
.paths{display:flex;justify-content:center;gap:22px;margin-bottom:14px;flex-wrap:wrap}
.paths a[aria-current="page"]{color:var(--gold-ink)}

@media (max-width:860px){
  .cols{grid-template-columns:minmax(0,1fr);gap:38px}
  .steps{grid-template-columns:1fr;gap:38px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}