.input-container{z-index:0;background:linear-gradient(135deg,#b3d0fd 0%,#a4caf8 100%);border-radius:1000px;place-content:center;width:90%;max-width:780px;margin:0 auto;padding:6px;display:grid;position:relative}.input-container input[type=search]::-webkit-search-cancel-button{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666666'><path d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/></svg>");width:20px;height:20px;transition:background-image .2s}.input-container input[type=search]::-webkit-search-cancel-button:hover{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2301142B'><path d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/></svg>")}.search-container{background:linear-gradient(135deg,#dae8f7 0%,#d6e5f7 100%);border-radius:50px;align-items:center;gap:5px;width:100%;max-width:760px;margin:0 auto;padding:4px;display:flex;position:relative}.search-container:before{content:"";-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(#fff 0%,#dae8f7 100%);border-radius:50px;padding:1px;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.search-container:after{content:"";-webkit-mask-composite:xor;z-index:-1;pointer-events:none;background:linear-gradient(#d3e8ff 0%,#a3ceff 100%);border-radius:50px;padding:1px;position:absolute;inset:-1px;box-shadow:3px 3px 5px #4f9ce8b3;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.input{color:#01142b;z-index:1;will-change:transform;background:linear-gradient(135deg,#dae8f7 0%,#d6e5f7 100%);border:none;border-radius:50px;flex:1;width:auto;min-width:auto;height:40px;padding:8px 12px;font-size:16px;position:relative;transform:translateZ(0)}.input::placeholder{color:#9ebcd9;opacity:1}.input:focus{z-index:2;background:linear-gradient(135deg,#eff7ff 0%,#d6e5f7 100%);outline:none}.search__icon{cursor:pointer;border-left:2px solid #fff;flex-shrink:0;width:30px;min-width:30px;height:30px;margin-right:5px;padding-left:8px;transition:all .2s}.search__icon:hover{border-left:3px solid #01142b}.search__icon path{fill:#fff}@media (max-width:768px){.input-container{z-index:0;background:linear-gradient(135deg,#b3d0fd 0%,#a4caf8 100%);border-radius:1000px;place-content:center;width:auto;max-width:300px;margin:0 auto;padding:10px;display:grid;position:relative}.search-container{background:linear-gradient(135deg,#dae8f7 0%,#d6e5f7 100%);border-radius:50px;align-items:center;width:100%;padding:5px;display:flex;position:relative}.search-container:after,.search-container:before{content:"";border-radius:inherit;width:100%;height:100%;position:absolute}.search-container:before{z-index:-1;background:linear-gradient(#fff 0%,#dae8f7 100%);top:-1px;left:-1px}.search-container:after{z-index:-2;background:linear-gradient(#d3e8ff 0%,#a3ceff 100%);bottom:-1px;right:-1px;box-shadow:3px 3px 5px #4f9ce8b3,5px 5px 20px #4f9ce8b3}.input{background:linear-gradient(135deg,#dae8f7 0%,#d6e5f7 100%);border:none;border-radius:50px;width:100%;padding:10px;font-size:14px}.input::placeholder{content:"Escribe tu Idea...?";font-size:14px}.input:focus{background:linear-gradient(135deg,#eff7ff 0%,#d6e5f7 100%);outline:none}.search__icon{aspect-ratio:1;border-top:3px solid #0000;border-bottom:3px solid #0000;border-left:2px solid #fff;border-radius:50%;width:30px;margin-right:5px;padding-left:8px}.search__icon:hover{border-left:3px solid #fff}.search__icon path{fill:#fff}}@media (min-width:769px){html body .input{width:650px}html body .input-container{width:70%;max-width:720px;padding:.8%}html body .input::placeholder{content:"Que Deseas Crear? Escribe Tu Idea...";opacity:1}}
.header-search-container{width:100%;max-width:700px;margin:0 auto;position:relative}.header-input-container{--input-border:#3af4ef;--input-focus-h:245;--input-focus-s:100%;--input-focus-l:42%}.header-search-container input{color:#fff;background:#01142b;border:2px solid #3af4ef;border-radius:20px;width:100%;padding:.8rem 3rem .8rem 1.5rem;font-size:1rem;font-weight:500;transition:border-radius .3s}.header-search-container input:focus{border-color:#3af4ef;border-radius:20px;outline:none;box-shadow:0 0 0 2px #3af4ef33}.header-search__icon{cursor:pointer;width:20px;height:20px;position:absolute;top:50%;right:1rem;transform:translateY(-50%)}.header-search__icon path{fill:#3af4ef;transition:fill .2s}@media (max-width:1280px){.header-search-container{max-width:700px}}@media (max-width:1024px){.header-search-container{max-width:600px}}
