.brief-page [hidden]{display:none!important}
.brief-page{background:radial-gradient(ellipse 65% 440px at 100% 0,rgba(255,242,0,.2),transparent),var(--paper)}
.brief-nav{display:flex;align-items:center;justify-content:space-between;padding-block:28px;border-bottom:1px solid var(--line)}
.back-home{font-size:13px;color:var(--ink-2)}
.brief-intro{max-width:850px;padding:64px 0 48px}
.brief-intro h1{font-size:clamp(44px,6.2vw,78px);font-weight:600;line-height:1.03;letter-spacing:-.045em;color:var(--teal-ink);margin:24px 0}
.brief-intro h1 em,.brief-success h2 em{font-family:var(--serif);font-weight:400}
.brief-intro>p{font-size:18px;color:var(--ink-2);max-width:650px;line-height:1.6}
.brief-meta{display:flex;flex-wrap:wrap;gap:12px 24px;font-size:12px;color:var(--teal-deep);margin-top:24px}
.brief-meta span::before{content:'✳';margin-right:8px;color:var(--teal)}
.brief-dot{width:7px;height:7px;border-radius:50%;background:var(--teal)}
.brief-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:start}
.brief-editor{min-width:0}
.brief-progress{display:grid;grid-template-columns:repeat(7,1fr);list-style:none;padding:0;margin:0;gap:7px}
.brief-progress button{display:block;min-height:24px;width:100%;padding:6px 0}
.brief-progress button::after{content:'';display:block;height:5px;background:var(--cream-warm);border-radius:999px}
.brief-progress button.visited::after{background:var(--mint)}
.brief-progress button[aria-current=step]::after{background:var(--teal)}
.brief-progress button:disabled{cursor:default}
.step-caption{font-size:12px;color:var(--teal-deep);margin:8px 0 24px}
.mobile-preview-button{display:none}
.brief-panel{border:1px solid var(--line);background:rgba(255,255,255,.72);border-radius:var(--radius-l);padding:30px;box-shadow:0 16px 48px -38px rgba(14,27,28,.2)}
.brief-panel fieldset{border:0;padding:0;margin:0;min-width:0}
.brief-panel legend{font-size:28px;line-height:1.2;font-weight:600;letter-spacing:-.035em;color:var(--teal-ink);padding:0;float:left;width:100%;margin-bottom:14px}
.brief-panel legend+*{clear:both}
.brief-panel legend>span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--teal);font-weight:500;margin-bottom:13px}
.step-help{font-size:13px;color:var(--muted);line-height:1.6;margin:0 0 26px}
.brief-panel .field{margin:0 0 20px;min-width:0}
.brief-panel .field-row{gap:16px}
.brief-panel label,.field-label{font-size:12px;font-weight:500;display:block;color:var(--ink-2);margin:0 0 8px;letter-spacing:0;text-transform:none}
.brief-panel input:not([type=radio]):not([type=checkbox]),.brief-panel textarea{font:inherit;font-size:14px;width:100%;min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius-s);background:var(--paper);color:var(--ink);transition:border-color .2s}
.brief-panel textarea{resize:vertical;min-height:100px}
.brief-panel input::placeholder,.brief-panel textarea::placeholder{color:#778080}
.brief-page :focus-visible{outline:3px solid var(--teal);outline-offset:4px}
.brief-panel input:focus,.brief-panel textarea:focus{border-color:var(--teal);background:var(--paper)}
.brief-panel input[type=checkbox],.brief-panel input[type=radio]{accent-color:var(--teal);width:17px;height:17px;flex-shrink:0;margin:2px 0 0}
.field-help{font-size:11px;color:var(--muted);line-height:1.6;margin:7px 0 13px}
.service-fields{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:8px;margin-bottom:8px}
.brief-actions{display:flex;justify-content:space-between;gap:12px;margin-top:22px}
.brief-page button:disabled{opacity:.4;cursor:default;transform:none}
.brief-actions .btn-primary{background:var(--teal);color:white}
.draft-status{font-size:11px;color:var(--muted);margin:18px 0 4px}
.text-button{display:inline-block;font-size:12px;text-decoration:underline;text-underline-offset:4px;color:var(--teal-deep);padding:8px 0}
.muted-button{font-size:11px;color:var(--muted)}
.brief-error{color:#8b2c21;font-size:13px;padding:12px;border:1px solid #c47c69;border-radius:10px;background:#fff4ee;line-height:1.5}
.style-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.style-option{position:relative;cursor:pointer;border:1px solid var(--line);border-radius:var(--radius-m);overflow:hidden;background:var(--paper);padding:12px;margin:0!important;transition:border-color .2s}
.style-option:has(:checked),.palette-option:has(:checked){border-color:var(--teal);box-shadow:0 0 0 1px var(--teal)}
.style-option>input{position:absolute;right:12px;top:12px;z-index:1}
.style-mini{padding:15px 10px;background:var(--mini-bg);color:var(--mini-ink);border-radius:9px;margin-bottom:12px;min-height:102px;display:flex;flex-direction:column;align-items:start;gap:8px}
.style-mini small{font-size:8px;font-weight:500}
.style-mini b{font-family:var(--mini-font);font-size:19px;line-height:1.1;font-weight:500;max-width:110px}
.style-mini i{font-style:normal;font-size:7px;border-radius:var(--mini-radius);background:var(--mini-accent);color:var(--mini-button-ink);padding:4px 8px}
.style-option strong{display:block;font-size:12px;font-weight:600;margin-bottom:5px}
.style-option>small{display:block;font-size:10px;line-height:1.5;color:var(--muted);font-weight:400}
.palette-options{display:grid;gap:10px;margin-bottom:24px}
.palette-option{display:flex!important;gap:14px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:14px;cursor:pointer;margin:0!important;font-size:13px!important}
.palette-swatches{display:flex;padding-left:6px}
.palette-swatches i{width:25px;height:25px;border-radius:50%;border:2px solid white;margin-left:-6px;box-shadow:0 0 0 1px var(--line)}
.palette-option small{display:block;font-weight:400;font-size:10px;color:var(--muted)}
.brief-panel .upload-field input{font-size:11px!important;padding:10px!important}
.upload-field input::file-selector-button{border:0;background:var(--mint-soft);color:var(--teal-deep);padding:8px 10px;border-radius:7px;margin-right:8px;cursor:pointer}
.brief-tip{background:var(--mint-soft);border-radius:var(--radius-m);padding:20px;margin:0 0 24px;color:var(--teal-ink);font-size:12px;line-height:1.65}
.brief-tip strong{font-weight:600}
.brief-tip ul{margin:10px 0 0;padding-left:16px}
.brief-tip p{margin:12px 0 0}
.brief-panel .text-options legend{font-size:14px;letter-spacing:0;margin-top:12px}
.choice-row{display:flex!important;align-items:flex-start;gap:12px;font-size:13px!important;margin-bottom:16px!important;cursor:pointer;line-height:1.5}
.choice-row small{display:block;font-size:11px;font-weight:400;color:var(--muted);margin-top:4px}
.photo-thumbnails{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.media-thumbnail{min-width:0;margin:0}
.media-thumbnail img{width:100%;height:76px;object-fit:cover;border:1px solid var(--line);border-radius:10px}
.media-thumbnail figcaption{font-size:10px;overflow-wrap:anywhere;color:var(--muted);margin-top:5px}
.media-thumbnail button{font-size:10px;text-decoration:underline;padding:5px 0;color:var(--teal-deep)}
#logo-preview .media-thumbnail{max-width:160px}
#logo-preview img{object-fit:contain;background:var(--paper)}
.brief-summary{margin:0 0 22px;font-size:12px}
.brief-summary>div{display:grid;grid-template-columns:100px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.brief-summary dt{color:var(--muted)}
.brief-summary dd{margin:0;overflow-wrap:anywhere;white-space:pre-line}
.summary-details{margin-bottom:24px;font-size:12px;color:var(--teal-deep)}
.summary-details summary{cursor:pointer;padding:5px 0 10px}
.brief-success h2{font-size:36px;letter-spacing:-.04em;line-height:1.1;margin:24px 0}
.brief-success p{font-size:14px;line-height:1.7;color:var(--ink-2)}
.brief-success .text-button{display:block;margin-top:14px}
.preview-column{position:sticky;top:24px;padding-top:4px;min-width:0}
.preview-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:18px}
.preview-heading .sec-tag{font-size:10px;margin:0}
.preview-heading button{font-size:10px;text-decoration:underline;color:var(--muted);padding:8px 0}
.site-preview{--p-bg:#fff;--p-ink:#1f3a5f;--p-accent:#2f80ed;--p-button-ink:#fff;--p-font:var(--display);--p-radius:5px;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 24px 60px -35px rgba(14,27,28,.22);background:var(--p-bg)}
.browser-bar{display:flex;align-items:center;gap:16px;background:var(--cream);padding:12px 16px;color:#788582;font-size:9px;border-bottom:1px solid var(--line)}
.browser-bar>span:first-child{letter-spacing:2px;color:#b1bdb8;white-space:nowrap}
.browser-bar>span:last-child{background:var(--paper);padding:5px 10px;border-radius:5px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.preview-canvas{color:var(--p-ink);font-size:11px;overflow-wrap:anywhere}
.preview-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:22px 24px;font-size:8px}
.preview-brand{font-size:13px;font-weight:600;display:flex;gap:8px;align-items:center;min-width:0}
.preview-brand img{max-width:65px;max-height:30px;object-fit:contain}
.preview-nav>span{flex-shrink:0;opacity:.7}
.preview-hero{padding:24px;display:flex;flex-direction:column;gap:22px}
.preview-industry{display:block;font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:var(--p-ink);margin-bottom:12px}
.preview-hero h2{font-family:var(--p-font);font-size:clamp(24px,2.7vw,39px);line-height:1.08;letter-spacing:-.035em;font-weight:600;margin:0 0 14px}
.preview-hero p{font-size:11px;line-height:1.7;opacity:.8;margin:0 0 18px;white-space:pre-line}
.preview-cta{display:inline-block;background:var(--p-accent);color:var(--p-button-ink);border-radius:var(--p-radius);padding:10px 13px;font-size:9px;font-weight:600}
.preview-cover{aspect-ratio:16/9;background:color-mix(in srgb,var(--p-ink) 9%,var(--p-bg));border-radius:var(--p-radius);display:grid;place-items:center;overflow:hidden}
.preview-cover img{width:100%;height:100%;max-height:230px;object-fit:cover}
#cover-placeholder{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:10px;opacity:.65}
#cover-placeholder>span{font-size:36px;font-weight:400}
.preview-services{padding:10px 24px 28px}
.preview-canvas h3{font-family:var(--p-font);font-size:19px;line-height:1.2;font-weight:500;letter-spacing:-.025em;margin:0 0 16px}
.preview-service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.preview-service{background:color-mix(in srgb,var(--p-ink) 5%,var(--p-bg));border-radius:var(--p-radius);padding:13px 10px;min-width:0}
.preview-service h4{font-size:10px;margin:0 0 6px}
.preview-service p{font-size:9px;line-height:1.6;margin:0;opacity:.75;white-space:pre-line}
.preview-contact{padding:24px;background:color-mix(in srgb,var(--p-ink) 7%,var(--p-bg));display:flex;justify-content:space-between;gap:14px}
.preview-contact h3{font-size:19px;margin-bottom:8px}
.preview-contact p{font-size:9px;margin:3px 0}
.preview-disclaimer{font-size:10px;line-height:1.6;color:var(--muted);max-width:380px;margin:15px 0}
.site-preview[data-style=ludico] .preview-hero h2{font-weight:800;letter-spacing:-.05em;transform:rotate(-1deg)}
.site-preview[data-style=ludico] .preview-cover{border-radius:45px 12px 45px 12px}
.site-preview[data-style=artesanal]{container-type:inline-size}
.site-preview[data-style=artesanal] .preview-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.95fr);
  align-items:center;
  gap:clamp(14px,4cqi,28px);
  padding:clamp(16px,4.5cqi,30px);
}
.site-preview[data-style=artesanal] .preview-hero h2{
  font-size:clamp(38px,11cqi,72px);
  font-style:italic;
  line-height:1;
}
.site-preview[data-style=artesanal] .preview-cover{
  position:relative;
  aspect-ratio:3/4;
  border-radius:48% 48% 3px 3px;
}
.site-preview[data-style=artesanal] .preview-cover img{
  position:absolute;
  inset:0;
  max-height:none;
}
.site-preview[data-style=artesanal] .preview-cta{
  padding:5px 0;
  border-radius:0;
  border-bottom:1px solid currentColor;
  color:var(--p-ink);
  background:transparent;
}
@container (max-width:400px){
  .site-preview[data-style=artesanal] .preview-hero{gap:12px;padding:16px}
  .site-preview[data-style=artesanal] .preview-cover{aspect-ratio:2/3}
}
.site-preview[data-style=artesanal] .preview-hero h2,.site-preview[data-style=elegante] .preview-hero h2{font-weight:400}
.site-preview[data-style=natural] .preview-cover{border-radius:80px 80px 12px 12px}
.site-preview[data-style=elegante] .preview-hero-copy{text-align:center;padding-block:12px}
.site-preview[data-style=elegante] .preview-industry{letter-spacing:.22em}
.site-preview[data-style=elegante] .preview-contact{background:var(--p-ink);color:var(--p-bg)}
.brief-footer{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--line);margin-top:72px;padding-block:26px;font-size:11px;color:var(--muted)}
.brief-honeypot{display:none}
.skip-link{position:absolute;left:16px;top:-100px;padding:12px;z-index:100;background:var(--yellow)}
.skip-link:focus{top:8px}
.brief-notice{padding:20px;background:var(--mint-soft);border-radius:18px}
@media(min-width:1400px){.preview-column{top:32px}}
@media(max-width:960px){.brief-layout{gap:22px}.brief-panel{padding:24px}.brief-intro{padding-top:44px}.preview-heading{align-items:flex-start}.preview-hero,.preview-nav,.preview-services,.preview-contact{padding-left:18px;padding-right:18px}}
@media(max-width:760px){.brief-layout{grid-template-columns:1fr}.preview-column{position:static;margin-top:20px}.brief-intro{padding:36px 0}.brief-intro h1{font-size:48px;max-width:450px}.brief-intro>p{font-size:16px}.brief-panel{padding:24px}.brief-nav{padding-block:22px}.preview-hero h2{font-size:36px}.preview-canvas{font-size:13px}.preview-cover img{max-height:none}.preview-contact p{font-size:11px}.preview-service h4{font-size:12px}.preview-service p{font-size:10px}.preview-nav{font-size:10px}.preview-brand{font-size:15px}.preview-disclaimer{max-width:none}.brief-footer{margin-top:40px;flex-direction:column}.brief-meta{gap:8px 16px}.preview-heading .sec-tag{font-size:11px}}
@media(max-width:400px){.brief-panel{padding:20px}.brief-panel .field-row{grid-template-columns:1fr}.service-fields{grid-template-columns:1fr}.style-options{gap:8px}.style-option{padding:9px}.brief-intro h1{font-size:42px}.brief-summary>div{grid-template-columns:80px minmax(0,1fr)}.brief-meta{font-size:11px}}
@media(max-width:760px){.step-toolbar{position:sticky;top:0;z-index:5;background:var(--paper);padding:8px 0 14px;display:flex;align-items:center;justify-content:space-between;gap:10px}.step-toolbar .step-caption{margin:0}.mobile-preview-button{display:block;padding:9px 12px;border-radius:999px;background:var(--mint-soft);color:var(--teal-deep);font-size:11px;white-space:nowrap}#form-jump{margin:-4px 0 16px}.step-caption{scroll-margin-top:20px}}
@media(prefers-reduced-motion:reduce){.brief-page *, .brief-page *::before,.brief-page *::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

#brief-desde{scroll-margin-top:80px}


.brief-invitation{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,80px);align-items:center}
.brief-invitation .sec-desc{margin:18px 0 24px;max-width:48ch}
.brief-duration,.brief-example figcaption{font-size:13px;color:var(--teal-deep)}
.brief-duration{margin:12px 0 0}
.brief-example{margin:0}
.brief-example figcaption{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:12px;font-size:12px}
.brief-example figcaption strong{font-weight:500}
.brief-example figcaption span{color:var(--muted)}
@media(max-width:760px){.brief-invitation{grid-template-columns:1fr}.brief-example{max-width:520px}}
