/* BRIEF / approved site design tokens, typography and menu come from base.css. */
.brief-main{background:var(--paper);color:var(--ink)}
.brief-main *, .brief-main *::before, .brief-main *::after{box-sizing:border-box;min-width:0}

/* The brief cover uses the approved homepage's exact .hero, .stack, .script,
   .giant, .vert and intro animation rules from base.css. No local layout overrides. */

/* Editorial introduction and form. */
.brief-main .chapter{position:relative}
.brief-content{padding:clamp(55px,8vw,130px) var(--gut) clamp(90px,12vw,190px)}
.brief-opening{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,5vw,100px);align-items:end;
 border-bottom:1px solid var(--ink);padding-bottom:clamp(45px,7vw,100px)}
.brief-micro{font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.brief-opening h2{font:400 clamp(65px,7vw,125px)/1.01 var(--f-display);margin:25px 0 0;text-transform:uppercase}
.brief-opening p{max-width:520px;font-size:clamp(15px,1.45vw,21px);line-height:1.65;margin:0 0 5px}
#briefForm{max-width:1080px;margin:0 auto;padding-top:clamp(60px,8vw,125px)}
.brief-progress{display:flex;justify-content:space-between;gap:18px;border-top:1px solid var(--ink);padding-top:14px;
 font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.brief-progress span:last-child{max-width:65%;overflow-wrap:break-word;text-align:right}
.brief-step{display:none}
.brief-step.active{display:block;animation:brief-enter .68s var(--ease-out) both}
@keyframes brief-enter{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.brief-step h3{font:400 clamp(56px,7.5vw,118px)/1.04 var(--f-display);letter-spacing:0;margin:clamp(55px,7vw,100px) 0 18px;text-transform:uppercase}
.brief-caption{font-size:clamp(14px,1.35vw,19px);line-height:1.6;max-width:660px;margin:0 0 clamp(38px,5vw,70px)}
.brief-options{border:0;margin:0 0 clamp(40px,5vw,70px);padding:0}
.brief-options legend,.brief-field>span{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 18px}
.brief-multi-hint{font-size:clamp(12px,1vw,14px);color:var(--mute);margin:0 0 22px;line-height:1.5}
/* Semantic multi-select, with one narrow red rule on the LEFT of each selection.
   All standard dividers remain neutral; no fake navigation arrows or underline. */
.brief-options label{position:relative;display:flex;align-items:center;gap:clamp(11px,2vw,20px);
 border-top:1px solid #c7c7c7;padding:18px 10px 18px clamp(19px,2.2vw,28px);
 cursor:pointer;font:400 clamp(26px,4vw,58px)/1.14 var(--f-display);
 text-transform:uppercase;color:var(--ink);transition:color .35s ease}
.brief-options label:last-child{border-bottom:1px solid #c7c7c7}
.brief-options label input{position:absolute;width:1px;height:1px;margin:0;padding:0;opacity:0;pointer-events:none}
.brief-options label span{min-width:0;flex:1;overflow-wrap:break-word;text-decoration:none;transition:color .35s ease}
.brief-options label::before{content:"";position:absolute;left:0;top:19%;bottom:19%;width:3px;
 background:var(--red);transform:scaleY(0);transform-origin:center;transition:transform .35s var(--ease-out)}
.brief-options label:has(input:checked){color:var(--red)}
.brief-options label:has(input:checked)::before{transform:scaleY(1)}
@media(hover:hover){.brief-options label:hover{color:var(--red)}}
.brief-options label:has(input:focus-visible){outline:2px solid var(--red);outline-offset:3px}
.brief-field{display:block;min-width:0;margin-bottom:clamp(30px,5vw,52px)}
.brief-field input,.brief-field textarea,.brief-field select{display:block;width:100%;max-width:100%;border:0;border-bottom:1px solid var(--ink);border-radius:0;
 background:transparent;color:var(--ink);font:400 clamp(16px,1.5vw,21px)/1.5 Poppins,Montserrat,sans-serif;padding:14px 0;outline:none}
.brief-field textarea{min-height:130px;resize:vertical}
.brief-field :is(input,textarea,select):focus{border-bottom:2px solid var(--red)}
.brief-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,4vw,55px)}
.brief-actions{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid var(--ink);padding-top:24px}
.brief-actions button{padding:15px 0;background:transparent;border:0;color:var(--ink);font:400 clamp(24px,3vw,43px)/1 var(--f-display);
 text-transform:uppercase;white-space:normal;text-align:left;cursor:pointer}
.brief-actions .brief-next{margin-left:auto;border-bottom:1px solid var(--ink);text-align:right}
.brief-actions button:hover{color:var(--red)}
.brief-actions button:disabled{opacity:.25;cursor:default}
.brief-error{color:var(--red);min-height:25px;font-size:13px;line-height:1.5}
.brief-error.is-success{color:var(--ink)}
.brief-disclaimer{font-size:12px;color:var(--mute);line-height:1.7}
.brief-consent{display:flex;align-items:flex-start;gap:12px;margin:24px 0 14px;font-size:13px;line-height:1.6}
.brief-consent input{flex:none;width:18px;height:18px;margin:2px 0 0;accent-color:var(--ink)}
.brief-consent a{text-decoration:underline;text-underline-offset:3px}
.brief-hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.brief-form-note{margin:0 0 24px;font-size:12px;color:var(--mute);line-height:1.6}
@media(max-width:760px){
 .brief-content{padding:65px clamp(18px,5vw,32px) 100px}
 .brief-opening{grid-template-columns:1fr;gap:27px;padding-bottom:50px}
 .brief-opening h2{font-size:clamp(51px,11vw,84px)}
 .brief-opening p{font-size:15px}
 .brief-step h3{font-size:clamp(48px,10vw,82px);line-height:1.05}
 .brief-caption{margin-bottom:42px}
 .brief-options label{font-size:clamp(25px,6.4vw,46px);gap:12px;padding:17px 2px 17px 22px}
 .brief-two{grid-template-columns:1fr}
 .brief-field :is(input,textarea,select){font-size:16px}
 .brief-actions button{font-size:clamp(22px,5.3vw,35px)}
}
@media(max-width:390px){
 .brief-step h3{font-size:clamp(43px,9.5vw,57px)}
 .brief-opening h2{font-size:clamp(45px,10vw,60px)}
 .brief-options label{font-size:clamp(23px,6.2vw,33px)}
}
@media(prefers-reduced-motion:reduce){.brief-step.active{animation:none!important}}