.project-page{min-height:100svh;background:#0b1020;color:white}.project-background{position:fixed;inset:0;background:center/cover no-repeat url('/photos/comercio.webp');z-index:-2;transition:background-image .5s}.project-background:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(11,16,32,.88),rgba(11,16,32,.62) 55%,rgba(11,16,32,.45))}.project-header{max-width:1320px;height:100px}.project-header .brand{color:white}.return-home{font-size:13px;color:#edf0fa}.project-shell{max-width:1240px;margin:28px auto 40px;padding:0 40px;display:grid;grid-template-columns:.85fr 1.15fr;align-items:start;gap:64px}.project-intro{padding-top:70px}.project-intro .eyebrow{color:#67e8f9}.project-intro h1{font-size:clamp(35px,4.2vw,58px);line-height:1.12;letter-spacing:-2px;margin:22px 0}.project-intro em{color:#b9a6ff}.project-intro p{font-size:17px;line-height:1.8;color:#e4e8f2}.sector-badge{display:inline-block;margin-top:20px;padding:10px 16px;border:1px solid #ffffff40;border-radius:24px;background:#ffffff10;font-size:13px}.project-shell .builder-card{color:var(--ink);background:white;box-shadow:0 24px 80px #0004;min-width:0}.project-shell .builder-body{padding:32px}.project-shell #question{font-size:27px;line-height:1.3;margin:16px 0 10px}.project-shell #hint{font-size:14px;line-height:1.6;margin-bottom:22px}.project-shell #history{overflow-wrap:anywhere;line-height:1.6}.project-shell .choice{padding:15px 16px;line-height:1.45;min-height:58px}.project-shell .choice-grid{gap:12px}.project-shell .builder-actions{margin-top:26px;gap:14px}.project-shell #summary{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7}.project-footer{padding:0 24px 28px;text-align:center;color:#e1e5f1;font-size:12px;line-height:1.6}@media(max-width:760px){.project-header{height:78px;padding:0 20px;gap:12px}.project-header .brand{font-size:25px}.return-home{font-size:12px}.project-shell{margin:0 auto 24px;padding:0 16px;grid-template-columns:1fr;gap:24px}.project-intro{padding:12px 8px 0}.project-intro h1{font-size:36px;letter-spacing:-1.2px;margin:12px 0}.project-intro h1 br{display:none}.project-intro p{font-size:14px;margin:0}.project-intro p br{display:none}.sector-badge{margin-top:12px;padding:7px 12px}.project-shell .builder-body{padding:22px 18px}.project-shell #question{font-size:23px}.project-shell .choice-grid{grid-template-columns:1fr}.project-shell .builder-head{padding:17px 18px}.project-shell .builder-actions .button{padding:14px 18px}.project-background:after{background:#0b1020b8}}@media(prefers-reduced-motion:reduce){.project-background{transition:none}}
#choices .whatsapp-button{grid-column:1 / -1;display:flex;justify-content:center;text-align:center;background:#18794e;color:white;line-height:1.5;padding:15px 18px}#choices .whatsapp-button:hover{background:#12613d}#download-demo{line-height:1.5;text-align:center}#next[hidden]{display:none}

/* Branding Polish 02 — keep the refined mark legible on dark photography */
.project-header .brand img{width:38px;height:28px}
@media(max-width:760px){.project-header .brand img{width:32px;height:24px}}


/* SynaCode — Branding Polish 05: important Project Builder microcopy */
.project-footer{font-size:13.5px;letter-spacing:.15px;color:#f0f2f8;font-weight:500;padding-bottom:30px}
@media(max-width:760px){.project-footer{font-size:12.5px;padding:0 24px 24px}}

/* Branding Polish 07 — semantic builder heading without visual regression */
.project-shell .builder-question{font-size:27px;line-height:1.3;letter-spacing:-.7px;font-weight:600;margin:16px 0 10px;color:var(--ink)}
@media(max-width:760px){.project-shell .builder-question{font-size:23px}}

/* Deploy 10 — Final Polish
   Choice surfaces: restrained soft-3D treatment with clear selected state. */
.project-shell #choices .choice[aria-pressed]{
  position:relative;
  min-height:64px;
  padding:16px 54px 16px 19px;
  border:1px solid #cfc4ff;
  border-radius:16px;
  background:radial-gradient(ellipse at 50% 45%,#e9e3ff 0%,#f3efff 52%,#fff 100%);
  color:#20283b;
  font-weight:560;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    inset 0 -8px 18px rgba(109,74,255,.035),
    0 7px 18px rgba(35,28,72,.07);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease;
  overflow:hidden;
}
.project-shell #choices .choice[aria-pressed]::after{
  content:"";
  position:absolute;
  right:17px;
  top:50%;
  width:22px;
  height:22px;
  border:1px solid #b8a9f8;
  border-radius:50%;
  background:linear-gradient(145deg,#fff,#eae4ff);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.95),0 2px 6px rgba(82,54,184,.12);
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  color:white;
  font-size:13px;
  font-weight:850;
}
.project-shell #choices .choice[aria-pressed]:hover{
  transform:translateY(-2px);
  border-color:#9b85ff;
  background:radial-gradient(ellipse at 50% 44%,#dfd6ff 0%,#eee9ff 52%,#fff 100%);
  box-shadow:
    inset 0 1px 0 #fff,
    inset 0 -8px 18px rgba(109,74,255,.05),
    0 11px 22px rgba(64,43,139,.11);
}
.project-shell #choices .choice[aria-pressed="true"]{
  border-color:#856cff;
  background:radial-gradient(ellipse at 50% 43%,#5231d6 0%,#6544ee 42%,#8067fa 72%,#a996ff 100%);
  color:#fff;
  text-shadow:0 1px 1px rgba(42,18,119,.2);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.38),
    inset 0 -10px 20px rgba(46,19,127,.18),
    0 10px 24px rgba(109,74,255,.24);
}
.project-shell #choices .choice[aria-pressed="true"]::after{
  content:"✓";
  border-color:rgba(255,255,255,.68);
  background:rgba(255,255,255,.19);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 2px 6px rgba(41,18,113,.18);
}
.project-shell #choices .choice[aria-pressed]:active{transform:translateY(0) scale(.995)}
.project-shell #choices .choice[aria-pressed]:focus-visible{outline:3px solid #22d3ee;outline-offset:3px}

@media(max-width:760px){
  .project-shell #choices .choice[aria-pressed]{
    min-height:62px;
    padding:15px 50px 15px 17px;
    border-radius:14px;
    font-size:15px;
  }
  .project-shell #choices .choice[aria-pressed]::after{right:15px;width:21px;height:21px}
}

@media(prefers-reduced-motion:reduce){
  .project-shell #choices .choice[aria-pressed]{transition:none!important}
}