.seo-page{display:block!important;background:var(--paper,#f1f0e9);color:#292726}.seo-main{max-width:1200px;width:calc(100% - 64px);margin:0 auto;padding:48px 44px 60px;border-inline:1px solid #30282522;min-width:0}.seo-breadcrumb,.seo-kicker,.seo-cards> a>span{font-family:'DM Mono',monospace;font-size:12px;letter-spacing:.04em}.seo-breadcrumb{margin-bottom:48px}.seo-hero{padding:24px 0 50px;border-bottom:1px solid #30282533}.seo-hero h1{font-size:clamp(36px,5.6vw,74px);line-height:1.04;letter-spacing:-.055em;max-width:950px;margin:22px 0}.seo-hero>p{font-size:20px;line-height:1.6;max-width:710px}.seo-section{display:grid;grid-template-columns:1fr 1.55fr;gap:42px;padding:46px 0;border-bottom:1px solid #30282522}.seo-section h2{font-size:clamp(25px,3vw,36px);line-height:1.15;letter-spacing:-.035em;margin:0;max-width:340px}.seo-section p{font-size:17px;line-height:1.8;margin:0 0 18px;max-width:66ch}.seo-section p:last-child{margin-bottom:0}.seo-section a{text-decoration:underline;text-underline-offset:4px;color:#462235}.seo-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:36px 0}.seo-cards>a{display:block;border:1px solid #30282533;padding:32px;background:linear-gradient(135deg,#fff8,transparent);transition:background .2s,transform .2s}.seo-cards>a:hover{background:#e5ed9f55;transform:translateY(-3px)}.seo-cards h3{font-size:32px;line-height:1.12;margin:24px 0 16px;letter-spacing:-.04em}.seo-cards p{font-size:16px;line-height:1.7}.seo-cards b{display:block;font-size:14px;margin-top:24px;font-weight:500}.seo-invite{padding:36px;margin-top:42px;background:#462235;color:#f1f0e9}.seo-invite h2{font-size:clamp(28px,3.5vw,44px);line-height:1.1;margin:16px 0}.seo-invite p{font-size:17px;line-height:1.6}.seo-invite>a{display:inline-flex;margin:18px 22px 0 0;color:inherit}.seo-invite .button{background:#e5ed9f;color:#292726}.seo-phone{font-size:clamp(26px,4vw,42px);white-space:nowrap}.seo-links{display:flex;flex-wrap:wrap;gap:14px 24px;padding:26px 0;margin:28px 0 0;border-top:1px solid #30282533;font-size:14px;line-height:1.6}.seo-links a:hover{text-decoration:underline;text-underline-offset:4px}.seo-links a:focus-visible,.seo-cards a:focus-visible{outline:2px solid #6552df;outline-offset:5px}main:not(.seo-main)>.seo-links{margin-inline:var(--pad,24px)}@media(max-width:700px){.seo-main{width:calc(100% - 24px);padding:28px 18px 40px}.seo-breadcrumb{margin-bottom:20px}.seo-hero{padding-top:12px}.seo-hero>p{font-size:18px}.seo-section{grid-template-columns:1fr;gap:22px;padding:32px 0}.seo-cards{grid-template-columns:1fr}.seo-cards>a,.seo-invite{padding:24px}.seo-links{gap:14px 20px}.seo-cards h3{font-size:28px}}@media(prefers-reduced-motion:reduce){.seo-cards>a{transition:none}.seo-cards>a:hover{transform:none}}
.seo-page{padding-top:var(--header,80px)}.seo-breadcrumb,.seo-kicker,.seo-cards>a>span{font-family:var(--mono)}
/* Recognizable buyer situations on the web design page. */
.seo-need-list{display:grid;gap:0;min-width:0}
.seo-need-list article{padding:0 0 24px;margin-bottom:24px;border-bottom:1px solid #30282522}
.seo-need-list article:last-child{padding:0;margin:0;border:0}
.seo-need-list h3{font-size:clamp(20px,2vw,26px);line-height:1.25;letter-spacing:-.025em;margin:0 0 10px}
.seo-need-list p{margin:0}
/* Secondary pages: one useful response per page, with the same quiet graphic grammar. */
.seo-workflow{min-width:0}
.seo-workflow-options details{border-top:1px solid #30282538}
.seo-workflow-options details:last-child{border-bottom:1px solid #30282538}
.seo-workflow-options summary{list-style:none;display:grid;grid-template-columns:78px minmax(0,1fr) 24px;align-items:center;gap:16px;min-height:78px;padding:14px 4px;cursor:pointer}
.seo-workflow-options summary::-webkit-details-marker{display:none}
.seo-workflow-options summary:focus-visible{outline:2px solid #6552df;outline-offset:3px}
.seo-workflow-options summary strong{font-size:clamp(17px,1.5vw,22px);line-height:1.3;letter-spacing:-.025em;font-weight:520}
.seo-sequence{font:11px/1.5 'DM Mono',monospace;color:#674d5d}
.seo-reveal-mark{position:relative;width:20px;height:20px;display:block}
.seo-reveal-mark::before,.seo-reveal-mark::after{content:"";position:absolute;background:#462235;top:9px;left:2px;width:16px;height:1px;transition:transform .25s ease}
.seo-reveal-mark::after{transform:rotate(90deg)}
.seo-workflow-options details[open] .seo-reveal-mark::after{transform:rotate(0)}
.seo-workflow-options details[open] summary strong{color:#462235}
.seo-option-body{padding:0 32px 24px 98px;animation:seoUnfold .28s ease both}
.seo-option-body p{font-size:16px;line-height:1.7;margin:0}
.seo-flow{position:relative;margin-top:22px;padding:20px 22px 16px;border:1px solid #30282529;background:linear-gradient(145deg,#e9e7df55,#f5f4ee88);overflow:hidden}
.seo-flow::before{content:"";position:absolute;right:-40px;top:-60px;width:170px;height:170px;border:1px solid #46223516;border-radius:50%;pointer-events:none}
.seo-flow-head,.seo-demo-head{display:flex;justify-content:space-between;gap:15px;font:11px/1.45 'DM Mono',monospace;letter-spacing:.035em;color:#5d5357}
.seo-flow ol{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;list-style:none;margin:24px 0 18px;padding:0}
.seo-flow ol::before{content:"";position:absolute;top:12px;left:12px;right:12px;height:1px;background:#46223567}
.seo-flow li{min-width:0;position:relative;padding-right:12px}
.seo-flow li>span{display:grid;place-items:center;width:25px;height:25px;background:#462235;color:#f5f4ee;border-radius:50%;font:10px 'DM Mono',monospace;margin-bottom:12px}
.seo-flow li strong{display:block;font-size:13px;line-height:1.5;font-weight:500}
.seo-flow-caption{border-top:1px solid #30282526;padding-top:10px;font:11px/1.5 'DM Mono',monospace;color:#462235!important;margin:0!important}
.seo-flow.is-updated ol{animation:seoUnfold .25s ease both}
@keyframes seoUnfold{from{opacity:.35;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

.seo-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.55fr);gap:42px;padding:48px 0;border-bottom:1px solid #30282522}
.seo-feature-intro{min-width:0}
.seo-feature-intro h2{max-width:350px;font-size:clamp(26px,3vw,37px);line-height:1.12;letter-spacing:-.04em;margin:18px 0}
.seo-feature-intro p{font-size:17px;line-height:1.7;max-width:32ch}
.seo-brand-demo,.seo-service-lens{min-width:0;border:1px solid #30282538;background:#f7f6f0}
.seo-demo-head{padding:18px 20px;border-bottom:1px solid #30282525}
.seo-demo-controls{display:flex;flex-wrap:wrap;gap:0;padding:0 12px;border-bottom:1px solid #30282525}
.seo-demo-controls button{font:inherit;font-size:13px;line-height:1.5;min-height:44px;padding:10px 11px;margin:0 3px;border:0;border-bottom:2px solid transparent;background:none;color:#5c5158;cursor:pointer;transition:color .2s,border-color .2s}
.seo-demo-controls button:hover,.seo-demo-controls button[aria-pressed="true"]{color:#462235;border-color:#462235}
.seo-demo-controls button:focus-visible{outline:2px solid #6552df;outline-offset:-3px}
.seo-brand-stage{display:grid;align-items:stretch;min-height:270px;padding:18px;background:radial-gradient(circle at 84% 18%,#e5ed9f55,transparent 42%),#f7f6f0;overflow:hidden}
.seo-brand-stage [hidden],.seo-lens-stage [hidden]{display:none!important}
.seo-brand-stage>div:not([hidden]),.seo-lens-stage>div:not([hidden]){animation:seoUnfold .3s ease both}
.seo-brand-document{display:flex;flex-direction:column;justify-content:space-between;padding:22px;background:#fffefa;box-shadow:0 8px 28px #30282518;max-width:470px;width:100%;margin:auto}
.seo-brand-rule,.seo-brand-doc-footer,.seo-screen-top{display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid #30282530;padding-bottom:9px}
.seo-brand-rule strong,.seo-screen-top strong{font-size:19px;letter-spacing:-.045em}
.seo-brand-rule span,.seo-brand-doc-footer,.seo-screen-top span,.seo-screen-body>span,.seo-brand-small>span{font:10px/1.5 'DM Mono',monospace;letter-spacing:.025em}
.seo-brand-doc-title{font-size:clamp(28px,3vw,45px);letter-spacing:-.055em;line-height:1.08;padding:27px 0 22px}
.seo-brand-doc-title em{font-family:var(--serif,serif);font-weight:400;color:#462235}
.seo-brand-doc-footer{padding:9px 0 0;border-top:1px solid #30282530;border-bottom:0}
.seo-brand-screen{display:flex;flex-direction:column;background:#462235;color:#fffefa;width:100%;max-width:470px;margin:auto;min-height:230px;padding:14px 18px}
.seo-screen-top{border-color:#fff5}.seo-screen-body{display:flex;flex-direction:column;justify-content:center;gap:13px;flex:1;padding:15px 0}
.seo-screen-body strong{font-size:clamp(25px,3vw,38px);line-height:1.04;letter-spacing:-.045em;font-weight:500}
.seo-brand-small{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;max-width:470px;width:100%;min-height:230px;margin:auto;background:#e5ed9f;color:#462235;text-align:center;padding:22px}
.seo-brand-small img{display:block;width:64px;height:64px;object-fit:contain}.seo-brand-small strong{font-size:26px;letter-spacing:-.05em}.seo-brand-small>span{max-width:25ch}
.seo-demo-note{font:11px/1.6 'DM Mono',monospace;color:#5d5357;padding:14px 20px;margin:0}
.seo-service-lens{margin-top:25px}
.seo-lens-stage{min-height:174px;padding:27px 20px 22px;background:radial-gradient(circle at 100% 0,#e5ed9f66,transparent 55%)}
.seo-lens-path{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:19px}
.seo-lens-path>span{position:relative;border-top:1px solid #4622357c;padding-top:12px;font:11px/1.5 'DM Mono',monospace;color:#462235}
.seo-lens-path>span::before{content:"";position:absolute;top:-3px;left:0;width:5px;height:5px;border-radius:50%;background:#462235}
.seo-lens-stage p{font-size:16px;line-height:1.65;max-width:52ch;margin:0}
.seo-lens-link{display:flex;justify-content:space-between;gap:14px;padding:15px 20px;border-top:1px solid #30282525;font-size:14px;text-decoration:none!important}
.seo-lens-link span{transition:transform .2s}.seo-lens-link:hover span{transform:translate(2px,-2px)}

.seo-read-index{position:relative;display:grid;grid-template-columns:1.25fr repeat(3,minmax(0,1fr));gap:0;align-items:stretch;border-bottom:1px solid #30282528;background:#f1f0e9;margin:0;padding:0 0 2px;--read-progress:0}
.seo-read-index>.seo-read-label{font:11px/1.4 'DM Mono',monospace;letter-spacing:.025em;color:#5d5357;align-self:center;padding:18px 12px 18px 0}
.seo-read-index a{display:flex;gap:9px;align-items:center;padding:16px 12px;min-height:54px;border-left:1px solid #3028251a;font-size:13px;line-height:1.4;transition:background .2s,color .2s}
.seo-read-index a>span{font:10px 'DM Mono',monospace;color:#6b5762}
.seo-read-index a:hover,.seo-read-index a[aria-current="location"]{background:#e5ed9f44;color:#462235}
.seo-read-index a:focus-visible{outline:2px solid #6552df;outline-offset:-3px}
.seo-read-track{position:absolute;bottom:0;left:0;width:100%;height:2px;background:#462235;transform:scaleX(var(--read-progress));transform-origin:left center;pointer-events:none}
@media(min-width:901px){.seo-read-index{position:sticky;top:var(--header,80px);z-index:12;backdrop-filter:blur(10px)}}
@media(max-width:700px){.seo-feature{grid-template-columns:1fr;gap:20px;padding:34px 0}.seo-feature-intro p{max-width:65ch}.seo-workflow-options summary{grid-template-columns:62px minmax(0,1fr) 20px;gap:10px}.seo-option-body{padding-left:72px}.seo-sequence{font-size:10px}.seo-flow{padding:17px}.seo-flow li strong{font-size:12px}.seo-demo-head{padding:15px}.seo-brand-stage{padding:12px}.seo-brand-document{min-height:220px}.seo-brand-doc-title{font-size:32px}.seo-read-index{grid-template-columns:1fr 1fr;gap:0}.seo-read-index>.seo-read-label{grid-column:1/-1;padding:12px 0 7px}.seo-read-index a:last-of-type{grid-column:1/-1}.seo-read-index a{min-height:45px;padding:11px 9px;font-size:12px;line-height:1.4}.seo-lens-path{gap:6px}.seo-lens-path>span{font-size:10px}.seo-demo-controls button{font-size:12px}}
@media(max-width:380px){.seo-flow ol{grid-template-columns:1fr;gap:14px}.seo-flow ol::before{left:12px;right:auto;top:12px;bottom:16px;width:1px;height:auto}.seo-flow li{display:flex;gap:14px;align-items:center}.seo-flow li>span{margin:0;flex:none}.seo-lens-path{grid-template-columns:1fr}.seo-read-index a{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){.seo-flow.is-updated ol,.seo-option-body,.seo-brand-stage>div:not([hidden]),.seo-lens-stage>div:not([hidden]){animation:none}.seo-reveal-mark::after,.seo-reveal-mark::before,.seo-demo-controls button,.seo-read-index a{transition:none}}
.seo-main .seo-section[id^="lectura-"]{scroll-margin-top:calc(var(--header,80px) + 80px)}
@media(max-width:900px){.seo-main .seo-section[id^="lectura-"]{scroll-margin-top:calc(var(--header,68px) + 18px)}}
