
/*
Theme Name: Ricodoit
Theme URI: https://ricodoit.com/
Author: Ricodoit
Description: Landing page corporativa para Ricodoit, basada en el diseño proporcionado.
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: ricodoit
*/
:root{--primary:#00AEEF;--primary-dark:#008DBF;--primary-light:#EAF8FD;--dark:#101820;--dark-2:#18232c;--gray-dark:#53565A;--gray:#68727a;--gray-light:#f4f7f9;--white:#fff;--border:#e7ecef;--shadow-sm:0 8px 30px rgba(16,24,32,.06);--shadow-md:0 20px 60px rgba(16,24,32,.10);--shadow-lg:0 30px 90px rgba(16,24,32,.16);--radius-sm:12px;--radius-md:20px;--radius-lg:30px;--container:1200px;--transition:.35s cubic-bezier(.2,.8,.2,1)}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--dark);background:#fff;line-height:1.7;overflow-x:hidden}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}.container{width:min(var(--container),calc(100% - 40px));margin:auto}.section{padding:120px 0}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--primary);background:var(--primary-light);padding:8px 14px;border-radius:100px;font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:22px}.eyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--primary)}.section-title{max-width:760px;margin-bottom:60px}.section-title.center{text-align:center;margin-left:auto;margin-right:auto}.section-title h2{font-size:clamp(2.3rem,5vw,4rem);line-height:1.05;letter-spacing:-.05em;margin-bottom:22px}.section-title p{color:var(--gray);font-size:1.1rem;max-width:700px}.section-title.center p{margin:auto}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 25px;border-radius:100px;font-size:.95rem;font-weight:700;transition:var(--transition);cursor:pointer;border:1px solid transparent}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 12px 30px rgba(0,174,239,.22)}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-3px);box-shadow:0 18px 35px rgba(0,174,239,.3)}.btn-secondary{background:#fff;border-color:var(--border);color:var(--dark)}.btn-secondary:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-3px)}.btn-arrow{font-size:1.2rem;transition:var(--transition)}.btn:hover .btn-arrow{transform:translateX(4px)}
.site-header{position:fixed;top:0;left:0;width:100%;z-index:1000;background:rgba(255,255,255,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(0,0,0,.04)}.navbar{height:82px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:1.45rem;font-weight:900;letter-spacing:-.06em}.brand span{color:var(--primary)}.nav-links{display:flex;align-items:center;gap:30px;list-style:none}.nav-links a{font-size:.9rem;font-weight:600;color:var(--gray-dark);transition:var(--transition)}.nav-links a:hover{color:var(--primary)}.nav-cta{margin-left:10px}.mobile-menu{display:none;border:0;background:transparent;font-size:1.7rem;cursor:pointer}
.hero{min-height:100vh;display:flex;align-items:center;padding-top:82px;position:relative;overflow:hidden;background:radial-gradient(circle at 80% 20%,rgba(0,174,239,.13),transparent 32%),linear-gradient(135deg,#f7fbfd 0%,#fff 65%)}.hero:before{content:"";position:absolute;width:500px;height:500px;right:-220px;bottom:-220px;border-radius:50%;background:rgba(0,174,239,.07)}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:70px;position:relative;z-index:1}.hero-content h1{font-size:clamp(3.1rem,6vw,6rem);line-height:.98;letter-spacing:-.065em;max-width:800px;margin-bottom:28px}.hero-content h1 span{color:var(--primary)}.hero-content>p{max-width:680px;color:var(--gray);font-size:1.18rem;margin-bottom:35px}.hero-actions{display:flex;gap:14px;flex-wrap:wrap}.hero-note{display:flex;align-items:center;gap:10px;margin-top:30px;color:var(--gray);font-size:.86rem}.hero-note strong{color:var(--dark)}
.hero-visual{position:relative;min-height:520px}.visual-main{position:absolute;width:90%;right:0;top:30px;border-radius:25px;overflow:hidden;background:#fff;box-shadow:var(--shadow-lg);transform:rotate(2deg);border:1px solid rgba(0,0,0,.06)}.browser-top{height:42px;display:flex;align-items:center;gap:7px;padding:0 16px;background:#f5f7f8;border-bottom:1px solid var(--border)}.browser-dot{width:9px;height:9px;border-radius:50%;background:#ccd3d7}.browser-content{min-height:430px;padding:30px;background:linear-gradient(135deg,#fff,#edf9fd)}.fake-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:55px}.fake-logo{width:85px;height:12px;border-radius:20px;background:var(--primary)}.fake-nav{display:flex;gap:10px}.fake-nav span{width:38px;height:7px;border-radius:20px;background:#cbd5da}.fake-hero{max-width:450px}.fake-hero h3{font-size:2.7rem;line-height:1;letter-spacing:-.05em;margin-bottom:15px}.fake-hero h3 span{color:var(--primary)}.fake-lines{display:grid;gap:8px;margin-bottom:20px}.fake-lines span{display:block;width:90%;height:8px;border-radius:10px;background:#cdd8dd}.fake-lines span:nth-child(2){width:70%}.fake-button{width:120px;height:38px;border-radius:100px;background:var(--primary)}.floating-card{position:absolute;right:-25px;bottom:50px;padding:22px;background:#fff;border-radius:18px;box-shadow:var(--shadow-md);width:190px;transform:rotate(-3deg)}.floating-card small{color:var(--gray);font-size:.75rem}.floating-card strong{display:block;font-size:1.7rem;margin:4px 0;color:var(--dark)}.floating-card span{color:#18a96b;font-size:.75rem;font-weight:700}
.problem,.technology{background:var(--dark);color:#fff}.problem-grid,.technology-content{display:grid;grid-template-columns:.9fr 1.1fr;gap:100px;align-items:center}.problem .eyebrow{background:rgba(0,174,239,.12)}.problem h2,.technology h2{font-size:clamp(2.5rem,5vw,4.5rem);line-height:1;letter-spacing:-.05em}.problem h2 span,.technology h2 span{color:var(--primary)}.problem-text p{color:#b6c0c6;font-size:1.05rem;margin-top:25px}.problem-list{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.problem-item{padding:25px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(255,255,255,.025);transition:var(--transition)}.problem-item:hover{transform:translateY(-5px);border-color:rgba(0,174,239,.5);background:rgba(0,174,239,.06)}.problem-icon{font-size:1.6rem;margin-bottom:12px}.problem-item strong{display:block;margin-bottom:6px}.problem-item p{color:#9ca8ae;font-size:.88rem}
.services{background:#fff}.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.service-card{position:relative;padding:38px;border:1px solid var(--border);border-radius:var(--radius-md);background:#fff;transition:var(--transition);overflow:hidden}.service-card:before{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:var(--primary);transform:scaleX(0);transform-origin:left;transition:var(--transition)}.service-card:hover{transform:translateY(-8px);border-color:transparent;box-shadow:var(--shadow-md)}.service-card:hover:before{transform:scaleX(1)}.service-number{color:var(--primary);font-size:.8rem;font-weight:800;letter-spacing:.1em;margin-bottom:30px}.service-card h3{font-size:1.45rem;margin-bottom:12px}.service-card p{color:var(--gray);font-size:.92rem}.service-link{display:inline-flex;margin-top:25px;color:var(--primary);font-size:.85rem;font-weight:700}
.process{background:var(--gray-light)}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}.process-item{padding:35px;border-top:1px solid #dce3e7;position:relative}.process-item:not(:last-child):after{content:"→";position:absolute;right:-12px;top:30px;width:25px;height:25px;display:flex;align-items:center;justify-content:center;background:var(--gray-light);color:var(--primary);font-weight:800;z-index:2}.process-number{font-size:3.2rem;font-weight:800;color:#d9e1e5;line-height:1;margin-bottom:25px}.process-item h3{font-size:1.2rem;margin-bottom:10px}.process-item p{color:var(--gray);font-size:.9rem}
.portfolio-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.project{border-radius:var(--radius-lg);overflow:hidden;background:var(--gray-light);transition:var(--transition)}.project:hover{transform:translateY(-8px);box-shadow:var(--shadow-md)}.project-image{height:330px;position:relative;overflow:hidden;background:linear-gradient(135deg,#e9f7fb,#d9eef4)}.project-browser{position:absolute;left:7%;right:7%;top:12%;height:85%;border-radius:14px 14px 0 0;overflow:hidden;background:#fff;box-shadow:0 20px 50px rgba(0,0,0,.15)}.project-browser-top{height:28px;background:#f3f5f6;border-bottom:1px solid #e5e8ea}.project-site{padding:25px;height:calc(100% - 28px)}.project-site-title{width:65%;height:35px;background:var(--primary);border-radius:8px;margin-bottom:20px}.project-site-line{width:85%;height:9px;background:#d8e0e4;border-radius:10px;margin-bottom:8px}.project-site-line.short{width:60%}.project-site-boxes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:25px}.project-site-boxes span{height:80px;border-radius:8px;background:#edf2f4}.project-info{padding:30px}.project-tag{color:var(--primary);font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.project-info h3{font-size:1.5rem;margin:8px 0 10px}.project-info p{color:var(--gray);font-size:.9rem;margin-bottom:20px}.project-link{color:var(--dark);font-weight:700;font-size:.85rem}.project-link span{color:var(--primary);margin-left:5px}
.technology-content{grid-template-columns:.9fr 1.1fr;gap:80px}.technology h2{font-size:clamp(2.5rem,5vw,4rem)}.technology p{color:#aeb9bf;margin-top:22px;max-width:550px}.tech-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.tech{min-height:100px;display:flex;align-items:center;justify-content:center;padding:20px;border:1px solid rgba(255,255,255,.1);border-radius:15px;color:#dce3e7;font-size:.9rem;font-weight:700;transition:var(--transition)}.tech:hover{border-color:var(--primary);color:var(--primary);background:rgba(0,174,239,.05)}
.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.team-copy h2{font-size:clamp(2.5rem,5vw,4rem);line-height:1;letter-spacing:-.05em;margin-bottom:25px}.team-copy h2 span{color:var(--primary)}.team-copy p{color:var(--gray);margin-bottom:18px}.team-members{display:grid;gap:15px}.member{display:flex;align-items:center;gap:20px;padding:25px;border:1px solid var(--border);border-radius:18px;transition:var(--transition)}.member:hover{transform:translateX(6px);border-color:var(--primary);box-shadow:var(--shadow-sm)}.member-avatar{width:65px;height:65px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;background:var(--primary-light);color:var(--primary);font-size:1.2rem;font-weight:800}.member h3{font-size:1.1rem;margin-bottom:3px}.member span{color:var(--primary);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.cta{padding:80px 0}.cta-box{position:relative;overflow:hidden;padding:75px;border-radius:35px;background:radial-gradient(circle at 80% 20%,rgba(255,255,255,.18),transparent 25%),var(--primary);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:50px}.cta-box h2{font-size:clamp(2.2rem,5vw,4rem);line-height:1;letter-spacing:-.05em;max-width:700px}.cta-box p{margin-top:15px;color:rgba(255,255,255,.85);max-width:650px}.cta-box .btn{background:#fff;color:var(--dark);flex-shrink:0}.cta-box .btn:hover{transform:translateY(-3px);background:var(--dark);color:#fff}
.contact{background:var(--gray-light)}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}.contact-info h2{font-size:clamp(2.5rem,5vw,4rem);line-height:1;letter-spacing:-.05em;margin-bottom:20px}.contact-info h2 span{color:var(--primary)}.contact-info>p{color:var(--gray);margin-bottom:35px}.contact-detail{margin-bottom:20px}.contact-detail small{display:block;color:var(--gray);font-size:.75rem;text-transform:uppercase;font-weight:800;letter-spacing:.08em}.contact-detail strong{font-size:1rem}.contact-form{background:#fff;padding:40px;border-radius:25px;box-shadow:var(--shadow-md)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-group{margin-bottom:15px}.form-group label{display:block;margin-bottom:7px;font-size:.8rem;font-weight:700}.form-group input,.form-group textarea,.form-group select{width:100%;border:1px solid var(--border);border-radius:10px;padding:14px 15px;font-size:.9rem;outline:none;background:#fafcfd;transition:var(--transition)}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--primary);background:#fff;box-shadow:0 0 0 4px rgba(0,174,239,.08)}.form-group textarea{min-height:130px;resize:vertical}.form-submit{width:100%;border:0;margin-top:5px}.form-note{margin-top:12px;text-align:center;color:var(--gray);font-size:.72rem}
footer{background:#0b1116;color:#8d989e;padding:55px 0 25px}.footer-top{display:flex;justify-content:space-between;gap:40px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.08)}.footer-brand .brand{color:#fff;display:inline-block;margin-bottom:15px}.footer-brand p{max-width:350px;font-size:.85rem}.footer-links{display:flex;gap:25px;flex-wrap:wrap}.footer-links a{font-size:.8rem;transition:var(--transition)}.footer-links a:hover{color:var(--primary)}.footer-bottom{padding-top:25px;display:flex;justify-content:space-between;gap:20px;font-size:.75rem}.footer-bottom strong{color:#fff}.reveal{opacity:0;transform:translateY(30px);transition:.8s ease}.reveal.visible{opacity:1;transform:translateY(0)}
@media(max-width:1000px){.hero-grid,.problem-grid,.technology-content,.team-grid,.contact-grid{grid-template-columns:1fr}.hero{padding-top:130px;padding-bottom:80px}.hero-content{text-align:center}.hero-content>p{margin-left:auto;margin-right:auto}.hero-actions,.hero-note{justify-content:center}.hero-visual{min-height:450px;max-width:650px;width:100%;margin:auto}.services-grid{grid-template-columns:repeat(2,1fr)}.process-grid{grid-template-columns:repeat(2,1fr)}.process-item:nth-child(2):after{display:none}.cta-box{flex-direction:column;align-items:flex-start}}
@media(max-width:760px){.container{width:min(100% - 28px,var(--container))}.section{padding:85px 0}.nav-links,.nav-cta{display:none}.nav-links.mobile-open{display:flex;position:absolute;top:82px;left:14px;right:14px;padding:20px;flex-direction:column;background:#fff;border-radius:15px;box-shadow:0 20px 50px rgba(0,0,0,.12)}.mobile-menu{display:block}.hero-content h1{font-size:3.3rem}.hero-visual{min-height:350px}.visual-main{width:94%}.floating-card{right:0;bottom:10px}.problem-list,.services-grid,.portfolio-grid,.process-grid,.tech-grid{grid-template-columns:1fr}.process-item:not(:last-child):after{display:none}.process-item{border-top:0;border-left:1px solid #dce3e7}.project-image{height:260px}.cta-box{padding:45px 30px;border-radius:25px}.contact-form{padding:25px 20px}.form-row{grid-template-columns:1fr;gap:0}.footer-top,.footer-bottom{flex-direction:column}}
