desafios en curso
This commit is contained in:
Vendored
+3
@@ -0,0 +1,3 @@
|
|||||||
|
{
|
||||||
|
"liveServer.settings.port": 5501
|
||||||
|
}
|
||||||
@@ -0,0 +1,17 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<!-- Creator: CorelDRAW -->
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
||||||
|
viewBox="0 0 6.72 6.73"
|
||||||
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
||||||
|
<g id="Capa_x0020_1">
|
||||||
|
<metadata id="CorelCorpID_0Corel-Layer"/>
|
||||||
|
<g id="_1510591201856">
|
||||||
|
<path fill="#221728" fill-opacity="0.501961" d="M5.06 3.49c-0.04,0.5 -0.23,0.83 -0.56,1.15 -0.27,0.25 -0.76,0.47 -1.27,0.43 -0.9,-0.08 -1.64,-0.85 -1.57,-1.84 0.02,-0.24 0.09,-0.47 0.19,-0.65 0.31,-0.58 0.93,-0.98 1.65,-0.92 0.47,0.04 0.83,0.25 1.13,0.57 0.25,0.26 0.48,0.75 0.43,1.26zm-0.28 -1.88c-0.03,-0.22 0.14,-0.41 0.32,-0.43 0.53,-0.07 0.6,0.69 0.13,0.76 -0.24,0.03 -0.42,-0.13 -0.45,-0.33zm-3.08 -0.99c-0.43,0.05 -0.68,0.24 -0.87,0.5 -0.25,0.34 -0.22,0.68 -0.22,1.16 0,0.23 -0.01,2.6 0.01,2.76 0.04,0.41 0.27,0.69 0.51,0.86 0.35,0.25 0.66,0.22 1.15,0.22 0.25,0 2.57,0.01 2.75,-0.01 0.42,-0.04 0.69,-0.26 0.86,-0.5 0.25,-0.34 0.22,-0.67 0.22,-1.16 0,-0.26 0.01,-2.57 0,-2.76 -0.04,-0.4 -0.28,-0.7 -0.51,-0.86 -0.37,-0.26 -0.65,-0.22 -1.15,-0.22 -0.23,0 -2.58,-0.01 -2.75,0.01z"/>
|
||||||
|
<path fill="#221728" d="M1.7 0.62c0.17,-0.02 2.52,-0.01 2.75,-0.01 0.5,0 0.78,-0.04 1.15,0.22 0.23,0.16 0.47,0.46 0.51,0.86 0.01,0.19 0,2.5 0,2.76 0,0.49 0.03,0.82 -0.22,1.16 -0.17,0.24 -0.44,0.46 -0.86,0.5 -0.18,0.02 -2.5,0.01 -2.75,0.01 -0.49,0 -0.8,0.03 -1.15,-0.22 -0.24,-0.17 -0.47,-0.45 -0.51,-0.86 -0.02,-0.16 -0.01,-2.53 -0.01,-2.76 0,-0.48 -0.03,-0.82 0.22,-1.16 0.19,-0.26 0.44,-0.45 0.87,-0.5zm-0.11 -0.6c-0.55,0.09 -0.83,0.28 -1.11,0.57 -0.26,0.26 -0.47,0.7 -0.47,1.21 -0.02,0.82 0,1.69 0,2.51 0,0.26 -0.02,0.59 0.01,0.84 0.11,0.85 0.83,1.57 1.78,1.57l2.51 0c0.26,0 0.58,0.02 0.84,-0.01 0.86,-0.1 1.56,-0.85 1.57,-1.78 0.01,-0.83 0,-1.68 0,-2.51 0,-0.26 0.01,-0.59 -0.02,-0.83 -0.11,-0.88 -0.84,-1.58 -1.78,-1.58l-2.51 0c-0.23,0 -0.61,-0.02 -0.82,0.01z"/>
|
||||||
|
<path fill="#221728" d="M2.27 3.49c-0.08,-0.65 0.41,-1.15 0.97,-1.22 0.63,-0.08 1.15,0.41 1.21,0.96 0.08,0.64 -0.39,1.16 -0.95,1.23 -0.67,0.07 -1.16,-0.42 -1.23,-0.97zm2.79 0c0.05,-0.51 -0.18,-1 -0.43,-1.26 -0.3,-0.32 -0.66,-0.53 -1.13,-0.57 -0.72,-0.06 -1.34,0.34 -1.65,0.92 -0.1,0.18 -0.17,0.41 -0.19,0.65 -0.07,0.99 0.67,1.76 1.57,1.84 0.51,0.04 1,-0.18 1.27,-0.43 0.33,-0.32 0.52,-0.65 0.56,-1.15z"/>
|
||||||
|
<path fill="#221728" d="M4.78 1.61c0.03,0.2 0.21,0.36 0.45,0.33 0.47,-0.07 0.4,-0.83 -0.13,-0.76 -0.18,0.02 -0.35,0.21 -0.32,0.43z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.7 KiB |
@@ -0,0 +1,12 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<!-- Creator: CorelDRAW -->
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="8px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
||||||
|
viewBox="0 0 5703.06 1832.48"
|
||||||
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
||||||
|
<g id="Capa_x0020_1">
|
||||||
|
<metadata id="CorelCorpID_0Corel-Layer"/>
|
||||||
|
<path fill="#221728" d="M1866.25 787.21c147.45,194.17 -51.65,790.19 -235.29,724.78 -129.88,-46.26 -69.82,-322.41 -30.41,-438.05 50.8,-149.07 104.32,-274.92 265.7,-286.73zm3278.48 -0.48c149.12,207.46 -56.06,789.51 -236.64,725.73 -160.15,-56.57 -61.47,-697.72 236.64,-725.73zm-822.77 102.35c-36.59,-57.78 -56.68,-97.04 -55.97,-172.16 0.97,-99.61 20.13,-114.28 84.73,-144.04 59.65,101 27.32,241.46 -28.76,316.2zm-4287.04 -133.89c-53.6,210.88 -32.16,348.09 -22.07,573.09 106.1,180.76 57.52,219.43 224.88,367.87 124.15,110.12 273.5,141.87 463.73,135.56 300.48,-89.36 438.01,-217.9 579.62,-446.27 60.37,139.1 55.77,265.48 225.13,289.52 178.68,25.38 248.29,-96.99 342.77,-175.35 187.89,228.65 232.42,280.5 536.27,-24.41l50.48 194.86 170.92 -0.43 62.09 -203.21c73.44,-205.56 229.49,-589.33 405.05,-593.68 21.18,218 -90.92,370.82 -66.38,628.76 68.47,175.06 190.8,252.3 366.39,107.77 39.87,-32.82 94.47,-93.03 134.1,-153.64 49.03,-74.97 60.83,-131 135.03,-201.22 173.59,889.03 537.87,120.69 710.41,-103.45 79.46,-103.22 108.76,-55.8 255.01,-113.27 -53.3,328.58 -95.41,441.24 116.33,634.75 282.63,24.39 253.26,-55.72 402.43,-172.78 90.47,112.38 12.39,109 169.65,173.19 265.53,14.75 413.89,-154.29 406,-411.92 -72.26,23.5 -57.24,21.91 -116.57,144.02 -46.2,95.08 -50.65,111.49 -181.29,126.86 -55.4,-335.38 153.92,-635.99 135.8,-863.07 -155.62,-58 -220.62,36.26 -298.17,106.98 -89.77,-192.8 -268.81,-177.38 -417.03,-44.16 -107.55,96.68 -166.56,249.33 -383.87,245.56 51.77,-206.25 141.01,-312.76 11.34,-517.94 -200.98,-52.59 -294.23,13.29 -334.48,197.82 -35.8,264.81 70.17,281.29 153.02,405.03 -72.17,157.11 -163.26,375.88 -324.71,407.91 -77.43,-299.46 -40.24,-503.1 -54.28,-821.61 -142.89,-39.83 -193.81,16.73 -253.81,122.74 -29.89,150.23 -40.32,309.4 -93.2,433.82 -55.88,131.48 -117.29,284.61 -278.74,253.54 -23.16,-238.01 78.43,-417.49 75.97,-695.61 -116.45,-277.97 -365.05,-48.67 -491,124.16l-97.82 117.54c31.12,-109.27 22.93,-250.19 -15.54,-351.15l-178.37 9.62c-53.12,123.54 -38.3,335.55 -127.6,508.48 -46.03,181.2 -124.62,333.21 -301.08,354.47 -27.26,-147.58 1.78,-334.05 54.14,-471.25l76.48 -369.7c-49.92,-38.92 59.36,-13.49 -71.7,-36.39 -121.6,-21.24 -166.82,66.34 -193.73,136.56l-59.33 -69.56c-330.82,-351.59 -633.95,422.33 -676.34,506.25 -234.51,464.21 -678.24,549.85 -863.8,286.01 -353.05,-501.97 154.37,-1479.28 614.2,-1368.59 270.36,65.06 42.69,397.8 67.78,539.68 195.61,-21.47 173.14,-117.91 294.03,-211.69 -36.25,-283.37 -2.96,-352.37 -246.17,-437.03 -174.58,-60.77 -372.06,-21.99 -522.36,46.24 -271.66,123.32 -468.46,370.44 -569.61,678.72z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.1 KiB |
@@ -0,0 +1,13 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<!-- Creator: CorelDRAW -->
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="23px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
||||||
|
viewBox="0 0 3.27 3.34"
|
||||||
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
||||||
|
<g id="Capa_x0020_1">
|
||||||
|
<metadata id="CorelCorpID_0Corel-Layer"/>
|
||||||
|
<path fill="#221728" d="M0.17 2.42c0.04,0.05 0.06,0.11 0.09,0.15 0.24,0.36 0.57,0.6 1,0.72 0.27,0.07 0.62,0.07 0.88,-0.01 0.24,-0.07 0.5,-0.2 0.63,-0.34 -0.04,-0.05 -0.2,-0.16 -0.26,-0.21 -0.05,-0.04 -0.09,-0.07 -0.14,-0.1 -0.04,-0.04 -0.08,-0.07 -0.13,-0.1 -0.04,0.01 -0.06,0.03 -0.1,0.05 -0.47,0.23 -1.06,0.06 -1.32,-0.39 -0.01,-0.02 -0.08,-0.18 -0.09,-0.19 -0.09,0.05 -0.2,0.15 -0.28,0.21 -0.05,0.04 -0.09,0.07 -0.13,0.11 -0.05,0.03 -0.09,0.07 -0.15,0.1zm0.01 -1.5l0.01 0.01c0.01,0.01 0,0.01 0.02,0.02l0.37 0.29c0.05,0.03 0.11,0.09 0.15,0.1 0.07,-0.12 0.07,-0.21 0.24,-0.38 0.1,-0.1 0.22,-0.18 0.38,-0.24 0.25,-0.09 0.54,-0.07 0.77,0.06 0.08,0.04 0.13,0.09 0.19,0.13 0.02,-0.02 0.45,-0.43 0.47,-0.49 -0.07,-0.04 -0.14,-0.11 -0.29,-0.2 -0.67,-0.41 -1.6,-0.23 -2.12,0.4 -0.05,0.06 -0.15,0.2 -0.19,0.3z"/>
|
||||||
|
<path fill="#221728" fill-opacity="0.501961" d="M0.17 2.42c0.06,-0.03 0.1,-0.07 0.15,-0.1 0.04,-0.04 0.08,-0.07 0.13,-0.11 0.08,-0.06 0.19,-0.16 0.28,-0.21 -0.01,-0.05 -0.03,-0.1 -0.04,-0.15 -0.01,-0.06 -0.01,-0.12 -0.01,-0.18 0,-0.14 0.03,-0.21 0.05,-0.33 -0.04,-0.01 -0.1,-0.07 -0.15,-0.1l-0.37 -0.29c-0.02,-0.01 -0.01,-0.01 -0.02,-0.02l-0.01 -0.01c-0.1,0.16 -0.18,0.5 -0.18,0.74 0,0.31 0.07,0.52 0.17,0.76zm2.07 0.11c0.05,0.03 0.09,0.06 0.13,0.1 0.05,0.03 0.09,0.06 0.14,0.1 0.06,0.05 0.22,0.16 0.26,0.21 0.14,-0.07 0.34,-0.44 0.41,-0.63 0.11,-0.33 0.11,-0.58 0.06,-0.94l-1.57 0 0 0.65 0.9 0c-0.01,0.15 -0.12,0.31 -0.22,0.4l-0.11 0.11z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.0 KiB |
@@ -0,0 +1,12 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<!-- Creator: CorelDRAW -->
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="23px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
||||||
|
viewBox="0 0 48.8 51.3"
|
||||||
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
||||||
|
<g id="Capa_x0020_1">
|
||||||
|
<metadata id="CorelCorpID_0Corel-Layer"/>
|
||||||
|
<path fill="#221728" d="M40.63 34.14c0.01,0.4 -0.27,0.59 -0.55,0.85 -0.43,0.39 -0.59,0.55 -1.12,0.65 -0.56,1.16 -6.12,2.52 -9.13,-1.64 -2.13,-2.96 -1.56,-6.95 1.08,-9.28 4.02,-3.55 10.69,-1.06 11.33,4.41 0.12,1 0.02,1.94 -0.24,2.81 -0.15,0.49 -0.25,0.72 -0.48,1.17l-0.89 1.03zm-22.52 8.14c0.43,0 0.85,0.06 1.25,0.18 0.4,-0.04 0.46,-0.21 1.22,-0.97 5.44,-5.42 3.59,-2.78 2.15,-7.22 -0.82,-2.52 -0.89,-5.86 -0.04,-8.33l1.38 -3.29c-0.56,-0.86 -6.73,-5.42 -8.2,-6.58 -1.55,-1.21 -2.73,-2.16 -4.14,-3.23 -0.86,-0.64 -1.32,-1.03 -2.09,-1.6 -0.62,-0.47 -1.22,-1.34 -2.19,-1.16 -3.19,0.54 -4.69,0.55 -6.49,-1.76 -1.44,-1.85 -1.18,-4.81 0.25,-6.48 1.32,-1.55 3.85,-2.5 6.42,-1.29 2.67,1.27 2.87,3.68 2.77,6.09 0.52,0.32 0.76,0.64 1.4,0.9 0.25,0.47 1.15,1.01 1.63,1.39 0.58,0.46 1.17,0.91 1.76,1.38 0.55,0.42 2.9,2.45 3.43,2.5 0.43,0.79 1.29,1.21 2.04,1.8 8.12,6.38 5.3,5.07 9.27,3.24 2.09,-0.97 2.67,-0.67 3.47,-1.02l-0.04 -6.1c-1.06,-0.84 -1.76,-1.16 -2.35,-2.58 -0.71,-1.76 -0.18,-2.55 0.16,-4.12 0.81,-1.06 1.66,-2.12 3.4,-2.35 3.84,-0.52 6.25,2.67 5.43,5.95 -0.49,1.93 -1.54,2.17 -2.53,3.22l0.03 5.92c8.01,1.34 13.89,9.77 10.15,18.61 -1.36,3.22 -4.38,6.27 -8.19,7.33 -2.38,0.66 -4.22,0.88 -6.92,0.35 -2.41,-0.46 -3.4,-1.51 -5.18,-2.33 -0.35,0.21 -4.72,4.17 -4.82,5.14 0,0.02 0,0.05 0,0.07 0.05,0.28 0.08,0.56 0.08,0.85 0,0.23 -0.02,0.46 -0.06,0.69 -0.01,0.23 -0.05,0.44 -0.12,0.57 -0.55,1.88 -2.28,3.25 -4.33,3.25 -2.5,0 -4.52,-2.02 -4.52,-4.51 0,-2.49 2.02,-4.51 4.52,-4.51z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.0 KiB |
@@ -0,0 +1,13 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<!-- Creator: CorelDRAW -->
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
||||||
|
viewBox="0 0 1.4 1.4"
|
||||||
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
||||||
|
<g id="Capa_x0020_1">
|
||||||
|
<metadata id="CorelCorpID_0Corel-Layer"/>
|
||||||
|
<path fill="#221728" d="M0.47 0.04l-0.08 0.03 -0.02 0.01c-0.01,0 0,0 -0.01,0.01l-0.05 0.03c-0.01,0.01 -0.04,0.03 -0.05,0.04 -0.03,0.01 -0.04,0.03 -0.06,0.05 -0.01,0.01 -0.03,0.03 -0.04,0.05 -0.01,0.01 -0.03,0.04 -0.04,0.05 -0.01,0.01 -0.01,0.01 -0.02,0.03 0,0 -0.01,0.01 -0.01,0.01l-0.01 0.02 -0.01 0.02 -0.03 0.08c-0.02,0.06 -0.04,0.1 -0.04,0.17 0,0.13 0.01,0.19 0.04,0.3 0.01,0.02 0.02,0.04 0.02,0.06 0.01,0.01 0.02,0.03 0.02,0.04 0.01,0.01 0.01,0.02 0.02,0.02 0,0.01 0,0.01 0.01,0.01 0,0.01 0,0.01 0,0.02 0.01,0.01 0.02,0.02 0.03,0.04 0.01,0.01 0.03,0.02 0.03,0.04 0.02,0.01 0.05,0.04 0.07,0.06 0.01,0.01 0.02,0.02 0.04,0.03 0.01,0.01 0.02,0.02 0.04,0.03 0.01,0.01 0,0 0.01,0.01 0.01,0 0.01,0 0.01,0.01 0.01,0 0.02,0 0.02,0.01 0.02,0 0.03,0.01 0.04,0.02 0.01,0 0.04,0.01 0.05,0.02 0,-0.03 -0.01,-0.08 -0.01,-0.12 0,-0.09 0.06,-0.3 0.09,-0.4 0.01,-0.06 0,-0.04 -0.01,-0.09 -0.04,-0.22 0.16,-0.28 0.2,-0.16 0.02,0.05 -0.01,0.14 -0.03,0.2 -0.02,0.06 -0.04,0.13 0.02,0.17 0.06,0.05 0.13,0.02 0.18,-0.02 0.07,-0.06 0.13,-0.22 0.09,-0.36 -0.03,-0.12 -0.14,-0.2 -0.28,-0.2 -0.15,0 -0.25,0.09 -0.29,0.19 -0.07,0.16 0.03,0.27 0.03,0.29 0,0.02 -0.01,0.08 -0.02,0.1 -0.08,-0.01 -0.15,-0.15 -0.16,-0.24 -0.04,-0.37 0.38,-0.57 0.68,-0.41 0.17,0.1 0.27,0.31 0.17,0.55 -0.06,0.15 -0.21,0.26 -0.36,0.23 -0.07,-0.01 -0.09,-0.03 -0.12,-0.07 -0.01,0.06 -0.03,0.14 -0.05,0.19 -0.02,0.04 -0.06,0.14 -0.08,0.16 0,0 -0.01,0.01 0.03,0.01l0.12 0.02 0.11 0c0.07,0 0.11,-0.02 0.18,-0.04l0.08 -0.03 0.01 0 0.07 -0.04c0,-0.01 0.03,-0.03 0.05,-0.04l0.1 -0.1c0.01,-0.02 0.03,-0.05 0.04,-0.05 0,-0.02 0.02,-0.05 0.04,-0.07l0 -0.01c0.01,-0.02 0.02,-0.04 0.02,-0.05 0.01,-0.01 0.01,-0.02 0.01,-0.03 0.01,-0.01 0,0 0.01,-0.01 0,-0.03 0.01,-0.06 0.02,-0.08 0.01,-0.03 0.01,-0.06 0.01,-0.09l0 -0.11 0 -0.08 -0.03 -0.11c-0.02,-0.01 -0.03,-0.05 -0.03,-0.06 -0.01,-0.01 -0.01,-0.02 -0.02,-0.03 -0.01,-0.01 -0.03,-0.04 -0.03,-0.05 -0.01,-0.01 -0.02,-0.03 -0.03,-0.04 -0.01,-0.02 -0.02,-0.03 -0.03,-0.04 -0.02,-0.03 -0.05,-0.04 -0.06,-0.07 -0.02,0 -0.08,-0.05 -0.08,-0.06 -0.01,0 0,0 -0.02,-0.01 0,0 0,0 -0.01,0 -0.01,-0.01 -0.01,-0.01 -0.02,-0.02 -0.01,0 -0.03,0 -0.04,-0.02 -0.01,0 -0.05,-0.01 -0.06,-0.02l-0.08 -0.02 -0.12 -0.02 -0.1 0c-0.07,0 -0.12,0.02 -0.17,0.04z"/>
|
||||||
|
<path fill="#221728" fill-opacity="0.501961" d="M0.46 1.37c0.02,0 0.02,0 0.04,0 0.02,-0.02 0.06,-0.12 0.08,-0.16 0.02,-0.05 0.04,-0.13 0.05,-0.19 0.03,0.04 0.05,0.06 0.12,0.07 0.15,0.03 0.3,-0.08 0.36,-0.23 0.1,-0.24 0,-0.45 -0.17,-0.55 -0.3,-0.16 -0.72,0.04 -0.68,0.41 0.01,0.09 0.08,0.23 0.16,0.24 0.01,-0.02 0.02,-0.08 0.02,-0.1 0,-0.02 -0.1,-0.13 -0.03,-0.29 0.04,-0.1 0.14,-0.19 0.29,-0.19 0.14,0 0.25,0.08 0.28,0.2 0.04,0.14 -0.02,0.3 -0.09,0.36 -0.05,0.04 -0.12,0.07 -0.18,0.02 -0.06,-0.04 -0.04,-0.11 -0.02,-0.17 0.02,-0.06 0.05,-0.15 0.03,-0.2 -0.04,-0.12 -0.24,-0.06 -0.2,0.16 0.01,0.05 0.02,0.03 0.01,0.09 -0.03,0.1 -0.09,0.31 -0.09,0.4 0,0.04 0.01,0.09 0.01,0.12 -0.02,-0.01 0.01,0.02 0.01,0.01z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.5 KiB |
@@ -0,0 +1,12 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<!-- Creator: CorelDRAW -->
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="16px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
||||||
|
viewBox="0 0 10.04 6.68"
|
||||||
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
||||||
|
<g id="Capa_x0020_1">
|
||||||
|
<metadata id="CorelCorpID_0Corel-Layer"/>
|
||||||
|
<path fill="#221728" d="M0.08 5.11c0.04,-0.11 0.14,-0.16 0.23,-0.24l0.5 -0.5c0.09,-0.07 0.19,-0.19 0.26,-0.23 -0.01,0.11 -0.05,0.32 0.02,0.42 0,-1.24 0.35,-2.46 1,-3.09 0.69,-0.67 1.45,-0.34 1.98,0.32 0.07,0.09 0.4,0.49 0.43,0.59 0.06,0.03 0.1,0.12 0.14,0.18 0.07,0.1 0.36,0.53 0.37,0.6 0.08,0.06 0.51,0.81 0.6,0.96 0.19,0.34 0.38,0.64 0.58,0.96 0.33,0.53 0.93,1.39 1.57,1.52l0.01 -1.26c-0.04,-0.07 -0.06,-0.06 -0.15,-0.18 -0.24,-0.32 -0.48,-0.66 -0.69,-1.01l-1.17 -1.87c-0.05,-0.07 -0.12,-0.13 -0.1,-0.22 -0.06,0.04 -0.02,0.04 -0.08,-0.04l-0.3 -0.44c-0.04,-0.06 -0.1,-0.11 -0.1,-0.19 -0.07,-0.02 -0.02,0.01 -0.07,-0.04 -0.03,-0.02 -0.03,-0.03 -0.05,-0.06 -0.18,-0.23 -0.4,-0.45 -0.62,-0.65 -0.95,-0.9 -2.18,-0.82 -3.08,0.04 -0.77,0.74 -1.2,1.95 -1.33,3.09 -0.03,0.22 -0.07,1.22 0.05,1.34zm5.1 -3.72c0,0.08 0.06,0.13 0.1,0.19l0.3 0.44c0.06,0.08 0.02,0.08 0.08,0.04 0.03,-0.02 0.24,-0.34 0.29,-0.4l0.4 -0.45c0.84,-0.8 1.82,-0.11 2.28,0.92 0.3,0.66 0.47,1.48 0.45,2.29 0,0.42 -0.09,0.84 -0.33,1.03 -0.22,0.17 -0.55,0.18 -0.79,0.04 -0.08,-0.05 -0.13,-0.12 -0.19,-0.15l-0.01 1.26c0.19,0.09 0.6,0.09 0.84,0.06 1.93,-0.28 1.57,-3.45 0.94,-4.77 -0.25,-0.5 -0.45,-0.83 -0.77,-1.16 -0.88,-0.92 -2.01,-0.98 -2.95,-0.1 -0.14,0.14 -0.62,0.68 -0.64,0.76zm-4.09 3.17c-0.07,-0.1 -0.03,-0.31 -0.02,-0.42 -0.07,0.04 -0.17,0.16 -0.26,0.23l-0.5 0.5c-0.09,0.08 -0.19,0.13 -0.23,0.24 -0.01,0.26 0.25,0.75 0.37,0.9 0.17,0.23 0.39,0.43 0.71,0.55 0.31,0.12 0.73,0.16 1.09,0.08 0.83,-0.2 1.44,-1.17 1.86,-1.89 0.08,-0.12 0.86,-1.47 0.9,-1.59 -0.01,-0.07 -0.3,-0.5 -0.37,-0.6 -0.04,-0.06 -0.08,-0.15 -0.14,-0.18l-0.38 0.58c-0.13,0.19 -0.25,0.38 -0.38,0.58 -0.25,0.39 -0.49,0.79 -0.75,1.15 -0.14,0.19 -0.28,0.38 -0.42,0.55 -0.54,0.6 -1.44,0.46 -1.48,-0.68z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
@@ -0,0 +1,15 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<!-- Creator: CorelDRAW -->
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="21px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
||||||
|
viewBox="0 0 2.35 2.68"
|
||||||
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
||||||
|
<g id="Capa_x0020_1">
|
||||||
|
<metadata id="CorelCorpID_0Corel-Layer"/>
|
||||||
|
<g id="_1510582825904">
|
||||||
|
<path fill="#221728" fill-opacity="0.501961" d="M0.44 1.9c0.06,0.03 0.13,0.1 0.23,0.11 0.12,0 0.16,-0.11 0.1,-0.19 -0.03,-0.05 -0.13,-0.12 -0.17,-0.16 -0.2,-0.2 -0.09,-0.53 0.12,-0.65 0.16,-0.1 0.32,-0.1 0.53,-0.05l-0.1 0.3c-0.09,-0.02 -0.19,-0.07 -0.3,-0.03 -0.12,0.06 -0.08,0.16 0,0.22 0.12,0.09 0.28,0.2 0.29,0.4 0,0.22 -0.1,0.37 -0.28,0.42 -0.18,0.06 -0.43,-0.05 -0.5,-0.15 0,0 0.04,-0.18 0.08,-0.22zm0.52 -1.38c0.03,-0.14 0.12,-0.29 0.22,-0.32 0.04,0.06 0.04,0.16 0.04,0.24l-0.26 0.08zm0.48 -0.15l-0.12 0.04 -0.03 -0.23c0.07,0.02 0.13,0.1 0.15,0.19zm-0.8 0.25c0.05,-0.22 0.23,-0.55 0.48,-0.52 -0.02,0.04 -0.08,0.06 -0.1,0.09 -0.09,0.09 -0.14,0.24 -0.17,0.37l-0.21 0.06zm-0.64 1.78c0.48,0.08 1.01,0.21 1.47,0.28 0.11,0.02 0.75,-0.14 0.88,-0.17 0.01,-0.07 -0.28,-1.97 -0.29,-2 -0.16,-0.05 -0.18,0.04 -0.29,-0.08 -0.11,-0.12 -0.07,-0.12 -0.24,-0.09 -0.09,-0.12 -0.04,-0.2 -0.27,-0.26 -0.05,-0.01 -0.16,-0.17 -0.39,-0.01 -0.1,0.06 -0.17,0.17 -0.23,0.29 -0.16,0.31 -0.02,0.27 -0.22,0.33 -0.24,0.07 -0.21,0.03 -0.24,0.28 -0.02,0.17 -0.04,0.32 -0.06,0.48 -0.04,0.3 -0.1,0.66 -0.12,0.95z"/>
|
||||||
|
<path fill="#221728" d="M0.44 1.9c-0.04,0.04 -0.08,0.22 -0.08,0.22 0.07,0.1 0.32,0.21 0.5,0.15 0.18,-0.05 0.28,-0.2 0.28,-0.42 -0.01,-0.2 -0.17,-0.31 -0.29,-0.4 -0.08,-0.06 -0.12,-0.16 0,-0.22 0.11,-0.04 0.21,0.01 0.3,0.03l0.1 -0.3c-0.21,-0.05 -0.37,-0.05 -0.53,0.05 -0.21,0.12 -0.32,0.45 -0.12,0.65 0.04,0.04 0.14,0.11 0.17,0.16 0.06,0.08 0.02,0.19 -0.1,0.19 -0.1,-0.01 -0.17,-0.08 -0.23,-0.11z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.1 KiB |
@@ -0,0 +1,15 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<!-- Creator: CorelDRAW -->
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
||||||
|
viewBox="0 0 6.28 6.28"
|
||||||
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
||||||
|
<g id="Capa_x0020_1">
|
||||||
|
<metadata id="CorelCorpID_0Corel-Layer"/>
|
||||||
|
<g id="_1510993446560">
|
||||||
|
<path fill="#221728" d="M2.38 5.72c0.01,-0.13 0.74,-2.18 0.81,-2.3 0.06,0.06 0.83,2.16 0.83,2.26 -0.71,0.19 -0.91,0.18 -1.64,0.04zm-0.42 -0.19c-0.27,-0.06 -0.61,-0.4 -0.77,-0.55 -0.46,-0.45 -0.73,-1.15 -0.74,-1.84 0,-0.23 0.09,-0.97 0.24,-1.04l1.27 3.43zm2.61 -0.14c0.16,-0.53 0.37,-1.08 0.55,-1.62l0.4 -1.23c0.03,-0.1 0.08,-0.39 0.09,-0.43 0.3,0.51 0.25,1.42 0.04,1.98 -0.17,0.46 -0.71,1.2 -1.08,1.3zm-3.63 -3.76c0.11,-0.24 0.49,-0.57 0.72,-0.73 0.68,-0.46 1.54,-0.56 2.32,-0.31 0.3,0.09 0.78,0.34 0.92,0.53 -0.01,0.01 -0.02,0.01 -0.03,0.01l-0.04 0.02c-0.02,0 -0.04,0.01 -0.07,0.01 -0.05,0.01 -0.07,0.02 -0.12,0.04 -0.07,0.05 -0.11,0.09 -0.16,0.16 -0.3,0.49 0.29,0.71 0.43,1.28 0.14,0.56 -0.2,1.52 -0.38,2.02 -0.05,-0.06 -0.94,-2.63 -0.97,-2.79 0.19,-0.03 0.48,0.06 0.39,-0.21 -0.15,-0.05 -1.52,-0.06 -1.67,0 -0.08,0.26 0.15,0.19 0.34,0.2 0.1,0.22 0.19,0.46 0.27,0.69 0.18,0.49 0.22,0.37 0.09,0.73 -0.07,0.22 -0.42,1.32 -0.5,1.44l-0.94 -2.86c0.19,-0.01 0.45,0.07 0.38,-0.19 -0.16,-0.09 -0.74,-0.03 -0.98,-0.04zm-0.93 1.7c0.07,0.93 0.52,1.7 1.01,2.12 2.3,1.99 5.43,0.1 5.25,-2.49 -0.11,-1.66 -1.53,-3.08 -3.31,-2.95 -1.76,0.12 -3.08,1.64 -2.95,3.32z"/>
|
||||||
|
<path fill="#221728" fill-opacity="0.501961" d="M4.57 5.39c0.37,-0.1 0.91,-0.84 1.08,-1.3 0.21,-0.56 0.26,-1.47 -0.04,-1.98 -0.01,0.04 -0.06,0.33 -0.09,0.43l-0.4 1.23c-0.18,0.54 -0.39,1.09 -0.55,1.62zm-2.19 0.33c0.73,0.14 0.93,0.15 1.64,-0.04 0,-0.1 -0.77,-2.2 -0.83,-2.26 -0.07,0.12 -0.8,2.17 -0.81,2.3zm-1.44 -4.09c0.24,0.01 0.82,-0.05 0.98,0.04 0.07,0.26 -0.19,0.18 -0.38,0.19l0.94 2.86c0.08,-0.12 0.43,-1.22 0.5,-1.44 0.13,-0.36 0.09,-0.24 -0.09,-0.73 -0.08,-0.23 -0.17,-0.47 -0.27,-0.69 -0.19,-0.01 -0.42,0.06 -0.34,-0.2 0.15,-0.06 1.52,-0.05 1.67,0 0.09,0.27 -0.2,0.18 -0.39,0.21 0.03,0.16 0.92,2.73 0.97,2.79 0.18,-0.5 0.52,-1.46 0.38,-2.02 -0.14,-0.57 -0.73,-0.79 -0.43,-1.28 0.05,-0.07 0.09,-0.11 0.16,-0.16 0.05,-0.02 0.07,-0.03 0.12,-0.04 0.03,0 0.05,-0.01 0.07,-0.01l0.04 -0.02c0.01,0 0.02,0 0.03,-0.01 -0.14,-0.19 -0.62,-0.44 -0.92,-0.53 -0.78,-0.25 -1.64,-0.15 -2.32,0.31 -0.23,0.16 -0.61,0.49 -0.72,0.73zm1.02 3.9l-1.27 -3.43c-0.15,0.07 -0.24,0.81 -0.24,1.04 0.01,0.69 0.28,1.39 0.74,1.84 0.16,0.15 0.5,0.49 0.77,0.55z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.8 KiB |
@@ -1,12 +1,12 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
<!-- Creator: CorelDRAW -->
|
<!-- Creator: CorelDRAW -->
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="32px" height="46px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="16px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
||||||
viewBox="0 0 4.12 5.95"
|
viewBox="0 0 1.68 2.45"
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
||||||
<g id="Capa_x0020_1">
|
<g id="Capa_x0020_1">
|
||||||
<metadata id="CorelCorpID_0Corel-Layer"/>
|
<metadata id="CorelCorpID_0Corel-Layer"/>
|
||||||
<path fill="#221728" d="M2.06 0c1.13,0 2.06,0.93 2.06,2.06l0 3.89 -0.15 0 0 -3.89c0,-1.05 -0.86,-1.92 -1.91,-1.92 -1.05,0 -1.92,0.87 -1.92,1.92l0 3.89 -0.14 0 0 -3.89c0,-1.13 0.93,-2.06 2.06,-2.06z"/>
|
<path fill="#221728" d="M0 2.45l0.03 0 0 -1.61c0,-0.44 0.37,-0.81 0.81,-0.81 0.44,0 0.81,0.37 0.81,0.81l0 1.61 0.03 0 0 -1.61c0,-0.46 -0.38,-0.84 -0.84,-0.84 -0.46,0 -0.84,0.38 -0.84,0.84l0 1.61z"/>
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 821 B After Width: | Height: | Size: 819 B |
+4
-6
@@ -36,12 +36,10 @@
|
|||||||
<h3>Inicio</h3>
|
<h3>Inicio</h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="inicio.html#hero">Inicio</a></li>
|
<li><a href="inicio.html#hero">Inicio</a></li>
|
||||||
<li><a href="inicio.html#section-2">Sección 2</a></li>
|
<li><a href="inicio.html#servicios">Servicios</a></li>
|
||||||
<li><a href="inicio.html#section-3">Sección 3</a></li>
|
<li><a href="inicio.html#diagnostico">Diagnóstico</a></li>
|
||||||
<li><a href="inicio.html#section-4">Sección 4</a></li>
|
<li><a href="inicio.html#planes-destacados">Destacados</a></li>
|
||||||
<li><a href="inicio.html#section-5">Sección 5</a></li>
|
<li><a href="inicio.html#sportfolio">Desafios</a></li>
|
||||||
<li><a href="inicio.html#section-6">Sección 6</a></li>
|
|
||||||
<li><a href="inicio.html#section-7">Sección 7</a></li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,277 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="es" data-theme="light">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta name="description" content="">
|
||||||
|
<title>Inicio - A&R</title>
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.0/css/all.min.css">
|
||||||
|
<link rel="stylesheet" href="style/main.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="menu-container"></div>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<!-- Sección Hero -->
|
||||||
|
<section id="hero" class="hero-section">
|
||||||
|
<div class="hero-content">
|
||||||
|
<h1 class="hero-title">Marcas con esencia, construidas con estrategia</h1>
|
||||||
|
<p class="hero-subtitle">Diseñamos servicios que se adaptan a tu realidad, para ayudarte a crecer sin perder lo que te hace único</p>
|
||||||
|
<div class="hero-cta-group">
|
||||||
|
<a href="#" class="btn btn-primary hero-cta-primary">Hablemos</a>
|
||||||
|
<a href="inicio.html#servicios" class="btn btn-secondary hero-cta-secondary">Conocé más</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Sección 2: Servicios -->
|
||||||
|
<section id="servicios" class="servicios-section">
|
||||||
|
<div class="servicios-container">
|
||||||
|
<!-- Columna Izquierda: Texto introductorio -->
|
||||||
|
<div class="servicios-intro">
|
||||||
|
<h2 class="servicios-title">¿Qué necesita hoy tu negocio?</h2>
|
||||||
|
<p class="servicios-subtitle">Contamos con soluciones estratégicas para potenciar tu marca en cada etapa de su crecimiento.</p>
|
||||||
|
<a href="servicios.html" class="btn btn-secondary">Ver todos los servicios</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Columna Derecha: Acordeón interactivo -->
|
||||||
|
<div class="servicios-accordion" id="servicios-accordion">
|
||||||
|
<!-- Item 1 -->
|
||||||
|
<div class="servicio-item" data-index="0">
|
||||||
|
<div class="servicio-header">
|
||||||
|
<span class="servicio-icon icon-branding" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-short">Construir una marca</h3>
|
||||||
|
</div>
|
||||||
|
<div class="servicio-content">
|
||||||
|
<span class="servicio-icon-large icon-branding" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-long">Construcción de Identidad Estratégica</h3>
|
||||||
|
<p class="servicio-description">Definimos el ADN de tu marca, su posicionamiento y el camino para conectar con tu audiencia ideal de manera auténtica y memorable.</p>
|
||||||
|
<a href="servicios.html#estrategia" class="btn btn-primary">Conocer más</a>
|
||||||
|
<button class="servicio-close" aria-label="Cerrar">✕</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Item 2 -->
|
||||||
|
<div class="servicio-item" data-index="1">
|
||||||
|
<div class="servicio-header">
|
||||||
|
<span class="servicio-icon icon-rrss" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-short">Mejorar presencia digital</h3>
|
||||||
|
</div>
|
||||||
|
<div class="servicio-content">
|
||||||
|
<span class="servicio-icon-large icon-rrss" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-long">Comunidades que Convierten</h3>
|
||||||
|
<p class="servicio-description">Creamos contenido de valor y gestionamos tus redes para construir una comunidad activa, fiel y comprometida con tu marca.</p>
|
||||||
|
<a href="servicios.html#redes" class="btn btn-primary">Conocer más</a>
|
||||||
|
<button class="servicio-close" aria-label="Cerrar">✕</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Item 3 -->
|
||||||
|
<div class="servicio-item" data-index="2">
|
||||||
|
<div class="servicio-header">
|
||||||
|
<span class="servicio-icon icon-web" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-short">Generar Contenido</h3>
|
||||||
|
</div>
|
||||||
|
<div class="servicio-content">
|
||||||
|
<span class="servicio-icon-large icon-web" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-long">Experiencias Digitales Impactantes</h3>
|
||||||
|
<p class="servicio-description">Diseñamos y desarrollamos sitios web y plataformas digitales que no solo se ven bien, sino que generan resultados tangibles.</p>
|
||||||
|
<a href="servicios.html#digital" class="btn btn-primary">Conocer más</a>
|
||||||
|
<button class="servicio-close" aria-label="Cerrar">✕</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Item 4 -->
|
||||||
|
<div class="servicio-item" data-index="3">
|
||||||
|
<div class="servicio-header">
|
||||||
|
<span class="servicio-icon icon-auto" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-short">Automatizar procesos</h3>
|
||||||
|
</div>
|
||||||
|
<div class="servicio-content">
|
||||||
|
<span class="servicio-icon-large icon-auto" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-long">Historias que Enamoran</h3>
|
||||||
|
<p class="servicio-description">Producimos contenido audiovisual y gráfico de alta calidad que cuenta la historia de tu marca y cautiva a tu audiencia.</p>
|
||||||
|
<a href="servicios.html#contenido" class="btn btn-primary">Conocer más</a>
|
||||||
|
<button class="servicio-close" aria-label="Cerrar">✕</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Item 5 -->
|
||||||
|
<div class="servicio-item" data-index="4">
|
||||||
|
<div class="servicio-header">
|
||||||
|
<span class="servicio-icon icon-paid" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-short">Conseguir más clientes</h3>
|
||||||
|
</div>
|
||||||
|
<div class="servicio-content">
|
||||||
|
<span class="servicio-icon-large icon-paid" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-long">Campañas que Escalan Resultados</h3>
|
||||||
|
<p class="servicio-description">Gestionamos campañas de paid media en Meta, Google y LinkedIn para maximizar tu ROI y alcanzar a los clientes correctos.</p>
|
||||||
|
<a href="servicios.html#pauta" class="btn btn-primary">Conocer más</a>
|
||||||
|
<button class="servicio-close" aria-label="Cerrar">✕</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Item 6 -->
|
||||||
|
<div class="servicio-item" data-index="5">
|
||||||
|
<div class="servicio-header">
|
||||||
|
<span class="servicio-icon icon-add" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-short">Consultoría de Marketing</h3>
|
||||||
|
</div>
|
||||||
|
<div class="servicio-content">
|
||||||
|
<span class="servicio-icon-large icon-add" aria-hidden="true"></span>
|
||||||
|
<h3 class="servicio-title-long">Asesoramiento Estratégico Integral</h3>
|
||||||
|
<p class="servicio-description">Te acompañamos en la toma de decisiones clave, optimizando tus recursos y alineando tu marketing con los objetivos de tu negocio.</p>
|
||||||
|
<a href="servicios.html#consultoria" class="btn btn-primary">Conocer más</a>
|
||||||
|
<button class="servicio-close" aria-label="Cerrar">✕</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Sección 3: Diagnóstico -->
|
||||||
|
<section id="diagnostico" class="diagnostico-section">
|
||||||
|
<div class="diagnostico-header">
|
||||||
|
<h2 class="diagnostico-title">¿Qué necesita hoy tu negocio?</h2>
|
||||||
|
<p class="diagnostico-subtitle">Contamos con soluciones estratégicas para potenciar tu marca en cada etapa de su crecimiento.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="diagnostico-card">
|
||||||
|
<!-- Barra de Progreso -->
|
||||||
|
<div class="progreso-wrapper">
|
||||||
|
<div class="progreso-barra">
|
||||||
|
<div class="progreso-barra-completado" id="progreso-completado"></div>
|
||||||
|
</div>
|
||||||
|
<div class="progreso-texto" id="progreso-texto">Pregunta 1 de 4</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Contenedor de Preguntas -->
|
||||||
|
<div id="cuestionario-contenedor">
|
||||||
|
<!-- Las preguntas se generan dinámicamente con JavaScript -->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Botón Reiniciar -->
|
||||||
|
<button class="btn-reiniciar" id="btn-reiniciar">
|
||||||
|
Reiniciar Diagnóstico
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Contenedor de Resultados (oculto inicialmente) -->
|
||||||
|
<div id="resultado-contenedor" class="resultado-contenedor" style="display: none;">
|
||||||
|
<!-- El resultado se genera dinámicamente con JavaScript -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Sección 4: Metodología -->
|
||||||
|
<section id="metodologia" class="metodologia-section">
|
||||||
|
<div class="metodologia-header">
|
||||||
|
<h2 class="metodologia-title">Método A&R</h2>
|
||||||
|
<p class="metodologia-subtitle">Hablamos de tu marca y objetivos.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="metodologia-grid">
|
||||||
|
<!-- Paso 1: Contacto -->
|
||||||
|
<div class="paso-item" data-paso="0">
|
||||||
|
<div class="paso-arco">
|
||||||
|
<span class="arco-svg" aria-hidden="true"></span>
|
||||||
|
<span class="paso-icono icon-contacto" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="paso-info">
|
||||||
|
<h3 class="paso-titulo">Contacto</h3>
|
||||||
|
<p class="paso-subtitulo">Reunión de brief</p>
|
||||||
|
<p class="paso-body">Entregables, inversion y tiempos.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Paso 2: Propuesta -->
|
||||||
|
<div class="paso-item" data-paso="1">
|
||||||
|
<div class="paso-arco">
|
||||||
|
<span class="arco-svg" aria-hidden="true"></span>
|
||||||
|
<span class="paso-icono icon-propuesta" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="paso-info">
|
||||||
|
<h3 class="paso-titulo">Propuesta</h3>
|
||||||
|
<p class="paso-subtitulo">Plan de trabajo</p>
|
||||||
|
<p class="paso-body">Concepto visual a tu aprobación.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Paso 3: Diseño -->
|
||||||
|
<div class="paso-item" data-paso="2">
|
||||||
|
<div class="paso-arco">
|
||||||
|
<span class="arco-svg" aria-hidden="true"></span>
|
||||||
|
<span class="paso-icono icon-diseno" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="paso-info">
|
||||||
|
<h3 class="paso-titulo">Diseño</h3>
|
||||||
|
<p class="paso-subtitulo">Dirección de arte</p>
|
||||||
|
<p class="paso-body">Concepto visual a tu aprobación.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Paso 4: Producción -->
|
||||||
|
<div class="paso-item" data-paso="3">
|
||||||
|
<div class="paso-arco">
|
||||||
|
<span class="arco-svg" aria-hidden="true"></span>
|
||||||
|
<span class="paso-icono icon-produccion" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="paso-info">
|
||||||
|
<h3 class="paso-titulo">Producción</h3>
|
||||||
|
<p class="paso-subtitulo">Desarrollo</p>
|
||||||
|
<p class="paso-body">Construimos con seguimiento.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Paso 5: Revisión -->
|
||||||
|
<div class="paso-item" data-paso="4">
|
||||||
|
<div class="paso-arco">
|
||||||
|
<span class="arco-svg" aria-hidden="true"></span>
|
||||||
|
<span class="paso-icono icon-revision" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="paso-info">
|
||||||
|
<h3 class="paso-titulo">Revisión</h3>
|
||||||
|
<p class="paso-subtitulo">Ajustes finales</p>
|
||||||
|
<p class="paso-body">Tu feedback moldea el resultado.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Paso 6: Lanzamiento -->
|
||||||
|
<div class="paso-item" data-paso="5">
|
||||||
|
<div class="paso-arco">
|
||||||
|
<span class="arco-svg" aria-hidden="true"></span>
|
||||||
|
<span class="paso-icono icon-lanzamiento" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="paso-info">
|
||||||
|
<h3 class="paso-titulo">Lanzamiento</h3>
|
||||||
|
<p class="paso-subtitulo">Entrega</p>
|
||||||
|
<p class="paso-body">Accesos y capacitación completa.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Sección 5 -->
|
||||||
|
<section id="inicio-section-5">
|
||||||
|
<h2>Sección 5</h2>
|
||||||
|
<p>Contenido pendiente de definir.</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Sección 6 -->
|
||||||
|
<section id="inicio-section-6">
|
||||||
|
<h2>Sección 6</h2>
|
||||||
|
<p>Contenido pendiente de definir.</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- Sección 7 -->
|
||||||
|
<section id="inicio-section-7">
|
||||||
|
<h2>Sección 7</h2>
|
||||||
|
<p>Contenido pendiente de definir.</p>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<div id="footer-container"></div>
|
||||||
|
|
||||||
|
<script src="scripts/main.js"></script>
|
||||||
|
<script src="scripts/efecto.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
+187
-18
@@ -15,8 +15,8 @@
|
|||||||
<!-- Sección Hero -->
|
<!-- Sección Hero -->
|
||||||
<section id="hero" class="hero-section">
|
<section id="hero" class="hero-section">
|
||||||
<div class="hero-content">
|
<div class="hero-content">
|
||||||
<h1 class="hero-title">Marcas con esencia, construidas con estrategia.</h1>
|
<h1 class="hero-title">Marcas con esencia, construidas con estrategia</h1>
|
||||||
<p class="hero-subtitle">Tenemos las disciplinas que los negocios necesitan para crecer sin perder lo que los hace únicos.</p>
|
<p class="hero-subtitle">Diseñamos servicios que se adaptan a tu realidad, para ayudarte a crecer sin perder lo que te hace único</p>
|
||||||
<div class="hero-cta-group">
|
<div class="hero-cta-group">
|
||||||
<a href="#" class="btn btn-primary hero-cta-primary">Hablemos</a>
|
<a href="#" class="btn btn-primary hero-cta-primary">Hablemos</a>
|
||||||
<a href="inicio.html#servicios" class="btn btn-secondary hero-cta-secondary">Conocé más</a>
|
<a href="inicio.html#servicios" class="btn btn-secondary hero-cta-secondary">Conocé más</a>
|
||||||
@@ -166,7 +166,7 @@
|
|||||||
<section id="metodologia" class="metodologia-section">
|
<section id="metodologia" class="metodologia-section">
|
||||||
<div class="metodologia-header">
|
<div class="metodologia-header">
|
||||||
<h2 class="metodologia-title">Método A&R</h2>
|
<h2 class="metodologia-title">Método A&R</h2>
|
||||||
<p class="metodologia-subtitle">Tu proceso paso a paso sin sorpresas</p>
|
<p class="metodologia-subtitle">Calibramos nuestro método para cada cliente. <br>Nuestras decisiones se basan en datos y estrategias.</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="metodologia-grid">
|
<div class="metodologia-grid">
|
||||||
@@ -179,6 +179,7 @@
|
|||||||
<div class="paso-info">
|
<div class="paso-info">
|
||||||
<h3 class="paso-titulo">Contacto</h3>
|
<h3 class="paso-titulo">Contacto</h3>
|
||||||
<p class="paso-subtitulo">Reunión de brief</p>
|
<p class="paso-subtitulo">Reunión de brief</p>
|
||||||
|
<p class="paso-body">Entendemos tu negocio <br>y tus objetivos.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -191,6 +192,7 @@
|
|||||||
<div class="paso-info">
|
<div class="paso-info">
|
||||||
<h3 class="paso-titulo">Propuesta</h3>
|
<h3 class="paso-titulo">Propuesta</h3>
|
||||||
<p class="paso-subtitulo">Plan de trabajo</p>
|
<p class="paso-subtitulo">Plan de trabajo</p>
|
||||||
|
<p class="paso-body">Diseñamos la estrategia, <br> definimos metas.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -203,6 +205,7 @@
|
|||||||
<div class="paso-info">
|
<div class="paso-info">
|
||||||
<h3 class="paso-titulo">Diseño</h3>
|
<h3 class="paso-titulo">Diseño</h3>
|
||||||
<p class="paso-subtitulo">Dirección de arte</p>
|
<p class="paso-subtitulo">Dirección de arte</p>
|
||||||
|
<p class="paso-body">Concepto visual a tu aprobación.<br> Activamos y monitoreamos.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -215,6 +218,7 @@
|
|||||||
<div class="paso-info">
|
<div class="paso-info">
|
||||||
<h3 class="paso-titulo">Producción</h3>
|
<h3 class="paso-titulo">Producción</h3>
|
||||||
<p class="paso-subtitulo">Desarrollo</p>
|
<p class="paso-subtitulo">Desarrollo</p>
|
||||||
|
<p class="paso-body">Construimos con seguimiento.<br> Analizamos y optimizamos.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -226,40 +230,205 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="paso-info">
|
<div class="paso-info">
|
||||||
<h3 class="paso-titulo">Revisión</h3>
|
<h3 class="paso-titulo">Revisión</h3>
|
||||||
<p class="paso-subtitulo">Ajustes finales</p>
|
<p class="paso-subtitulo">Feedback</p>
|
||||||
|
<p class="paso-body">Ajustamos según resultados y <br>aprendizajes del mercado.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Paso 6: Lanzamiento -->
|
<!-- Paso 6: Resultado -->
|
||||||
<div class="paso-item" data-paso="5">
|
<div class="paso-item" data-paso="5">
|
||||||
<div class="paso-arco">
|
<div class="paso-arco">
|
||||||
<span class="arco-svg" aria-hidden="true"></span>
|
<span class="arco-svg" aria-hidden="true"></span>
|
||||||
<span class="paso-icono icon-lanzamiento" aria-hidden="true"></span>
|
<span class="paso-icono icon-lanzamiento" aria-hidden="true"></span>
|
||||||
</div>
|
</div>
|
||||||
<div class="paso-info">
|
<div class="paso-info">
|
||||||
<h3 class="paso-titulo">Lanzamiento</h3>
|
<h3 class="paso-titulo">Resultado</h3>
|
||||||
<p class="paso-subtitulo">Entrega</p>
|
<p class="paso-subtitulo">Entrega</p>
|
||||||
|
<p class="paso-body">Accesos, capacitaciones y definimos próximos pasos.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- Sección 5 -->
|
<!-- Sección 5: Planes Destacados -->
|
||||||
<section id="inicio-section-5">
|
<section id="planes-destacados" class="planes-section">
|
||||||
<h2>Sección 5</h2>
|
<div class="planes-header">
|
||||||
<p>Contenido pendiente de definir.</p>
|
<h2 class="planes-title">Planes destacados</h2>
|
||||||
|
<p class="planes-subtitle">Soluciones diseñadas para cada etapa de tu marca</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="planes-grid" id="planes-grid">
|
||||||
|
<!-- Plan 1: Esencial -->
|
||||||
|
<article class="plan-card" data-plan="esencial">
|
||||||
|
<div class="plan-header">
|
||||||
|
<h3 class="plan-title">Plan Esencial</h3>
|
||||||
|
<p class="plan-subtitle">Para marcas que recién comienzan</p>
|
||||||
|
</div>
|
||||||
|
<ul class="plan-features">
|
||||||
|
<li>Identidad visual básica</li>
|
||||||
|
<li>Diseño de sitio web institucional</li>
|
||||||
|
<li>Gestión inicial de redes sociales</li>
|
||||||
|
<li>Reporte mensual de métricas</li>
|
||||||
|
</ul>
|
||||||
|
<div class="plan-tags">
|
||||||
|
<span class="plan-tag">Branding</span>
|
||||||
|
<span class="plan-tag">Web</span>
|
||||||
|
<span class="plan-tag">Redes</span>
|
||||||
|
</div>
|
||||||
|
<a href="planes.html#esencial" class="btn btn-secondary plan-cta">Ver plan completo</a>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<!-- Plan 2: Premium (destacado) -->
|
||||||
|
<article class="plan-card plan-featured" data-plan="premium">
|
||||||
|
<div class="plan-badge" aria-label="Plan recomendado">
|
||||||
|
<svg class="laurel-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M12 2L14 7L19 7L15 10L17 15L12 12L7 15L9 10L5 7L10 7Z"/>
|
||||||
|
</svg>
|
||||||
|
<span class="badge-text">Recomendado</span>
|
||||||
|
</div>
|
||||||
|
<div class="plan-header">
|
||||||
|
<h3 class="plan-title">Plan Premium</h3>
|
||||||
|
<p class="plan-subtitle">Para negocios que quieren escalar</p>
|
||||||
|
</div>
|
||||||
|
<ul class="plan-features">
|
||||||
|
<li>Branding completo y manual de marca</li>
|
||||||
|
<li>Sitio web + landing de conversión</li>
|
||||||
|
<li>Producción audiovisual mensual</li>
|
||||||
|
<li>Campañas de paid media (Meta + Google)</li>
|
||||||
|
<li>Automatizaciones de WhatsApp</li>
|
||||||
|
</ul>
|
||||||
|
<div class="plan-tags">
|
||||||
|
<span class="plan-tag">Branding</span>
|
||||||
|
<span class="plan-tag">Web</span>
|
||||||
|
<span class="plan-tag">Contenido</span>
|
||||||
|
<span class="plan-tag">Paid Media</span>
|
||||||
|
<span class="plan-tag">Automatización</span>
|
||||||
|
</div>
|
||||||
|
<a href="planes.html#premium" class="btn btn-primary plan-cta">Ver plan completo</a>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<!-- Plan 3: Corporativo -->
|
||||||
|
<article class="plan-card" data-plan="corporativo">
|
||||||
|
<div class="plan-header">
|
||||||
|
<h3 class="plan-title">Plan Corporativo</h3>
|
||||||
|
<p class="plan-subtitle">Gestión integral 360°</p>
|
||||||
|
</div>
|
||||||
|
<ul class="plan-features">
|
||||||
|
<li>Dirección creativa y estratégica</li>
|
||||||
|
<li>Branding integral + packaging</li>
|
||||||
|
<li>Pauta multicanal (Meta, TikTok, Google)</li>
|
||||||
|
<li>Reportes quincenales con KPIs</li>
|
||||||
|
<li>Equipo dedicado a tu marca</li>
|
||||||
|
</ul>
|
||||||
|
<div class="plan-tags">
|
||||||
|
<span class="plan-tag">Estrategia</span>
|
||||||
|
<span class="plan-tag">Branding</span>
|
||||||
|
<span class="plan-tag">Paid Media</span>
|
||||||
|
<span class="plan-tag">KPIs</span>
|
||||||
|
</div>
|
||||||
|
<a href="planes.html#corporativo" class="btn btn-secondary plan-cta">Ver plan completo</a>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- Sección 6 -->
|
<!-- Sección 6: Portfolio -->
|
||||||
<section id="inicio-section-6">
|
<section id="portfolio" class="portfolio-section">
|
||||||
<h2>Sección 6</h2>
|
<div class="portfolio-container">
|
||||||
<p>Contenido pendiente de definir.</p>
|
<!-- Columna Izquierda: Texto -->
|
||||||
|
<div class="portfolio-text">
|
||||||
|
<h2 class="portfolio-title">Nuestros últimos desafíos</h2>
|
||||||
|
<p class="portfolio-subtitle">Cada proyecto es una oportunidad para crear algo único y memorable</p>
|
||||||
|
<a href="portfolio.html" class="btn btn-secondary">Ver portfolio completo</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Columna Derecha: Carrusel -->
|
||||||
|
<div class="portfolio-carousel">
|
||||||
|
<div class="carousel-container">
|
||||||
|
<div class="carousel-slide active">
|
||||||
|
<img src="assets/img/proyecto1.png" alt="Proyecto 1" class="carousel-image">
|
||||||
|
</div>
|
||||||
|
<div class="carousel-slide">
|
||||||
|
<img src="assets/img/proyecto2.png" alt="Proyecto 2" class="carousel-image">
|
||||||
|
</div>
|
||||||
|
<div class="carousel-slide">
|
||||||
|
<img src="assets/img/proyecto3.png" alt="Proyecto 3" class="carousel-image">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="carousel-indicators">
|
||||||
|
<span class="indicator active" data-slide="0"></span>
|
||||||
|
<span class="indicator" data-slide="1"></span>
|
||||||
|
<span class="indicator" data-slide="2"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Tira de Iconos (Certificaciones, Herramientas, Marcas) -->
|
||||||
|
<div class="marquee-section">
|
||||||
|
<div class="marquee-track" id="marquee-track">
|
||||||
|
<!-- Primera tanda de iconos -->
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-google" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-meta" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-hubspot" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-shopify" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-wordpress" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-figma" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-adobe" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-mailchimp" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<!-- Segunda tanda (duplicada para loop infinito) -->
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-google" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-meta" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-hubspot" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-shopify" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-wordpress" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-figma" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-adobe" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
<div class="marquee-item">
|
||||||
|
<span class="marquee-icon icon-mailchimp" aria-hidden="true"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- Sección 7 -->
|
<!-- Sección 7: CTA Final -->
|
||||||
<section id="inicio-section-7">
|
<section id="cta-final" class="cta-section">
|
||||||
<h2>Sección 7</h2>
|
<div class="cta-card">
|
||||||
<p>Contenido pendiente de definir.</p>
|
<h2 class="cta-title">¿Listo para hacer crecer tu marca?</h2>
|
||||||
|
<p class="cta-subtitle">Contanos tu desafío y diseñemos juntos la estrategia que tu negocio necesita. Sin compromiso, sin vueltas.</p>
|
||||||
|
<div class="cta-buttons">
|
||||||
|
<a href="contacto.html" class="btn btn-cta-primary">Hablemos ahora</a>
|
||||||
|
<a href="servicios.html" class="btn btn-cta-secondary">Conocé nuestros servicios</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
|
|||||||
@@ -479,6 +479,102 @@ function initMetodologiaAnimation() {
|
|||||||
// Inicializar el primer estado (sin animación aún)
|
// Inicializar el primer estado (sin animación aún)
|
||||||
actualizarEstados();
|
actualizarEstados();
|
||||||
}
|
}
|
||||||
|
/* ============================================
|
||||||
|
EFECTO FOCO EN TARJETAS DE PLANES
|
||||||
|
============================================ */
|
||||||
|
function initPlanesFocusEffect() {
|
||||||
|
const grid = document.getElementById('planes-grid');
|
||||||
|
if (!grid) return;
|
||||||
|
|
||||||
|
const cards = grid.querySelectorAll('.plan-card');
|
||||||
|
if (cards.length === 0) return;
|
||||||
|
|
||||||
|
cards.forEach(card => {
|
||||||
|
card.addEventListener('mouseenter', () => {
|
||||||
|
grid.classList.add('is-hovering');
|
||||||
|
card.classList.add('is-focused');
|
||||||
|
});
|
||||||
|
|
||||||
|
card.addEventListener('mouseleave', () => {
|
||||||
|
grid.classList.remove('is-hovering');
|
||||||
|
card.classList.remove('is-focused');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* ============================================
|
||||||
|
CARRUSEL AUTOMÁTICO DE PORTFOLIO
|
||||||
|
============================================ */
|
||||||
|
function initPortfolioCarousel() {
|
||||||
|
const slides = document.querySelectorAll('.carousel-slide');
|
||||||
|
const indicators = document.querySelectorAll('.indicator');
|
||||||
|
|
||||||
|
if (slides.length === 0) return;
|
||||||
|
|
||||||
|
let currentSlide = 0;
|
||||||
|
const INTERVAL = 4000; // 4 segundos
|
||||||
|
let intervalId;
|
||||||
|
|
||||||
|
function goToSlide(index) {
|
||||||
|
// Remover clase active de todos
|
||||||
|
slides.forEach(slide => slide.classList.remove('active'));
|
||||||
|
indicators.forEach(indicator => indicator.classList.remove('active'));
|
||||||
|
|
||||||
|
// Activar el slide actual
|
||||||
|
slides[index].classList.add('active');
|
||||||
|
indicators[index].classList.add('active');
|
||||||
|
|
||||||
|
currentSlide = index;
|
||||||
|
}
|
||||||
|
|
||||||
|
function nextSlide() {
|
||||||
|
const next = (currentSlide + 1) % slides.length;
|
||||||
|
goToSlide(next);
|
||||||
|
}
|
||||||
|
|
||||||
|
function startCarousel() {
|
||||||
|
intervalId = setInterval(nextSlide, INTERVAL);
|
||||||
|
}
|
||||||
|
|
||||||
|
function stopCarousel() {
|
||||||
|
clearInterval(intervalId);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Click en indicadores
|
||||||
|
indicators.forEach((indicator, index) => {
|
||||||
|
indicator.addEventListener('click', () => {
|
||||||
|
stopCarousel();
|
||||||
|
goToSlide(index);
|
||||||
|
startCarousel();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Iniciar carrusel
|
||||||
|
startCarousel();
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ============================================
|
||||||
|
TIRA MARQUEE CON HOVER INTERACTIVO
|
||||||
|
============================================ */
|
||||||
|
function initMarqueeHover() {
|
||||||
|
const track = document.getElementById('marquee-track');
|
||||||
|
if (!track) return;
|
||||||
|
|
||||||
|
const icons = track.querySelectorAll('.marquee-icon');
|
||||||
|
if (icons.length === 0) return;
|
||||||
|
|
||||||
|
icons.forEach(icon => {
|
||||||
|
icon.addEventListener('mouseenter', () => {
|
||||||
|
track.classList.add('is-slow');
|
||||||
|
});
|
||||||
|
|
||||||
|
icon.addEventListener('mouseleave', () => {
|
||||||
|
track.classList.remove('is-slow');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// Inicializar cuestionario al cargar la página
|
// Inicializar cuestionario al cargar la página
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
@@ -490,4 +586,6 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||||||
document.getElementById('btn-reiniciar').addEventListener('click', reiniciarCuestionario);
|
document.getElementById('btn-reiniciar').addEventListener('click', reiniciarCuestionario);
|
||||||
}
|
}
|
||||||
initMetodologiaAnimation();
|
initMetodologiaAnimation();
|
||||||
|
initPlanesFocusEffect();
|
||||||
|
initPortfolioCarousel();
|
||||||
});
|
});
|
||||||
+596
-6
@@ -13,6 +13,7 @@
|
|||||||
--brand-teal: #003f52;
|
--brand-teal: #003f52;
|
||||||
--brand-sage-light: #eaf0ee;
|
--brand-sage-light: #eaf0ee;
|
||||||
--brand-rose-muted: #dfbdb9;
|
--brand-rose-muted: #dfbdb9;
|
||||||
|
--bg-dark-web: #110916;
|
||||||
|
|
||||||
/* Tema Claro (Por Defecto) */
|
/* Tema Claro (Por Defecto) */
|
||||||
--bg-base: var(--brand-sage-light);
|
--bg-base: var(--brand-sage-light);
|
||||||
@@ -56,8 +57,8 @@
|
|||||||
|
|
||||||
/* Modo oscuro */
|
/* Modo oscuro */
|
||||||
[data-theme="dark"] {
|
[data-theme="dark"] {
|
||||||
--bg-base: var(--brand-plum);
|
--bg-base: var(--bg-dark-web);
|
||||||
--bg-surface: #2d2034;
|
--bg-surface: #221728;
|
||||||
--bg-surface-elevated: #392842;
|
--bg-surface-elevated: #392842;
|
||||||
|
|
||||||
--text-primary: var(--brand-sage-light);
|
--text-primary: var(--brand-sage-light);
|
||||||
@@ -343,7 +344,7 @@ ul {
|
|||||||
transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.3s ease;
|
transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.3s ease;
|
||||||
z-index: 999;
|
z-index: 999;
|
||||||
overflow: hidden; /* Clave para contener los destellos de la aurora */
|
overflow: hidden; /* Clave para contener los destellos de la aurora */
|
||||||
padding: var(--spacing-md) var(--spacing-lg) var(--spacing-lg);
|
padding: var(--spacing-md) var(--spacing-lg) var(--spacing-sm);
|
||||||
box-shadow: 0 -10px 40px -5px rgba(0, 0, 0, 0.2);
|
box-shadow: 0 -10px 40px -5px rgba(0, 0, 0, 0.2);
|
||||||
isolation: isolate;
|
isolation: isolate;
|
||||||
}
|
}
|
||||||
@@ -615,7 +616,7 @@ ul {
|
|||||||
/* ============================================
|
/* ============================================
|
||||||
RESPONSIVE
|
RESPONSIVE
|
||||||
============================================ */
|
============================================ */
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 769px) {
|
||||||
.fullscreen-menu {
|
.fullscreen-menu {
|
||||||
height: 85vh;
|
height: 85vh;
|
||||||
padding: var(--spacing-md);
|
padding: var(--spacing-md);
|
||||||
@@ -1569,7 +1570,7 @@ SECCIÓN METODOLOGÍA
|
|||||||
.paso-titulo {
|
.paso-titulo {
|
||||||
font-family: var(--font-title);
|
font-family: var(--font-title);
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
font-size: 1.1rem;
|
font-size: 1.2rem;
|
||||||
color: var(--text-primary);
|
color: var(--text-primary);
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
transition: all 0.5s ease;
|
transition: all 0.5s ease;
|
||||||
@@ -1577,6 +1578,12 @@ SECCIÓN METODOLOGÍA
|
|||||||
|
|
||||||
.paso-subtitulo {
|
.paso-subtitulo {
|
||||||
font-family: var(--font-body);
|
font-family: var(--font-body);
|
||||||
|
font-size: 1rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
transition: all 0.5s ease;
|
||||||
|
}
|
||||||
|
.paso-body{
|
||||||
|
font-family: var(--font-small);
|
||||||
font-size: 0.85rem;
|
font-size: 0.85rem;
|
||||||
color: var(--text-muted);
|
color: var(--text-muted);
|
||||||
transition: all 0.5s ease;
|
transition: all 0.5s ease;
|
||||||
@@ -1629,7 +1636,7 @@ ESTADOS DE ANIMACIÓN
|
|||||||
}
|
}
|
||||||
|
|
||||||
.paso-item.previous .paso-titulo {
|
.paso-item.previous .paso-titulo {
|
||||||
color: var(--brand-teal);
|
color: var(--text-muted);
|
||||||
}
|
}
|
||||||
|
|
||||||
.paso-item.previous .paso-subtitulo {
|
.paso-item.previous .paso-subtitulo {
|
||||||
@@ -1701,4 +1708,587 @@ RESPONSIVE METODOLOGÍA
|
|||||||
.paso-subtitulo {
|
.paso-subtitulo {
|
||||||
transition: none;
|
transition: none;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ============================================
|
||||||
|
SECCIÓN PLANES DESTACADOS
|
||||||
|
============================================ */
|
||||||
|
.planes-section {
|
||||||
|
padding: var(--spacing-lg) var(--spacing-md);
|
||||||
|
background-color: var(--bg-base);
|
||||||
|
}
|
||||||
|
|
||||||
|
.planes-header {
|
||||||
|
text-align: center;
|
||||||
|
max-width: 700px;
|
||||||
|
margin: 0 auto var(--spacing-lg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.planes-title {
|
||||||
|
font-size: clamp(2rem, 4vw, 3rem);
|
||||||
|
color: var(--text-primary);
|
||||||
|
margin-bottom: var(--spacing-sm);
|
||||||
|
line-height: 1.15;
|
||||||
|
}
|
||||||
|
|
||||||
|
.planes-subtitle {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Grid de tarjetas */
|
||||||
|
.planes-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
gap: var(--spacing-md);
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
align-items: stretch;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tarjeta base */
|
||||||
|
.plan-card {
|
||||||
|
position: relative;
|
||||||
|
background-color: var(--bg-surface);
|
||||||
|
border: 1.5px solid var(--border);
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: var(--spacing-md);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: var(--spacing-sm);
|
||||||
|
transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Efecto foco: cuando el grid está en hover, todas se atenúan */
|
||||||
|
.planes-grid.is-hovering .plan-card {
|
||||||
|
opacity: 0.45;
|
||||||
|
transform: scale(0.97);
|
||||||
|
filter: grayscale(30%);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* La tarjeta activa resalta sobre las demás */
|
||||||
|
.planes-grid.is-hovering .plan-card.is-focused {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale(1.03);
|
||||||
|
filter: grayscale(0%);
|
||||||
|
border-color: var(--btn-primary-bg);
|
||||||
|
box-shadow: 0 12px 32px -8px rgba(186, 18, 77, 0.25);
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hover individual (fallback si JS no carga) */
|
||||||
|
.plan-card:hover {
|
||||||
|
border-color: var(--btn-primary-bg);
|
||||||
|
box-shadow: 0 12px 32px -8px rgba(186, 18, 77, 0.25);
|
||||||
|
transform: translateY(-4px);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header de la tarjeta */
|
||||||
|
.plan-header {
|
||||||
|
margin-bottom: var(--spacing-xs);
|
||||||
|
}
|
||||||
|
|
||||||
|
.plan-title {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
color: var(--text-primary);
|
||||||
|
margin-bottom: 0.25rem;
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.plan-subtitle {
|
||||||
|
font-family: var(--font-body);
|
||||||
|
font-size: 0.95rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Lista de características */
|
||||||
|
.plan-features {
|
||||||
|
list-style: none;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 0.6rem;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.plan-features li {
|
||||||
|
font-size: 0.95rem;
|
||||||
|
color: var(--text-primary);
|
||||||
|
padding-left: 1.5rem;
|
||||||
|
position: relative;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.plan-features li::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0.45rem;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
background-color: var(--btn-primary-bg);
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tags de servicios */
|
||||||
|
.plan-tags {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.4rem;
|
||||||
|
margin-top: var(--spacing-xs);
|
||||||
|
}
|
||||||
|
|
||||||
|
.plan-tag {
|
||||||
|
font-family: var(--font-small);
|
||||||
|
font-size: 0.75rem;
|
||||||
|
font-weight: 600;
|
||||||
|
padding: 0.3rem 0.7rem;
|
||||||
|
border-radius: 999px;
|
||||||
|
background-color: var(--badge-bg);
|
||||||
|
color: var(--badge-text);
|
||||||
|
letter-spacing: 0.3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* CTA */
|
||||||
|
.plan-cta {
|
||||||
|
margin-top: var(--spacing-sm);
|
||||||
|
align-self: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ============================================
|
||||||
|
PLAN DESTACADO (badge tipo laurel)
|
||||||
|
============================================ */
|
||||||
|
.plan-featured {
|
||||||
|
border-color: var(--brand-rose-muted);
|
||||||
|
background-color: var(--bg-surface-elevated);
|
||||||
|
}
|
||||||
|
|
||||||
|
.plan-badge {
|
||||||
|
position: absolute;
|
||||||
|
top: -12px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.35rem;
|
||||||
|
padding: 0.3rem 0.9rem;
|
||||||
|
background-color: var(--bg-surface);
|
||||||
|
border: 1px solid var(--brand-rose-muted);
|
||||||
|
border-radius: 999px;
|
||||||
|
color: var(--brand-crimson);
|
||||||
|
font-family: var(--font-small);
|
||||||
|
font-size: 0.75rem;
|
||||||
|
font-weight: 600;
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
box-shadow: 0 2px 8px -2px rgba(186, 18, 77, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
.laurel-icon {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
stroke: var(--brand-crimson);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ============================================
|
||||||
|
RESPONSIVE PLANES
|
||||||
|
============================================ */
|
||||||
|
@media (max-width: 968px) {
|
||||||
|
.planes-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
max-width: 500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.plan-featured {
|
||||||
|
order: -1; /* El destacado aparece primero en mobile */
|
||||||
|
}
|
||||||
|
|
||||||
|
.plan-badge {
|
||||||
|
top: -10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 480px) {
|
||||||
|
.planes-section {
|
||||||
|
padding: var(--spacing-md) var(--spacing-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.plan-card {
|
||||||
|
padding: var(--spacing-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.plan-title {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ============================================
|
||||||
|
SECCIÓN PORTFOLIO
|
||||||
|
============================================ */
|
||||||
|
.portfolio-section {
|
||||||
|
padding: var(--spacing-lg) var(--spacing-md);
|
||||||
|
background-color: var(--bg-base);
|
||||||
|
}
|
||||||
|
|
||||||
|
.portfolio-container {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1.2fr;
|
||||||
|
gap: var(--spacing-lg);
|
||||||
|
max-width: 1400px;
|
||||||
|
margin: 0 auto;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Columna Izquierda: Texto */
|
||||||
|
.portfolio-text {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: var(--spacing-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.portfolio-title {
|
||||||
|
font-size: clamp(2rem, 4vw, 3rem);
|
||||||
|
color: var(--text-primary);
|
||||||
|
line-height: 1.15;
|
||||||
|
}
|
||||||
|
|
||||||
|
.portfolio-subtitle {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
line-height: 1.6;
|
||||||
|
max-width: 450px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.portfolio-text .btn {
|
||||||
|
margin-top: var(--spacing-sm);
|
||||||
|
align-self: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Columna Derecha: Carrusel */
|
||||||
|
.portfolio-carousel {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel-container {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
aspect-ratio: 16 / 10;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 16px;
|
||||||
|
box-shadow: var(--shadow);
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel-slide {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
opacity: 0;
|
||||||
|
transition: opacity 0.8s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel-slide.active {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.carousel-image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Indicadores del carrusel */
|
||||||
|
.carousel-indicators {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 0.5rem;
|
||||||
|
margin-top: var(--spacing-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator {
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: var(--border);
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator.active {
|
||||||
|
background-color: var(--btn-primary-bg);
|
||||||
|
transform: scale(1.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.indicator:hover {
|
||||||
|
background-color: var(--btn-primary-hover);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ============================================
|
||||||
|
TIRA MARQUEE (ICONOS INFINITOS CON FADE)
|
||||||
|
============================================ */
|
||||||
|
.marquee-section {
|
||||||
|
margin-top: var(--spacing-lg);
|
||||||
|
overflow: hidden;
|
||||||
|
padding: var(--spacing-md) 0;
|
||||||
|
border-top: 1px solid var(--border);
|
||||||
|
border-bottom: 1px solid var(--border);
|
||||||
|
|
||||||
|
/* Efecto fade en los bordes izquierdo y derecho */
|
||||||
|
-webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
|
||||||
|
mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.marquee-track {
|
||||||
|
display: flex;
|
||||||
|
gap: var(--spacing-md);
|
||||||
|
/* Animación continua y lineal */
|
||||||
|
animation: marquee-scroll 35s linear infinite;
|
||||||
|
will-change: transform;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Animación de desplazamiento infinito */
|
||||||
|
@keyframes marquee-scroll {
|
||||||
|
0% {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
/* Se mueve exactamente el 50% porque el contenido está duplicado */
|
||||||
|
transform: translateX(-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.marquee-item {
|
||||||
|
flex-shrink: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.marquee-icon {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
display: block;
|
||||||
|
background-color: currentColor;
|
||||||
|
-webkit-mask-repeat: no-repeat;
|
||||||
|
mask-repeat: no-repeat;
|
||||||
|
-webkit-mask-position: center;
|
||||||
|
mask-position: center;
|
||||||
|
-webkit-mask-size: contain;
|
||||||
|
mask-size: contain;
|
||||||
|
/* Estado base: neutro y sin interactividad */
|
||||||
|
filter: grayscale(100%) opacity(0.5);
|
||||||
|
color: var(--text-muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Iconos específicos (mantener los que ya tenías) */
|
||||||
|
.icon-google { -webkit-mask-image: url("../assets/iconos/google.svg"); mask-image: url("../assets/iconos/google.svg"); }
|
||||||
|
.icon-meta { -webkit-mask-image: url("../assets/iconos/meta.svg"); mask-image: url("../assets/iconos/meta.svg"); }
|
||||||
|
.icon-hubspot { -webkit-mask-image: url("../assets/iconos/hubspot.svg"); mask-image: url("../assets/iconos/hubspot.svg"); }
|
||||||
|
.icon-shopify { -webkit-mask-image: url("../assets/iconos/shopify.svg"); mask-image: url("../assets/iconos/shopify.svg"); }
|
||||||
|
.icon-wordpress { -webkit-mask-image: url("../assets/iconos/wordpress.svg"); mask-image: url("../assets/iconos/wordpress.svg"); }
|
||||||
|
.icon-figma { -webkit-mask-image: url("../assets/iconos/figma.svg"); mask-image: url("../assets/iconos/figma.svg"); }
|
||||||
|
.icon-adobe { -webkit-mask-image: url("../assets/iconos/adobe.svg"); mask-image: url("../assets/iconos/adobe.svg"); }
|
||||||
|
.icon-mailchimp { -webkit-mask-image: url("../assets/iconos/mailchimp.svg"); mask-image: url("../assets/iconos/mailchimp.svg"); }
|
||||||
|
|
||||||
|
/* ============================================
|
||||||
|
RESPONSIVE MARQUEE
|
||||||
|
============================================ */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.marquee-item {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
.marquee-icon {
|
||||||
|
width: 45px;
|
||||||
|
height: 45px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 480px) {
|
||||||
|
.marquee-item {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
.marquee-icon {
|
||||||
|
width: 35px;
|
||||||
|
height: 35px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Respetar preferencia de movimiento reducido */
|
||||||
|
@media (prefers-reduced-motion: reduce) {
|
||||||
|
.marquee-track {
|
||||||
|
animation: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ============================================
|
||||||
|
SECCIÓN CTA FINAL
|
||||||
|
============================================ */
|
||||||
|
.cta-section {
|
||||||
|
padding: var(--spacing-lg) var(--spacing-md);
|
||||||
|
background-color: var(--bg-base);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tarjeta contenedora con fondo teal */
|
||||||
|
.cta-card {
|
||||||
|
max-width: 900px;
|
||||||
|
margin: 0 auto;
|
||||||
|
background-color: var(--brand-teal);
|
||||||
|
border-radius: 24px;
|
||||||
|
padding: var(--spacing-lg) var(--spacing-md);
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 20px 60px -10px rgba(0, 63, 82, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Efecto de brillo sutil (glow) en las esquinas */
|
||||||
|
.cta-card::before,
|
||||||
|
.cta-card::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
width: 300px;
|
||||||
|
height: 300px;
|
||||||
|
border-radius: 50%;
|
||||||
|
filter: blur(80px);
|
||||||
|
opacity: 0.35;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta-card::before {
|
||||||
|
top: -100px;
|
||||||
|
left: -100px;
|
||||||
|
background: radial-gradient(circle, var(--brand-crimson) 0%, transparent 70%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta-card::after {
|
||||||
|
bottom: -100px;
|
||||||
|
right: -100px;
|
||||||
|
background: radial-gradient(circle, var(--brand-rose-muted) 0%, transparent 70%);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Contenido de la tarjeta */
|
||||||
|
.cta-title {
|
||||||
|
font-family: var(--font-title);
|
||||||
|
font-style: italic;
|
||||||
|
font-size: clamp(2rem, 4vw, 3rem);
|
||||||
|
color: #ffffff;
|
||||||
|
margin-bottom: var(--spacing-sm);
|
||||||
|
line-height: 1.15;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta-subtitle {
|
||||||
|
font-family: var(--font-body);
|
||||||
|
font-size: clamp(1rem, 2vw, 1.15rem);
|
||||||
|
color: rgba(255, 255, 255, 0.85);
|
||||||
|
max-width: 600px;
|
||||||
|
margin: 0 auto var(--spacing-md);
|
||||||
|
line-height: 1.6;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Botones */
|
||||||
|
.cta-buttons {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
gap: var(--spacing-sm);
|
||||||
|
flex-wrap: wrap;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Botón primario invertido (claro sobre teal) */
|
||||||
|
.btn-cta-primary {
|
||||||
|
background-color: #ffffff;
|
||||||
|
color: var(--brand-teal);
|
||||||
|
border: 1.5px solid #ffffff;
|
||||||
|
padding: 0.85rem 2rem;
|
||||||
|
border-radius: 999px;
|
||||||
|
font-family: var(--font-small);
|
||||||
|
font-size: 0.95rem;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
box-shadow: 0 4px 14px -3px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-cta-primary:hover {
|
||||||
|
background-color: var(--brand-crimson);
|
||||||
|
color: #ffffff;
|
||||||
|
border-color: var(--brand-crimson);
|
||||||
|
transform: translateY(-2px);
|
||||||
|
box-shadow: 0 6px 20px -3px rgba(186, 18, 77, 0.45);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Botón secundario outline (blanco sobre teal) */
|
||||||
|
.btn-cta-secondary {
|
||||||
|
background-color: transparent;
|
||||||
|
color: #ffffff;
|
||||||
|
border: 1.5px solid rgba(255, 255, 255, 0.6);
|
||||||
|
padding: 0.85rem 2rem;
|
||||||
|
border-radius: 999px;
|
||||||
|
font-family: var(--font-small);
|
||||||
|
font-size: 0.95rem;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-cta-secondary:hover {
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
border-color: #ffffff;
|
||||||
|
transform: translateY(-2px);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ============================================
|
||||||
|
RESPONSIVE CTA FINAL
|
||||||
|
============================================ */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.cta-section {
|
||||||
|
padding: var(--spacing-md) var(--spacing-sm);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta-card {
|
||||||
|
padding: var(--spacing-md) var(--spacing-sm);
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cta-buttons {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-cta-primary,
|
||||||
|
.btn-cta-secondary {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 320px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 480px) {
|
||||||
|
.cta-card::before,
|
||||||
|
.cta-card::after {
|
||||||
|
width: 200px;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Respetar preferencia de movimiento reducido */
|
||||||
|
@media (prefers-reduced-motion: reduce) {
|
||||||
|
.btn-cta-primary,
|
||||||
|
.btn-cta-secondary {
|
||||||
|
transition: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
+1587
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user