/* Acabado de producto: el ejemplo web y su lectura forman una misma pieza. */
body{background:#f6f7fb}.nav{max-width:none;padding-left:6vw;padding-right:6vw;height:84px;background:#f6f7fb}.hero{grid-template-columns:.88fr 1.12fr;gap:5.5vw;background:#f6f7fb;padding:55px 6vw 0;align-items:center;min-height:calc(100svh - 84px)}.hero::before{width:49%;top:36px;bottom:80px;right:-5%;border-radius:200px 0 0 30px;background:linear-gradient(135deg,#e7edff 0%,#c4d2ff 45%,#3659d8 100%);transform:skewY(-4deg)}.hero::after{content:'';position:absolute;right:-14%;top:60px;bottom:80px;width:50%;border:1px solid #90a5ed;border-radius:50%;z-index:-1;transform:rotate(-20deg);pointer-events:none}.hero-copy{max-width:560px;padding-top:0}.hero h1{font-size:clamp(56px,4.8vw,82px);line-height:1.02;letter-spacing:-.065em;color:#15233e;font-weight:650}.hero .intro{font-size:12px;color:#52627f;margin-bottom:24px}.hero .handwritten{color:#c85839;font-size:clamp(52px,4.7vw,78px);margin:16px 0 22px}.hero-subtitle{font-size:17px!important;font-weight:600}.hero .lead{font-size:15px;line-height:1.8;max-width:430px}.hero #domain-form{margin-top:30px}.hero .url-box{border:1px solid #b4c1da;border-radius:9px;box-shadow:0 9px 30px #14213d0a;padding:7px 7px 7px 17px}.hero .url-box button{border-radius:5px}.hero .form-meta{font-size:10px;gap:20px}.hero .demo-label{font-size:10px;color:#68758a}.hero .hero-bottom{margin-top:42px;padding:19px 0;color:#66748a;font-size:10px;border-color:#d4ddeb}.hero .hero-bottom a{color:#243b71}.real-stage{padding:0;min-width:0;position:relative}.scene-heading{color:#263c71;font-size:12px;margin:0 2px 16px}.interactive-label{color:#4a608d;font-size:10px}.browser-scene{transform:none;border:1px solid #b8c5e1;border-radius:12px;box-shadow:0 30px 60px #1c367c2b,0 3px 10px #1b357a15;background:white}.browser-chrome{height:39px;background:linear-gradient(#f5f7fb,#e9edf5);padding:0 13px;border-bottom:1px solid #d6deeb}.browser-address{font-size:9px;height:24px;max-width:340px;border:1px solid #dce3ee}.window-dots i{width:6px;height:6px;background:#bcc5d5}.window-dots i:first-child{background:#ddaaa2}.window-dots i:nth-child(2){background:#e0c99a}.window-dots i:nth-child(3){background:#9fbaa7}.example-site{height:450px;background:#f8f7f2}.example-nav{padding:19px 26px;border-bottom:1px solid #dedfd6;background:#f8f7f2}.example-nav b{font-size:26px}.example-nav>span{font-size:9px;color:#556b62}.example-content{padding:30px 26px;height:100%}.example-content>span{font-size:8px;letter-spacing:.2px;color:#6a7b70}.example-content h2{font-size:32px;letter-spacing:-1.3px;line-height:1.08;margin-top:20px;max-width:300px}.example-content p{font-size:10px;line-height:1.7;margin-top:13px}.example-button{font-size:9px;background:none;padding:0 0 8px;color:#274440;border-bottom:1px solid #7a8e81;border-radius:0;margin-top:22px;display:flex;justify-content:space-between;width:145px}.website-graphic{position:absolute;right:-3px;top:23px;width:34%;height:290px;overflow:hidden;border-radius:100px 0 0 0}.website-graphic svg{width:100%;height:100%;stroke:none;object-fit:cover}.website-graphic>span{position:absolute;bottom:16px;right:14px;color:#2c4b3c;font-size:8px;writing-mode:vertical-rl}.page-shade{background:#162d3b15;backdrop-filter:blur(0)}.real-cookie{left:20px;right:20px;bottom:19px;border-radius:9px;border:1px solid #c6d0df;padding:20px 23px;box-shadow:0 16px 45px #152a4233;background:#ffffff}.cookie-eyebrow{font-size:8px;color:#65748b;display:block;margin-bottom:11px}.cookie-top{gap:9px}.cookie-top svg{width:22px;height:22px;stroke:#2b4eb6}.cookie-top strong{font-size:16px;letter-spacing:-.4px;font-weight:650}.real-cookie p{font-size:11px;line-height:1.7;margin-top:10px;max-width:480px;color:#53627a}.real-cookie>a{font-size:9px;margin-top:8px}.real-cookie-actions{margin-top:18px;gap:8px}.real-cookie-actions button{border:1px solid #9caac2;border-radius:5px;min-height:37px;font-size:10px;font-weight:550}.real-cookie-actions button:last-child{background:#2449d2;border-color:#2449d2}.visual-reading{background:#fff;display:flex;align-items:center;justify-content:space-between;padding:20px 22px;margin:15px 0 0;border-radius:9px 9px 0 0;border:1px solid #cbd6e9;border-bottom:0;box-shadow:0 16px 35px #1835750b}.reading-node{display:flex;align-items:center;gap:8px;color:#6a7990;flex-shrink:0}.node-symbol{width:30px;height:30px;display:grid;place-items:center;background:#f1f4f9;border:1px solid #e2e8f3;border-radius:8px}.node-symbol svg{width:17px;height:17px}.reading-node b{font-size:10px;font-weight:600;display:block}.reading-node small{font-size:8px;display:block;margin-top:4px;color:#6b7890}.reading-node.is-current{color:#2449d2}.reading-node.is-current .node-symbol{background:#edf1ff;border-color:#c7d3ff}.reading-connector{height:1px;min-width:10px;flex:1;margin:0 12px;background:#dbe2ee}.scene-evidence{margin:0;border:1px solid #cbd6e9;border-top:1px solid #e5eaf3;border-radius:0 0 9px 9px;box-shadow:0 16px 35px #1835750b;padding:15px 22px;min-height:91px}.scene-evidence strong{font-size:12px}.scene-evidence p{font-size:11px;line-height:1.65;max-width:430px}.scene-step{font-size:9px;border:0;padding:0}.evidence-dot{width:5px;height:5px}.scene-bottom{color:#405884;margin:11px 2px 0;font-size:9px}.scene-bottom button{color:#264374;font-size:10px}.choice-explanation{margin:12px 0 0;border-radius:9px;border:1px solid #cbd6e9;box-shadow:none}.hero:has(.choice-explanation:not([hidden])) .hero-copy{padding-top:15px}.accepted-note{left:25px;bottom:30px;border-radius:6px;background:white;border-color:#c1d8d0;color:#296655;box-shadow:0 8px 25px #25473815}.consent-map{border-color:#a0b8e05c}.rights-console,.pillar-detail{border-radius:12px}.report-sheet{border-radius:12px;transform:none;border:1px solid #d4dfef}.report-switch button{border-radius:5px}.consent-story .consent-key{border-radius:0 8px 8px 0}
@media(min-width:1700px){.hero{padding-left:max(7vw,calc((100vw - 1500px)/2));padding-right:max(7vw,calc((100vw - 1500px)/2))}.example-site{height:485px}.example-content h2{font-size:37px}.real-cookie{padding:23px 26px}.real-cookie p{font-size:12px}.cookie-top strong{font-size:18px}.real-cookie-actions button{font-size:11px;min-height:41px}}
@media(max-width:1100px){.hero{gap:4vw;padding-left:5vw;padding-right:5vw;grid-template-columns:.9fr 1.1fr}.hero h1{font-size:55px}.hero .handwritten{font-size:57px}.example-content h2{font-size:27px}.website-graphic{width:29%}.real-cookie{padding:17px;left:13px;right:13px}.cookie-top strong{font-size:14px}.real-cookie p{font-size:10px}.real-cookie-actions button{font-size:9px}.visual-reading{padding:16px}.reading-node{gap:6px}.reading-connector{margin:0 6px}.reading-node small{font-size:7px}.node-symbol{width:26px;height:26px}.scene-evidence{padding:14px 16px}.example-site{height:440px}.hero .form-meta{gap:11px;font-size:9px}}
@media(max-width:720px){.nav{height:72px;padding:0 6vw}.hero{display:block;padding:40px 6vw 0}.hero::before{top:710px;bottom:80px;width:100%;right:-10%;border-radius:80px 0 0 0;transform:skewY(-7deg)}.hero::after{display:none}.hero h1{font-size:57px}.hero .handwritten{font-size:55px}.hero .lead{font-size:15px}.hero .form-meta{font-size:10px;gap:14px}.real-stage{margin-top:50px;padding:0}.scene-heading{font-size:10px}.interactive-label{font-size:9px}.browser-chrome{height:35px;gap:9px}.example-nav{padding:17px 20px}.example-nav>span{font-size:7px}.example-content{padding:28px 20px}.example-content h2{font-size:28px}.website-graphic{width:30%;right:-13px}.example-site{height:470px}.real-cookie{padding:17px;left:12px;right:12px;bottom:14px}.real-cookie p{font-size:11px}.cookie-top strong{font-size:14px}.real-cookie-actions button{font-size:9px;min-width:65px}.visual-reading{padding:15px 12px}.reading-node{gap:5px}.reading-node b{font-size:9px}.reading-node small{font-size:7px}.node-symbol{width:24px;height:24px;border-radius:6px}.reading-connector{margin:0 5px}.scene-evidence{padding:15px;min-height:110px}.scene-step{display:none}.scene-evidence strong{font-size:12px}.scene-evidence p{font-size:11px}.hero .hero-bottom{background:transparent;padding:20px 0;margin:30px 0 0;font-size:9px}.scene-bottom{font-size:8px}.hero:has(.choice-explanation:not([hidden])) .hero-copy{padding-top:0}}
