:root { --ink:#1d312e; --green:#285b50; --cream:#f4f1e9; --sand:#d9c8ad; --coral:#db755d; --line:rgba(29,49,46,.18); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:Manrope,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { height:84px; padding:0 clamp(24px,5vw,78px); display:flex; align-items:center; justify-content:space-between; position:fixed; top:0; left:0; z-index:10; width:100%; color:var(--cream); background:#163d36; }
.brand { display:flex; align-items:center; gap:7px; font-weight:800; font-size:20px; letter-spacing:-1.3px; }
.site-header > .brand { transform:translateX(-22px); }
.brand-logo { width:70px; height:70px; object-fit:contain; }
.brand em { color:var(--coral); font-style:normal; }
.desktop-nav { display:flex; gap:32px; font-size:14px; font-weight:600; }
.desktop-nav a { opacity:.92; transition:color .2s ease, opacity .2s ease; }.desktop-nav a:hover { color:var(--coral); opacity:1; }
.header-whatsapp { display:inline-flex; align-items:center; justify-content:center; width:43px; height:43px; border:1px solid rgba(244,241,233,.45); border-radius:50%; transition:background-color .2s ease,transform .2s ease; }.header-whatsapp:hover { background:rgba(244,241,233,.12); transform:scale(1.06); }.header-whatsapp img { width:33px; height:33px; object-fit:contain; }
.menu-toggle { display:none; background:none; border:0; color:inherit; padding:6px; }.menu-toggle span { display:block; height:1px; width:23px; background:currentColor; margin:5px; }
.hero { min-height:720px; padding:160px clamp(24px,8.5vw,132px) 80px; background:linear-gradient(90deg, rgba(20,57,49,.93) 0%, rgba(25,73,62,.84) 46%, rgba(20,57,49,.63) 100%), url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=2100&q=90') center/cover; color:var(--cream); position:relative; display:grid; grid-template-columns:minmax(390px, .98fr) minmax(400px, .72fr); gap:7vw; overflow:hidden; }
.hero:after { content:""; position:absolute; width:650px; height:650px; border:1px solid rgba(244,241,233,.09); border-radius:50%; left:-345px; bottom:-350px; }
.hero-copy { position:relative; z-index:1; }.eyebrow,.section-label { margin:0; font:500 10px/1.2 "DM Mono",monospace; letter-spacing:.11em; }.eyebrow { color:#d8e1d7; display:flex; align-items:center; gap:8px; }.eyebrow span { width:24px; height:1px; background:var(--coral); }
h1,h2,h3,p { margin-top:0; } h1,h2,h3,blockquote { letter-spacing:-.055em; } h1 { font-size:clamp(58px,6.5vw,102px); line-height:.99; margin:24px 0 23px; font-weight:600; } h1 i,h2 i,blockquote i { font-family:"Playfair Display",serif; font-weight:600; letter-spacing:-.06em; }
.hero-text { max-width:405px; font-size:15px; line-height:1.8; color:#e2e7df; }.hero-actions { margin-top:34px; display:flex; align-items:center; gap:27px; }.button { display:inline-flex; gap:23px; align-items:center; padding:15px 18px 15px 20px; font-size:11px; font-weight:800; }.button span { font-size:17px; }.button-dark { background:var(--coral); color:white; }.text-link { font-size:11px; font-weight:700; border-bottom:1px solid rgba(244,241,233,.5); padding-bottom:5px; }.text-link span { margin-left:8px; color:var(--coral); }
.hero-visual { min-height:470px; max-height:575px; position:relative; align-self:end; }.hero-photo { background:linear-gradient(0deg,rgba(18,51,44,.16),rgba(18,51,44,.16)),url('assets/Fondo.jpeg') center/cover; height:100%; min-height:470px; width:100%; }.circle-stamp { position:absolute; width:126px; height:126px; right:-60px; top:-56px; color:var(--cream); background:var(--coral); border-radius:50%; padding:6px; }.circle-stamp text { fill:white; font:8.6px Manrope,sans-serif; letter-spacing:1.1px; }.circle-stamp path:not(#circlePath) { fill:none; stroke:white; stroke-width:2; stroke-linejoin:round; }.hero-tag { position:absolute; right:-13px; bottom:0; writing-mode:vertical-rl; transform:rotate(180deg); font:10px "DM Mono",monospace; letter-spacing:.1em; }.hero-number { position:absolute; left:clamp(24px,5vw,78px); bottom:32px; font:500 11px "DM Mono",monospace; color:#c6d5ca; }.hero-number span { color:#829e94; }
.intro { padding:118px clamp(24px,8.5vw,132px) 105px; }.section-label { color:#71807a; }.intro-main { display:grid; grid-template-columns:1.3fr .65fr; gap:10vw; align-items:end; margin-top:42px; }.intro h2,.services h2,.method h2,.contact h2 { font-size:clamp(42px,4.5vw,70px); font-weight:600; line-height:1.05; margin-bottom:0; }.intro-right p { font-size:14px; line-height:1.85; margin-bottom:22px; }.arrow-link { border-bottom:1px solid var(--ink); padding-bottom:5px; font-size:11px; font-weight:800; }.arrow-link span { color:var(--coral); font-size:15px; margin-left:8px; }.metrics { margin-top:92px; padding-top:25px; border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(3,1fr); gap:25px; }.metrics div { display:flex; gap:16px; align-items:center; }.metrics strong { font-size:39px; letter-spacing:-.08em; }.metrics small { font-size:18px; }.metrics span { font-size:10px; line-height:1.5; color:#61706a; }
.services { padding:102px clamp(24px,8.5vw,132px) 118px; background:#e9e5da; }.services-head { display:grid; grid-template-columns:1fr 1.45fr .75fr; gap:30px; align-items:end; margin-bottom:47px; }.services-head p:last-child { font-size:13px; line-height:1.7; margin-bottom:3px; color:#58655f; }.service-grid { display:grid; grid-template-columns:1.18fr .82fr; grid-template-rows:310px 310px; gap:16px; }.service-card { position:relative; overflow:hidden; }.card-image { position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .4s ease; }.service-card:hover .card-image { transform:scale(1.04); }.image-admin { background-image:linear-gradient(0deg,rgba(17,43,38,.52),rgba(17,43,38,.02) 70%),url('https://images.unsplash.com/photo-1503387762-592deb58ef4e?auto=format&fit=crop&w=1000&q=80'); }.image-community { background-image:linear-gradient(0deg,rgba(17,43,38,.6),rgba(17,43,38,.03) 70%),url('https://images.unsplash.com/photo-1524758631624-e2822e304c36?auto=format&fit=crop&w=1000&q=80'); }.card-content { position:absolute; inset:0; padding:27px 30px; display:flex; flex-direction:column; color:white; }.card-index { font:10px "DM Mono",monospace; }.service-card h3 { font-size:32px; line-height:1.02; margin:auto 0 10px; font-weight:600; }.service-card p { font-size:11px; line-height:1.65; max-width:260px; margin:0; }.service-card .card-content > a { position:absolute; right:28px; top:24px; height:31px; width:31px; border:1px solid currentColor; display:grid; place-content:center; font-size:16px; }.dark-card { background:var(--green); }.sand-card { background:var(--sand); }.sand-card .card-content { color:var(--ink); }
.method { display:grid; grid-template-columns:1fr 1fr; background:var(--ink); color:var(--cream); }.method-image { min-height:715px; background:url('https://images.unsplash.com/photo-1564013799919-ab600027ffc6?auto=format&fit=crop&w=1200&q=85') center/cover; }.method-copy { padding:100px clamp(34px,7vw,108px); }.method .section-label { color:#a9b9af; }.method h2 { margin:38px 0 28px; }.method-copy > p:not(.section-label) { color:#c9d4cd; font-size:13px; line-height:1.8; max-width:385px; }.method ol { padding:0; list-style:none; margin:48px 0 0; border-top:1px solid rgba(244,241,233,.22); }.method li { padding:18px 0; border-bottom:1px solid rgba(244,241,233,.22); display:grid; grid-template-columns:48px 1fr; }.method li>span { color:var(--coral); font:10px "DM Mono",monospace; padding-top:4px; }.method li h3 { font-size:16px; margin:0 0 5px; font-weight:700; }.method li p { margin:0; font-size:11px; color:#bac7bf; }
.testimonial { text-align:center; padding:110px 24px 117px; max-width:930px; margin:auto; }.quote-mark { color:var(--coral); font:70px/1 "Playfair Display",serif; height:51px; margin:0; }.testimonial blockquote { margin:12px auto 33px; max-width:790px; font-size:clamp(30px,3.6vw,51px); line-height:1.18; font-weight:600; }.testimonial-person { display:flex; align-items:center; justify-content:center; gap:10px; text-align:left; }.avatar { border-radius:50%; display:grid; place-content:center; width:34px; height:34px; color:white; background:var(--green); font:10px "DM Mono",monospace; }.testimonial-person b,.testimonial-person small { display:block; font-size:10px; line-height:1.55; }.testimonial-person small { color:#77837d; }
.contact { position:relative; padding:102px clamp(24px,8.5vw,132px) 68px; background:var(--coral); color:#fffaf2; overflow:hidden; }.contact:after { content:"360"; font:600 clamp(190px,27vw,410px)/.7 "Playfair Display",serif; color:rgba(255,255,255,.1); position:absolute; right:-15px; bottom:13px; letter-spacing:-.16em; }.contact-layout { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,620px) minmax(290px,420px); justify-content:space-between; gap:clamp(36px,7vw,110px); }.contact .section-label { color:#ffe2d9; }.contact h2 { font-size:clamp(57px,6vw,90px); margin:38px 0 19px; }.contact-copy>p:not(.section-label) { font-size:14px; max-width:350px; line-height:1.7; }.contact-form { width:min(100%,620px); margin-top:31px; display:grid; gap:16px; }.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.contact-form label { display:grid; gap:7px; color:#fffaf2; font-size:11px; font-weight:700; }.contact-form .optional { font-weight:400; opacity:.75; }.contact-form input,.contact-form textarea { width:100%; border:0; border-bottom:1px solid rgba(255,250,242,.72); border-radius:0; padding:9px 0; background:transparent; color:#fffaf2; font:13px Manrope,Arial,sans-serif; outline:none; resize:vertical; }.contact-form input::placeholder,.contact-form textarea::placeholder { color:rgba(255,250,242,.64); }.contact-form input:focus,.contact-form textarea:focus { border-color:#fffaf2; }.contact-form .button { justify-self:start; border:0; cursor:pointer; margin-top:8px; }.button-light { margin-top:15px; background:#fffaf2; color:var(--ink); }.contact-details { margin-top:62px; padding-top:16px; border-top:1px solid rgba(255,255,255,.45); display:flex; gap:38px; font:10px "DM Mono",monospace; }.contact-gallery { align-self:center; display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }.contact-gallery img { width:100%; height:320px; object-fit:cover; box-shadow:0 18px 38px rgba(74,29,21,.18); }
footer { padding:33px clamp(24px,5vw,78px); display:grid; grid-template-columns:1.2fr 1fr 1.5fr; row-gap:20px; align-items:center; background:#163d36; color:#f4f1e9; }.footer-brand { font-size:18px; transform:translateX(-22px); }.footer-brand .brand-logo { width:70px; height:70px; } footer p { margin:0; color:#f4f1e9; font-size:16px; font-weight:700; letter-spacing:-.03em; text-align:center; } .social-list { justify-self:end; display:flex; gap:24px; margin:0; padding:0; list-style:none; font-size:14px; font-weight:600; }.social-list a { display:inline-flex; align-items:center; gap:8px; transition:color .2s ease; }.social-list a:hover { color:var(--coral); }.social-list svg { width:20px; height:20px; } footer small { grid-column:1/-1; padding-top:17px; border-top:1px solid rgba(244,241,233,.16); color:#91a79d; font:9px "DM Mono",monospace; }
@media (max-width:780px) { .site-header { height:68px; padding:0 22px; }.desktop-nav,.header-cta { display:none; }.desktop-nav.is-open { display:flex; position:absolute; top:68px; left:0; right:0; padding:23px; flex-direction:column; gap:18px; background:var(--green); border-top:1px solid rgba(244,241,233,.15); }.menu-toggle { display:block; }.hero { min-height:780px; display:block; padding:120px 24px 40px; }.hero h1 { font-size:61px; }.hero-text { font-size:13px; }.hero-actions { gap:16px; flex-wrap:wrap; }.hero-visual { margin:48px 25px 0 0; min-height:280px; height:280px; }.hero-photo { min-height:280px; }.circle-stamp { width:94px; height:94px; right:-42px; top:-38px; }.circle-stamp text { font-size:10px; }.hero-number { display:none; }.intro,.services { padding:76px 24px; }.intro-main,.services-head { display:block; }.intro h2 { margin:28px 0; }.intro-right { max-width:440px; }.metrics { margin-top:53px; gap:19px; }.metrics div { display:block; }.metrics strong { display:block; font-size:32px; }.metrics span { display:block; margin-top:5px; }.services-head h2 { margin:27px 0 20px; }.services-head p:last-child { max-width:330px; }.service-grid { grid-template-columns:1fr; grid-template-rows:280px 250px 250px 280px; }.service-card h3 { font-size:29px; }.method { grid-template-columns:1fr; }.method-image { min-height:355px; }.method-copy { padding:73px 24px; }.testimonial { padding:80px 24px; }.contact { padding:74px 24px 49px; }.form-row { grid-template-columns:1fr; }.contact-details { margin-top:62px; display:block; }.contact-details a { display:block; margin-bottom:12px; } footer { display:block; padding:30px 24px; } footer p { margin:18px 0; } .social-list { justify-content:flex-start; flex-wrap:wrap; } footer small { display:block; margin-top:25px; padding-top:17px; } }

.contact-details { align-items:center; justify-content:space-between; }
.contact-details > a,.contact-details > span { font-size:14px; }
.contact-form .button { border-radius:999px; transition:background-color .2s ease, color .2s ease; }
.contact-form .button:hover { background:var(--green); color:#e43b2c; }
.hero-cta { border-radius:999px; transition:background-color .2s ease, color .2s ease; }
.hero-cta:hover { background:var(--green); color:#e43b2c; }
.whatsapp-link { display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:500; transition:opacity .2s ease; }
.whatsapp-link:hover { opacity:.72; }
.whatsapp-link img { width:24px; height:24px; object-fit:contain; }
.clients { padding:108px clamp(24px,8.5vw,132px) 116px; background:#e9e5da; }
.clients-heading { display:grid; grid-template-columns:1.15fr .85fr; gap:8vw; align-items:end; margin-bottom:47px; }
.clients h2 { margin:25px 0 0; font-size:clamp(42px,4.5vw,70px); line-height:1.05; font-weight:600; }
.clients-heading > p { margin:0 0 4px; max-width:345px; font-size:13px; line-height:1.75; color:#58655f; }
.clients-carousel { position:relative; }
.client-slide { height:470px; min-height:0; display:grid; grid-template-columns:1.13fr .87fr; background:var(--green); color:var(--cream); overflow:hidden; }
.client-slide[hidden] { display:none; }
.client-slide img { width:100%; height:470px; min-height:0; object-fit:cover; }
.client-copy { padding:clamp(36px,5vw,76px); display:flex; flex-direction:column; align-items:flex-start; }
.client-copy > span { color:var(--sand); font:10px "DM Mono",monospace; letter-spacing:.09em; }
.client-copy h3 { margin:auto 0 15px; font-size:clamp(30px,3.2vw,49px); line-height:1.02; font-weight:600; }
.client-copy p { max-width:300px; margin:0; color:#d5dfd8; font-size:13px; line-height:1.8; }
.clients-controls { position:absolute; z-index:1; right:clamp(18px,3vw,38px); bottom:clamp(18px,3vw,38px); display:flex; align-items:center; gap:16px; }
.client-control { width:38px; height:38px; border:1px solid rgba(244,241,233,.65); border-radius:50%; background:transparent; color:var(--cream); cursor:pointer; font-size:17px; transition:background-color .2s ease,color .2s ease; }
.client-control:hover,.client-control:focus-visible { background:var(--cream); color:var(--ink); outline:none; }
.client-dots { display:flex; gap:7px; }
.client-dots button { width:7px; height:7px; padding:0; border:0; border-radius:50%; background:rgba(244,241,233,.45); cursor:pointer; }
.client-dots button[aria-current="true"] { width:22px; border-radius:10px; background:var(--cream); }
.testimonial-carousel { position:relative; }
.testimonial-slide[hidden] { display:none; }
.testimonial-controls { display:flex; align-items:center; justify-content:center; gap:16px; margin-top:36px; }
.testimonial-control { width:38px; height:38px; border:1px solid var(--line); border-radius:50%; background:transparent; color:var(--ink); cursor:pointer; font-size:17px; transition:background-color .2s ease,color .2s ease; }
.testimonial-control:hover,.testimonial-control:focus-visible { background:var(--green); color:var(--cream); outline:none; }
.testimonial-dots { display:flex; gap:7px; }
.testimonial-dots button { width:7px; height:7px; padding:0; border:0; border-radius:50%; background:#b5b7ae; cursor:pointer; }
.testimonial-dots button[aria-current="true"] { width:22px; border-radius:10px; background:var(--coral); }
@media (max-width:780px) { .contact-details { display:flex; align-items:flex-start; flex-direction:column; }.contact-details .whatsapp-link { align-self:flex-end; } }
@media (max-width:780px) { .contact-layout { display:block; }.contact-gallery { margin-top:58px; grid-template-columns:repeat(2,1fr); }.contact-gallery img { height:235px; } }
@media (max-width:780px) { .clients { padding:76px 24px 82px; }.clients-heading { display:block; margin-bottom:31px; }.clients h2 { margin-top:24px; }.clients-heading > p { margin-top:23px; }.client-slide { height:auto; min-height:585px; grid-template-columns:1fr; grid-template-rows:260px 1fr; }.client-slide img { height:260px; min-height:0; }.client-copy { padding:30px 27px 74px; }.client-copy h3 { margin:32px 0 14px; }.clients-controls { right:20px; bottom:20px; gap:13px; } }
@media (max-width:780px) { .site-header > .brand { transform:translateX(-8px); } }
@media (max-width:780px) { .footer-brand { transform:translateX(-8px); } }
@media (max-width:780px) { .header-whatsapp { width:39px; height:39px; margin-left:auto; margin-right:10px; }.header-whatsapp img { width:30px; height:30px; } }

/* Carrusel de imágenes de contacto */
.contact-carousel { position:relative; display:block; width:100%; }
.contact-carousel .contact-gallery-slide { width:100%; height:320px; object-fit:cover; box-shadow:0 18px 38px rgba(74,29,21,.18); }
.contact-carousel .contact-gallery-slide[hidden] { display:none; }
.contact-gallery-controls { position:absolute; right:18px; bottom:18px; display:flex; align-items:center; gap:12px; }
.contact-gallery-control { width:36px; height:36px; border:1px solid rgba(255,250,242,.8); border-radius:50%; background:rgba(22,61,54,.45); color:#fffaf2; cursor:pointer; font-size:16px; transition:background-color .2s ease,color .2s ease; }
.contact-gallery-control:hover,.contact-gallery-control:focus-visible { background:#fffaf2; color:var(--ink); outline:none; }
.contact-gallery-dots { display:flex; gap:7px; }
.contact-gallery-dots button { width:7px; height:7px; padding:0; border:0; border-radius:50%; background:rgba(255,250,242,.5); cursor:pointer; }
.contact-gallery-dots button[aria-current="true"] { width:21px; border-radius:10px; background:#fffaf2; }
@media (max-width:780px) { .contact-carousel { margin-top:58px; }.contact-carousel .contact-gallery-slide { height:235px; } }
.form-status { margin:0; font-size:13px; line-height:1.5; }.form-status.is-success { color:#fffaf2; }.form-status.is-error { color:#5d1b14; }.contact-form .button:disabled { cursor:wait; opacity:.72; }