@font-face{font-family:MacedoSans;src:url('/fonts/lato-light.ttf') format('truetype');font-weight:300;font-display:swap}
@font-face{font-family:MacedoSans;src:url('/fonts/lato-regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:MacedoSans;src:url('/fonts/lato-semibold.ttf') format('truetype');font-weight:600;font-display:swap}

:root{
  --paper:#f0f2ee;
  --paper-deep:#d6dbd3;
  --sage:#a5aea1;
  --leaf:#687363;
  --ink:#303a2d;
  --muted:#586154;
  --white:#fbfcfa;
  --error:#8a3f32;
  --focus:#40583c;
  --line:rgba(48,58,45,.18);
  --shadow:0 18px 46px rgba(48,58,45,.12);
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;background:var(--paper)}
body{margin:0;color:var(--ink);background:var(--paper);font-family:MacedoSans,"Helvetica Neue",sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
body::selection{background:var(--leaf);color:var(--white)}
button,input,select,textarea{font:inherit;color:inherit}
button{-webkit-tap-highlight-color:transparent}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(64,88,60,.32);outline-offset:3px}

.shell{min-height:100svh;display:grid;grid-template-columns:minmax(400px,42vw) 1fr}
.visual{position:sticky;top:0;height:100svh;background:url('/assets/hero-concreto.jpg') center/cover no-repeat;overflow:hidden}
.visual-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,31,28,.08) 25%,rgba(22,31,27,.76) 100%)}
.visual-note{position:absolute;left:clamp(28px,4vw,72px);right:clamp(28px,4vw,72px);bottom:clamp(34px,6vh,72px);margin:0;max-width:22ch;color:#fff;font-size:clamp(1.45rem,2.4vw,2.6rem);font-weight:300;line-height:1.16;letter-spacing:-.025em;text-wrap:balance}

.workspace{min-width:0;min-height:100svh;display:flex;flex-direction:column;background:var(--paper)}
.brandbar{min-height:112px;padding:28px clamp(30px,6vw,92px) 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand-logo{display:block;width:min(260px,46vw);height:auto;object-fit:contain;object-position:left center}
.save-note{border:0;background:transparent;color:var(--leaf);font-size:.83rem;padding:8px}

.panel{display:none}
.panel.is-active{display:block;animation:sheet-in .46s cubic-bezier(.22,1,.36,1) both}
.intro{flex:1;padding:clamp(44px,8vh,100px) clamp(30px,8vw,120px) 54px;max-width:940px}
.intro.is-active{display:flex;flex-direction:column;justify-content:space-between;gap:52px}
h1,h2{margin:0;color:var(--ink);font-weight:300;letter-spacing:-.03em;text-wrap:balance}
h1{max-width:12ch;font-size:clamp(3rem,5.2vw,6rem);line-height:.99}
h2{font-size:clamp(2.15rem,3.4vw,4.1rem);line-height:1.04;max-width:15ch}
.lead{max-width:55ch;margin:28px 0 0;color:var(--muted);font-size:clamp(1.05rem,1.3vw,1.22rem)}
.intro-details{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:54px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.intro-details p{margin:0;padding:20px 24px 22px;background:var(--paper)}
.intro-details p:first-child{padding-left:0}
.intro-details p:last-child{padding-right:0}
.intro-details strong,.intro-details span{display:block}
.intro-details strong{font-size:.92rem;font-weight:600;margin-bottom:6px}
.intro-details span{color:var(--muted);font-size:.82rem;line-height:1.45}

.button{min-height:52px;border-radius:13px;border:1px solid transparent;padding:14px 25px;font-weight:600;cursor:pointer;transition:background-color .18s ease,color .18s ease,border-color .18s ease,transform .18s ease}
.button:active{transform:translateY(1px)}
.button:disabled{cursor:not-allowed;opacity:.55}
.button-primary{background:var(--ink);color:var(--white)}
.button-primary:hover{background:#43513f}
.button-secondary{background:transparent;border-color:var(--line);color:var(--ink)}
.button-secondary:hover{background:rgba(214,219,211,.55)}
.start-button{align-self:flex-start;min-width:210px}

.form-view{flex:1;display:grid;grid-template-columns:240px minmax(0,1fr)}
.progress{position:sticky;top:0;align-self:start;height:100svh;padding:36px 28px;border-right:1px solid var(--line);background:rgba(214,219,211,.27)}
.progress ol{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.progress li{display:grid;grid-template-columns:28px 1fr;align-items:center;gap:9px;min-height:42px;color:#778074;font-size:.84rem;line-height:1.25}
.progress li span{width:26px;height:26px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;font-size:.72rem;font-weight:600}
.progress li.is-current{color:var(--ink);font-weight:600}
.progress li.is-current span{background:var(--ink);border-color:var(--ink);color:var(--white)}
.progress li.is-complete{color:var(--leaf)}
.progress li.is-complete span{background:var(--leaf);border-color:var(--leaf);color:transparent;position:relative}
.progress li.is-complete span::after{content:"";position:absolute;width:8px;height:4px;border-left:2px solid white;border-bottom:2px solid white;transform:rotate(-45deg) translateY(-1px)}
.progress-mobile,.progress-track{display:none}

#briefingForm{min-width:0;display:flex;flex-direction:column;min-height:calc(100svh - 112px)}
.form-stage{flex:1;padding:clamp(38px,7vh,74px) clamp(32px,7vw,104px) 140px}
.step-panel{max-width:900px;margin:0 auto}
.step-heading{padding-bottom:35px;margin-bottom:34px;border-bottom:1px solid var(--line)}
.step-heading>p:last-child{max-width:62ch;margin:18px 0 0;color:var(--muted);font-size:1.03rem}
.fields{display:grid;gap:22px}
.two-columns{grid-template-columns:repeat(2,minmax(0,1fr))}
.field{display:grid;gap:8px;margin:0 0 22px}
.field>span,.choice-group legend{font-size:.91rem;font-weight:600}
.field small{font-size:.76rem;color:var(--muted);font-weight:400;margin-left:5px}
input,select,textarea{width:100%;border:1px solid var(--line);border-radius:12px;background:rgba(251,252,250,.66);padding:13px 15px;transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease}
input,select{min-height:50px}
textarea{resize:vertical;min-height:94px}
input:hover,select:hover,textarea:hover{border-color:rgba(48,58,45,.36)}
input:focus,select:focus,textarea:focus{border-color:var(--leaf);background:var(--white);box-shadow:0 0 0 4px rgba(104,115,99,.1)}
input::placeholder,textarea::placeholder{color:#7d857a;opacity:1}
.field.has-error input,.field.has-error select,.field.has-error textarea,.choice-group.has-error{border-color:var(--error)}
.error-text{margin:0;color:var(--error);font-size:.78rem}

.choice-group{border:0;padding:0;margin:0 0 30px;min-width:0}
.choice-group legend{margin-bottom:13px}
.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.choice-grid.compact{grid-template-columns:repeat(4,minmax(0,1fr))}
.choice{position:relative;display:block;cursor:pointer}
.choice input{position:absolute;opacity:0;inset:0;pointer-events:none}
.choice span{min-height:52px;height:100%;display:flex;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:13px;background:rgba(251,252,250,.5);font-size:.9rem;line-height:1.25;transition:border-color .18s ease,background-color .18s ease,color .18s ease}
.choice:hover span{border-color:rgba(48,58,45,.4);background:var(--white)}
.choice input:focus-visible+span{outline:3px solid rgba(64,88,60,.32);outline-offset:3px}
.choice input:checked+span{border-color:var(--ink);background:var(--ink);color:var(--white)}
.choice input:disabled+span{opacity:.5;cursor:not-allowed}
.material span{min-height:84px;align-items:flex-end;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.35);background-size:cover;background-position:center}
.material.wood span{background:#806b55}
.material.stone span{background:#8d8b82}
.material.concrete span{background:#747a76}
.material.metal span{background:#39433e}
.material.textile span{background:#918778}
.material.greenery span{background:#465744}
.material input:checked+span{box-shadow:inset 0 0 0 3px var(--white);border-color:var(--ink)}

.file-field{position:relative}
.file-field input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.file-drop{min-height:112px;border:1px dashed rgba(48,58,45,.36);border-radius:13px;display:grid;place-content:center;text-align:center;padding:20px;background:rgba(214,219,211,.3);cursor:pointer}
.file-drop strong,.file-drop small{display:block}
.file-drop strong{color:var(--ink);font-size:.94rem}
.file-drop small{margin:5px 0 0;color:var(--muted)}
.file-field:focus-within .file-drop{outline:3px solid rgba(64,88,60,.32);outline-offset:3px}
.file-list{list-style:none;margin:-12px 0 24px;padding:0;display:grid;gap:7px}
.file-list li{display:flex;justify-content:space-between;gap:15px;padding:10px 12px;background:rgba(214,219,211,.42);border-radius:9px;font-size:.82rem}
.file-list button{border:0;background:transparent;color:var(--error);cursor:pointer}

.review-content{display:grid;gap:1px;background:var(--line);border-block:1px solid var(--line);margin-bottom:28px}
.review-section{background:var(--paper);padding:22px 0}
.review-section h3{margin:0 0 14px;font-size:1rem;font-weight:600}
.review-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px}
.review-item dt{color:var(--muted);font-size:.75rem}
.review-item dd{margin:3px 0 0;font-size:.9rem;white-space:pre-wrap}
.consent{display:flex;align-items:flex-start;gap:11px;padding:18px;border:1px solid var(--line);border-radius:12px;background:rgba(251,252,250,.55);font-size:.85rem}
.consent input{width:20px;height:20px;min-height:auto;margin:1px 0 0;accent-color:var(--ink);flex:0 0 auto}
.submit-status{min-height:24px;margin-top:15px;font-size:.86rem;color:var(--muted)}
.submit-status.is-error{color:var(--error)}

.form-actions{position:static;display:flex;justify-content:space-between;gap:14px;padding:18px clamp(32px,7vw,104px);background:var(--paper);border-top:1px solid var(--line)}
.form-actions .button-primary{margin-left:auto}

@keyframes sheet-in{from{opacity:.001;transform:translateX(22px);clip-path:inset(0 0 0 4%)}to{opacity:1;transform:translateX(0);clip-path:inset(0)}}

@media (max-width:1080px){
  .shell{grid-template-columns:34vw 1fr}
  .form-view{grid-template-columns:190px minmax(0,1fr)}
  .progress{padding-inline:20px}
  .progress li{font-size:.78rem}
  .form-stage{padding-inline:42px}
  .form-actions{padding-inline:42px}
  .choice-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:760px){
  body{font-size:15px}
  .shell{display:block}
  .visual{position:relative;height:190px;background-position:center 35%}
  .visual-shade{background:linear-gradient(180deg,rgba(25,32,29,.05),rgba(26,34,30,.52))}
  .visual-note{left:22px;right:22px;bottom:20px;font-size:1.35rem;max-width:25ch}
  .brandbar{min-height:80px;padding:18px 22px}
  .brand-logo{width:205px}
  .intro{padding:45px 22px 36px}
  .intro.is-active{gap:36px}
  h1{font-size:clamp(2.7rem,13vw,4.5rem)}
  h2{font-size:clamp(2.2rem,10vw,3.5rem)}
  .lead{font-size:1rem;margin-top:21px}
  .intro-details{display:block;margin-top:35px}
  .intro-details p{padding:16px 0;border-bottom:1px solid var(--line)}
  .intro-details p:last-child{border-bottom:0}
  .start-button{width:100%}
  .form-view{display:block}
  .progress{position:sticky;top:0;z-index:20;height:auto;align-self:auto;padding:13px 22px 10px;border-right:0;border-bottom:1px solid var(--line);background:rgba(240,242,238,.96);backdrop-filter:blur(12px)}
  .progress ol{display:none}
  .progress-mobile{display:flex;justify-content:space-between;gap:16px;font-size:.76rem;font-weight:600}
  .progress-mobile span:last-child{color:var(--leaf);text-align:right}
  .progress-track{display:block;height:3px;margin-top:9px;background:var(--paper-deep);overflow:hidden}
  .progress-track span{display:block;width:12.5%;height:100%;background:var(--ink);transition:width .35s cubic-bezier(.22,1,.36,1)}
  #briefingForm{min-height:auto}
  .form-stage{padding:36px 22px 118px}
  .step-heading{padding-bottom:26px;margin-bottom:27px}
  .two-columns,.choice-grid,.review-grid{grid-template-columns:1fr}
  .choice-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}
  .choice span{min-height:50px}
  .form-actions{padding:14px 22px calc(14px + env(safe-area-inset-bottom));background:rgba(240,242,238,.97)}
  .form-actions .button{min-width:0;padding-inline:20px}
}

@media (max-width:390px){
  .choice-grid.compact{grid-template-columns:1fr}
  .brand-logo{width:185px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

@media print{
  .visual,.brandbar,.progress,.form-actions{display:none!important}
  .shell,.form-view{display:block}
  .workspace{display:block}
  .form-stage{padding:0}
}
