{"id":1644,"date":"2025-10-12T16:09:23","date_gmt":"2025-10-12T16:09:23","guid":{"rendered":"https:\/\/henryhateshiking.com\/?page_id=1644"},"modified":"2026-07-03T01:30:28","modified_gmt":"2026-07-03T01:30:28","slug":"trails","status":"publish","type":"page","link":"https:\/\/henryhateshiking.com\/es\/trails\/","title":{"rendered":"Rutas"},"content":{"rendered":"\n<style>\n  .hhht-hero {\n    --green-dark: #123d30;\n    --green: #1f6658;\n    --teal: #4fb7c5;\n    --orange: #ee6f2d;\n    position: relative;\n    min-height: 72svh;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    color: #fff;\n    background: linear-gradient(180deg, #53b8c5 0%, #217368 58%, #123d30 100%);\n  }\n\n  .hhht-hero * {\n    box-sizing: border-box;\n  }\n\n  .hhht-bg {\n    position: absolute;\n    inset: 0;\n    z-index: 1;\n    pointer-events: none;\n  }\n\n  .hhht-bg svg {\n    width: 100%;\n    height: 100%;\n    display: block;\n  }\n\n  .hhht-sky-glow {\n    animation: hhhtGlow 8s ease-in-out infinite;\n    transform-origin: center;\n  }\n\n  .hhht-cloud-1 {\n    animation: hhhtCloudMove 36s linear infinite;\n  }\n\n  .hhht-cloud-2 {\n    animation: hhhtCloudMove 48s linear infinite;\n    animation-delay: -18s;\n  }\n\n  .hhht-mountain-back {\n    animation: hhhtMountainBack 10s ease-in-out infinite;\n    transform-origin: center bottom;\n  }\n\n  .hhht-mountain-mid {\n    animation: hhhtMountainMid 8s ease-in-out infinite;\n    transform-origin: center bottom;\n  }\n\n  .hhht-mountain-front {\n    animation: hhhtMountainFront 7s ease-in-out infinite;\n    transform-origin: center bottom;\n  }\n\n  .hhht-highlight {\n    animation: hhhtHighlight 5.5s ease-in-out infinite;\n  }\n\n  .hhht-overlay {\n    position: absolute;\n    inset: 0;\n    z-index: 2;\n    background:\n      linear-gradient(\n        180deg,\n        rgba(18, 61, 48, .25) 0%,\n        rgba(18, 61, 48, .42) 42%,\n        rgba(18, 61, 48, .74) 100%\n      );\n    pointer-events: none;\n  }\n\n  .hhht-wrap {\n    position: relative;\n    z-index: 3;\n    width: min(1180px, calc(100% - 36px));\n    margin: 0 auto;\n    padding: 96px 0 78px;\n    text-align: left;\n  }\n\n  .hhht-content {\n    max-width: 1080px;\n  }\n\n  .hhht-kicker {\n    display: block;\n    margin-bottom: 18px;\n    color: rgba(255,255,255,.72);\n    font-size: 13px;\n    font-weight: 900;\n    letter-spacing: .12em;\n    text-transform: uppercase;\n  }\n\n  .hhht-title {\n    margin: 0;\n    color: #fff;\n    font-size: clamp(48px, 6vw, 86px);\n    line-height: .92;\n    letter-spacing: -3px;\n    text-shadow: 0 12px 42px rgba(0,0,0,.24);\n  }\n\n  .hhht-subtitle {\n    max-width: 1120px;\n    margin: 34px 0 0;\n    color: rgba(255,255,255,.88);\n    font-size: clamp(18px, 1.7vw, 24px);\n    line-height: 1.55;\n    text-shadow: 0 8px 32px rgba(0,0,0,.22);\n  }\n\n  .hhh-hero-presented-by {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 18px;\n    margin-top: 72px;\n  }\n\n  .hhh-hero-presented-by__label {\n    color: rgba(255,255,255,.86);\n    font-size: 13px;\n    font-weight: 950;\n    letter-spacing: .14em;\n    text-transform: uppercase;\n  }\n\n  .hhh-hero-presented-by__logo {\n    width: 84px;\n    height: 84px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 999px;\n    background: rgba(255,255,255,.96);\n    box-shadow: 0 16px 38px rgba(0,0,0,.20);\n    transition: transform .18s ease, box-shadow .18s ease;\n  }\n\n  .hhh-hero-presented-by__logo:hover {\n    transform: translateY(-3px) scale(1.03);\n    box-shadow: 0 22px 48px rgba(0,0,0,.26);\n  }\n\n  .hhh-hero-presented-by__logo img {\n    max-width: 68px;\n    max-height: 68px;\n    width: auto;\n    height: auto;\n    display: block;\n  }\n\n  @keyframes hhhtCloudMove {\n    from {\n      transform: translateX(-240px);\n    }\n\n    to {\n      transform: translateX(1260px);\n    }\n  }\n\n  @keyframes hhhtGlow {\n    0%, 100% {\n      opacity: .34;\n      transform: scale(1);\n    }\n\n    50% {\n      opacity: .54;\n      transform: scale(1.08);\n    }\n  }\n\n  @keyframes hhhtMountainBack {\n    0%, 100% {\n      transform: translateY(0) scale(1);\n    }\n\n    50% {\n      transform: translateY(6px) scale(1.008);\n    }\n  }\n\n  @keyframes hhhtMountainMid {\n    0%, 100% {\n      transform: translateY(0) scale(1);\n    }\n\n    50% {\n      transform: translateY(4px) scale(1.006);\n    }\n  }\n\n  @keyframes hhhtMountainFront {\n    0%, 100% {\n      transform: translateY(0) scale(1);\n    }\n\n    50% {\n      transform: translateY(3px) scale(1.004);\n    }\n  }\n\n  @keyframes hhhtHighlight {\n    0%, 100% {\n      opacity: .22;\n    }\n\n    50% {\n      opacity: .42;\n    }\n  }\n\n  @media (max-width: 760px) {\n    .hhht-hero {\n      min-height: 88svh;\n    }\n\n    .hhht-wrap {\n      width: min(100% - 28px, 1180px);\n      padding: 82px 0 58px;\n      text-align: center;\n    }\n\n    .hhht-kicker {\n      font-size: 12px;\n      margin-bottom: 16px;\n    }\n\n    .hhht-title {\n      font-size: clamp(44px, 13vw, 66px);\n      letter-spacing: -2px;\n    }\n\n    .hhht-subtitle {\n      margin-top: 24px;\n      font-size: 18px;\n      line-height: 1.5;\n    }\n\n    .hhh-hero-presented-by {\n      margin-top: 44px;\n      flex-direction: column;\n      gap: 12px;\n    }\n\n    .hhh-hero-presented-by__logo {\n      width: 76px;\n      height: 76px;\n    }\n\n    .hhh-hero-presented-by__logo img {\n      max-width: 60px;\n      max-height: 60px;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .hhht-sky-glow,\n    .hhht-cloud-1,\n    .hhht-cloud-2,\n    .hhht-mountain-back,\n    .hhht-mountain-mid,\n    .hhht-mountain-front,\n    .hhht-highlight {\n      animation: none !important;\n    }\n  }\n<\/style>\n\n<section class=\"hhht-hero\" aria-label=\"Hiking routes in Monterrey\">\n  <div class=\"hhht-bg\" aria-hidden=\"true\">\n    <svg viewBox=\"0 0 1440 760\" preserveAspectRatio=\"xMidYMid slice\" role=\"img\">\n      <defs>\n        <linearGradient id=\"hhhtSky\" x1=\"0\" x2=\"0\" y1=\"0\" y2=\"1\">\n          <stop offset=\"0%\" stop-color=\"#58beca\"\/>\n          <stop offset=\"48%\" stop-color=\"#24796f\"\/>\n          <stop offset=\"100%\" stop-color=\"#123d30\"\/>\n        <\/linearGradient>\n\n        <radialGradient id=\"hhhtGlow\" cx=\"50%\" cy=\"20%\" r=\"60%\">\n          <stop offset=\"0%\" stop-color=\"#ffffff\" stop-opacity=\".42\"\/>\n          <stop offset=\"55%\" stop-color=\"#ffffff\" stop-opacity=\".08\"\/>\n          <stop offset=\"100%\" stop-color=\"#ffffff\" stop-opacity=\"0\"\/>\n        <\/radialGradient>\n\n        <linearGradient id=\"hhhtBackMountain\" x1=\"0\" x2=\"0\" y1=\"0\" y2=\"1\">\n          <stop offset=\"0%\" stop-color=\"#2d8c7f\"\/>\n          <stop offset=\"100%\" stop-color=\"#155144\"\/>\n        <\/linearGradient>\n\n        <linearGradient id=\"hhhtMidMountain\" x1=\"0\" x2=\"0\" y1=\"0\" y2=\"1\">\n          <stop offset=\"0%\" stop-color=\"#1d6d5f\"\/>\n          <stop offset=\"100%\" stop-color=\"#103d31\"\/>\n        <\/linearGradient>\n\n        <linearGradient id=\"hhhtFrontMountain\" x1=\"0\" x2=\"0\" y1=\"0\" y2=\"1\">\n          <stop offset=\"0%\" stop-color=\"#195a4a\"\/>\n          <stop offset=\"100%\" stop-color=\"#0d2e25\"\/>\n        <\/linearGradient>\n      <\/defs>\n\n      <rect width=\"1440\" height=\"760\" fill=\"url(#hhhtSky)\"\/>\n\n      <circle class=\"hhht-sky-glow\" cx=\"1060\" cy=\"110\" r=\"250\" fill=\"url(#hhhtGlow)\"\/>\n\n      <g class=\"hhht-cloud-1\" opacity=\".42\">\n        <path d=\"M70 130 C110 95, 160 100, 190 130 C220 112, 270 120, 298 148 C335 148, 370 160, 392 185 L36 185 C42 158, 50 145, 70 130Z\" fill=\"rgba(255,255,255,.34)\"\/>\n      <\/g>\n\n      <g class=\"hhht-cloud-2\" opacity=\".26\">\n        <path d=\"M180 220 C220 184, 270 194, 305 224 C344 202, 398 214, 428 252 C466 250, 504 266, 528 294 L140 294 C146 260, 158 238, 180 220Z\" fill=\"rgba(255,255,255,.32)\"\/>\n      <\/g>\n\n      <!-- Back mountain range -->\n      <g class=\"hhht-mountain-back\" opacity=\".65\">\n        <path d=\"M-80 720 L-80 370 C50 315, 150 405, 255 360 C365 312, 450 388, 540 300 C635 208, 720 405, 820 316 C920 226, 1015 374, 1115 305 C1210 240, 1290 380, 1520 324 L1520 720 Z\" fill=\"url(#hhhtBackMountain)\"\/>\n      <\/g>\n\n      <!-- Cerro de la Silla-inspired middle silhouette -->\n      <g class=\"hhht-mountain-mid\" opacity=\".9\">\n        <path d=\"M-80 760 L-80 458 C70 418, 150 474, 250 430 C346 388, 410 455, 500 398 C585 344, 628 238, 704 202 C764 174, 842 248, 894 326 C930 380, 982 390, 1038 330 C1096 268, 1175 284, 1235 350 C1308 430, 1375 480, 1520 438 L1520 760 Z\" fill=\"url(#hhhtMidMountain)\"\/>\n\n        <!-- saddle highlights -->\n        <path class=\"hhht-highlight\" d=\"M670 250 C704 224, 736 220, 768 244 C738 268, 708 292, 690 334 C682 300, 674 274, 670 250Z\" fill=\"rgba(255,255,255,.22)\"\/>\n        <path class=\"hhht-highlight\" d=\"M1054 338 C1088 300, 1126 296, 1162 326 C1124 342, 1094 374, 1075 420 C1066 388, 1058 360, 1054 338Z\" fill=\"rgba(255,255,255,.18)\"\/>\n      <\/g>\n\n      <!-- Front mountain\/foothills -->\n      <g class=\"hhht-mountain-front\" opacity=\".95\">\n        <path d=\"M-80 760 L-80 600 C20 548, 110 612, 215 560 C310 514, 380 604, 480 548 C600 480, 680 612, 805 542 C930 470, 1010 630, 1140 560 C1280 486, 1360 618, 1520 552 L1520 760 Z\" fill=\"url(#hhhtFrontMountain)\"\/>\n        <path d=\"M140 638 C220 604, 285 616, 360 584 C430 554, 485 600, 540 574\" fill=\"none\" stroke=\"rgba(116,211,166,.22)\" stroke-width=\"24\" stroke-linecap=\"round\"\/>\n        <path d=\"M790 610 C860 576, 940 594, 1015 558\" fill=\"none\" stroke=\"rgba(116,211,166,.16)\" stroke-width=\"22\" stroke-linecap=\"round\"\/>\n      <\/g>\n    <\/svg>\n  <\/div>\n\n  <div class=\"hhht-overlay\" aria-hidden=\"true\"><\/div>\n\n  <div class=\"hhht-wrap\">\n    <div class=\"hhht-content\">\n      <span class=\"hhht-kicker\">Trail guides<\/span>\n\n      <h1 class=\"hhht-title\">Hiking routes in Monterrey<\/h1>\n\n      <p class=\"hhht-subtitle\">\n        Find complete hiking guides for trails such as Cerro de la Silla, Pico Norte, Pico Sur,\n        Chipinque, La Huasteca, Cerro de las Mitras and waterfalls near Monterrey.\n      <\/p>\n\n      <!-- Presented by (Hero) -->\n      <div class=\"hhh-hero-presented-by\" aria-label=\"Presented by sponsor\">\n        <span class=\"hhh-hero-presented-by__label\">Presented by<\/span>\n\n        <a class=\"hhh-hero-presented-by__logo\" href=\"https:\/\/berrynuts.mx\/\" target=\"_blank\" rel=\"noopener noreferrer\">\n          <img decoding=\"async\" src=\"https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/02\/unnamed-2.webp\" alt=\"Berry Nuts\" title=\"Sillalogia\">\n        <\/a>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n\n\n<div style=\"height:23px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<!-- HHH TRAILS SEARCH + FILTERS -->\n<div class=\"hhh-trails-filter-card\" id=\"hhhTrailsFilters\">\n  <div class=\"hhh-trails-filter-inner\">\n\n    <div class=\"hhh-trails-filter-heading\">\n      <span class=\"hhh-trails-filter-kicker\" data-en=\"Trail finder\" data-es=\"Buscador de rutas\">\n        Trail finder\n      <\/span>\n\n      <h2 class=\"hhh-trails-filter-title\" data-en=\"Find your hike\" data-es=\"Encuentra tu ruta\">\n        Find your hike\n      <\/h2>\n\n      <p class=\"hhh-trails-filter-subtitle\"\n         data-en=\"Search by trail name, location, distance, elevation, time, or difficulty.\"\n         data-es=\"Busca por nombre de ruta, ubicaci\u00f3n, distancia, desnivel, tiempo o dificultad.\">\n        Search by trail name, location, distance, elevation, time, or difficulty.\n      <\/p>\n    <\/div>\n\n    <div class=\"hhh-trails-search-row\">\n      <div class=\"hhh-trails-search-input-wrap\">\n        <span class=\"hhh-trails-search-icon\" aria-hidden=\"true\">\n          <svg viewBox=\"0 0 24 24\">\n            <circle cx=\"11\" cy=\"11\" r=\"7\" stroke-width=\"2\" fill=\"none\" stroke=\"currentColor\"><\/circle>\n            <line x1=\"16\" y1=\"16\" x2=\"21\" y2=\"21\" stroke-width=\"2\" stroke=\"currentColor\"><\/line>\n          <\/svg>\n        <\/span>\n\n        <input\n          id=\"hhh-search-text\"\n          type=\"text\"\n          placeholder=\"Search by trail or location\u2026\"\n          data-placeholder-en=\"Search by trail or location\u2026\"\n          data-placeholder-es=\"Buscar por ruta o ubicaci\u00f3n\u2026\"\n        >\n      <\/div>\n\n      <button id=\"hhh-search-button\" class=\"hhh-trails-search-button\" type=\"button\" data-en=\"Search\" data-es=\"Buscar\">\n        Search\n      <\/button>\n    <\/div>\n\n    <div class=\"hhh-trails-filter-row\">\n\n      <div class=\"hhh-trails-filter-field\">\n        <label for=\"hhh-filter-distance\" data-en=\"Distance\" data-es=\"Distancia\">Distance<\/label>\n        <div class=\"hhh-trails-select-wrap\">\n          <select id=\"hhh-filter-distance\">\n            <option value=\"\" data-en=\"Any\" data-es=\"Cualquiera\">Any<\/option>\n            <option value=\"0-4\">0\u20134 km<\/option>\n            <option value=\"4-8\">4\u20138 km<\/option>\n            <option value=\"8-12\">8\u201312 km<\/option>\n            <option value=\"12+\">12+ km<\/option>\n          <\/select>\n        <\/div>\n      <\/div>\n\n      <div class=\"hhh-trails-filter-field\">\n        <label for=\"hhh-filter-elevation\" data-en=\"Elevation\" data-es=\"Desnivel\">Elevation<\/label>\n        <div class=\"hhh-trails-select-wrap\">\n          <select id=\"hhh-filter-elevation\">\n            <option value=\"\" data-en=\"Any\" data-es=\"Cualquiera\">Any<\/option>\n            <option value=\"0-400\">0\u2013400 m<\/option>\n            <option value=\"400-800\">400\u2013800 m<\/option>\n            <option value=\"800-1200\">800\u20131200 m<\/option>\n            <option value=\"1200+\">1200+ m<\/option>\n          <\/select>\n        <\/div>\n      <\/div>\n\n      <div class=\"hhh-trails-filter-field\">\n        <label for=\"hhh-filter-time\" data-en=\"Time\" data-es=\"Tiempo\">Time<\/label>\n        <div class=\"hhh-trails-select-wrap\">\n          <select id=\"hhh-filter-time\">\n            <option value=\"\" data-en=\"Any\" data-es=\"Cualquiera\">Any<\/option>\n            <option value=\"0-2\">0\u20132 h<\/option>\n            <option value=\"2-4\">2\u20134 h<\/option>\n            <option value=\"4-6\">4\u20136 h<\/option>\n            <option value=\"6+\">6+ h<\/option>\n          <\/select>\n        <\/div>\n      <\/div>\n\n      <div class=\"hhh-trails-filter-field\">\n        <label for=\"hhh-filter-difficulty\" data-en=\"Difficulty\" data-es=\"Dificultad\">Difficulty<\/label>\n        <div class=\"hhh-trails-select-wrap\">\n          <select id=\"hhh-filter-difficulty\">\n            <option value=\"\" data-en=\"Any\" data-es=\"Cualquiera\">Any<\/option>\n            <option value=\"easy\" data-en=\"Easy\" data-es=\"F\u00e1cil\">Easy<\/option>\n            <option value=\"moderate\" data-en=\"Moderate\" data-es=\"Moderada\">Moderate<\/option>\n            <option value=\"medium\" data-en=\"Medium\" data-es=\"Media\">Medium<\/option>\n            <option value=\"hard\" data-en=\"Hard\" data-es=\"Dif\u00edcil\">Hard<\/option>\n            <option value=\"difficult\" data-en=\"Difficult\" data-es=\"Muy dif\u00edcil\">Difficult<\/option>\n          <\/select>\n        <\/div>\n      <\/div>\n\n      <div class=\"hhh-trails-filter-field\">\n        <label for=\"hhh-filter-sort\" data-en=\"Sort\" data-es=\"Ordenar\">Sort<\/label>\n        <div class=\"hhh-trails-select-wrap\">\n          <select id=\"hhh-filter-sort\">\n            <option value=\"\" data-en=\"None\" data-es=\"Ninguno\">None<\/option>\n            <option value=\"name-asc\" data-en=\"Name \u2191\" data-es=\"Nombre \u2191\">Name \u2191<\/option>\n            <option value=\"name-desc\" data-en=\"Name \u2193\" data-es=\"Nombre \u2193\">Name \u2193<\/option>\n            <option value=\"distance-asc\" data-en=\"Distance \u2191\" data-es=\"Distancia \u2191\">Distance \u2191<\/option>\n            <option value=\"distance-desc\" data-en=\"Distance \u2193\" data-es=\"Distancia \u2193\">Distance \u2193<\/option>\n            <option value=\"time-asc\" data-en=\"Time \u2191\" data-es=\"Tiempo \u2191\">Time \u2191<\/option>\n            <option value=\"time-desc\" data-en=\"Time \u2193\" data-es=\"Tiempo \u2193\">Time \u2193<\/option>\n            <option value=\"elev-asc\" data-en=\"Elevation \u2191\" data-es=\"Desnivel \u2191\">Elevation \u2191<\/option>\n            <option value=\"elev-desc\" data-en=\"Elevation \u2193\" data-es=\"Desnivel \u2193\">Elevation \u2193<\/option>\n          <\/select>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/div>\n\n<style>\n  .hhh-trails-filter-card,\n  .hhh-trails-filter-card * {\n    box-sizing: border-box;\n  }\n\n  .hhh-trails-filter-card {\n    --hhh-text: #16231d;\n    --hhh-muted: #625f56;\n    --hhh-green: #173d30;\n    --hhh-green-dark: #0f3127;\n    --hhh-mint: #7ff0d2;\n    --hhh-orange: #ee6f2d;\n    --hhh-orange-dark: #c9551f;\n\n    width: min(1120px, calc(100% - 32px));\n    margin: 0 auto 34px;\n    border-radius: 30px;\n    background:\n      radial-gradient(circle at top right, rgba(127,240,210,.18), transparent 36%),\n      radial-gradient(circle at bottom left, rgba(238,111,45,.14), transparent 34%),\n      linear-gradient(135deg, var(--hhh-green), var(--hhh-green-dark));\n    color: #fff;\n    box-shadow: 0 22px 58px rgba(22,35,29,.18);\n    overflow: visible;\n  }\n\n  .hhh-trails-filter-inner {\n    padding: clamp(24px, 3.2vw, 38px);\n    border-radius: 30px;\n    background:\n      linear-gradient(135deg, rgba(255,255,255,.07), transparent 35%),\n      repeating-linear-gradient(\n        135deg,\n        rgba(255,255,255,.045) 0,\n        rgba(255,255,255,.045) 1px,\n        transparent 1px,\n        transparent 14px\n      );\n  }\n\n  .hhh-trails-filter-heading {\n    margin-bottom: 24px;\n  }\n\n  .hhh-trails-filter-kicker {\n    display: block;\n    margin-bottom: 10px;\n    color: var(--hhh-mint);\n    font-size: 13px;\n    font-weight: 950;\n    letter-spacing: .15em;\n    text-transform: uppercase;\n    line-height: 1;\n  }\n\n  .hhh-trails-filter-title {\n    margin: 0;\n    color: #fff;\n    font-size: clamp(38px, 4.8vw, 62px);\n    line-height: .95;\n    letter-spacing: -2px;\n    font-weight: 950;\n  }\n\n  .hhh-trails-filter-subtitle {\n    max-width: 820px;\n    margin: 16px 0 0;\n    color: rgba(255,255,255,.76);\n    font-size: clamp(16px, 1.55vw, 20px);\n    line-height: 1.45;\n    font-weight: 700;\n  }\n\n  .hhh-trails-search-row {\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) auto;\n    gap: 14px;\n    align-items: stretch;\n    margin-bottom: 22px;\n  }\n\n  .hhh-trails-search-input-wrap {\n    min-height: 58px;\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    border-radius: 999px;\n    background: #fff;\n    padding: 0 18px;\n    box-shadow: 0 14px 34px rgba(0,0,0,.14);\n  }\n\n  .hhh-trails-search-icon {\n    width: 22px;\n    height: 22px;\n    color: var(--hhh-orange);\n    flex: 0 0 22px;\n  }\n\n  .hhh-trails-search-icon svg {\n    width: 22px;\n    height: 22px;\n    display: block;\n  }\n\n  .hhh-trails-filter-card #hhh-search-text {\n    width: 100% !important;\n    min-width: 0 !important;\n    height: auto !important;\n    min-height: 0 !important;\n    border: 0 !important;\n    outline: 0 !important;\n    background: transparent !important;\n    color: var(--hhh-text) !important;\n    padding: 0 !important;\n    margin: 0 !important;\n    box-shadow: none !important;\n    font-family: inherit !important;\n    font-size: 16px !important;\n    font-weight: 800 !important;\n    line-height: 1.2 !important;\n  }\n\n  .hhh-trails-filter-card #hhh-search-text::placeholder {\n    color: rgba(22,35,29,.46);\n    opacity: 1;\n  }\n\n  .hhh-trails-filter-card #hhh-search-button {\n    min-height: 58px !important;\n    border: 0 !important;\n    border-radius: 999px !important;\n    background: var(--hhh-orange) !important;\n    color: #fff !important;\n    padding: 0 28px !important;\n    font-family: inherit !important;\n    font-size: 15px !important;\n    font-weight: 950 !important;\n    letter-spacing: .04em !important;\n    text-transform: uppercase !important;\n    cursor: pointer !important;\n    box-shadow: 0 16px 34px rgba(238,111,45,.26) !important;\n  }\n\n  .hhh-trails-filter-card #hhh-search-button:hover {\n    background: var(--hhh-orange-dark) !important;\n  }\n\n  .hhh-trails-filter-row {\n    display: grid;\n    grid-template-columns: repeat(5, minmax(0, 1fr));\n    gap: 14px;\n    align-items: end;\n  }\n\n  .hhh-trails-filter-field {\n    min-width: 0;\n  }\n\n  .hhh-trails-filter-field label {\n    display: block;\n    margin: 0 0 8px;\n    color: rgba(255,255,255,.66);\n    font-size: 11px;\n    font-weight: 950;\n    letter-spacing: .14em;\n    text-transform: uppercase;\n    line-height: 1;\n  }\n\n  .hhh-trails-select-wrap {\n    position: relative;\n    width: 100%;\n    height: 50px;\n    overflow: visible;\n  }\n\n  .hhh-trails-filter-card select {\n    width: 100% !important;\n    height: 50px !important;\n    min-height: 50px !important;\n    max-height: 50px !important;\n    display: block !important;\n\n    -webkit-appearance: none !important;\n    appearance: none !important;\n\n    border: 1px solid rgba(22,35,29,.14) !important;\n    border-radius: 999px !important;\n    background: #ffffff !important;\n    color: var(--hhh-text) !important;\n\n    padding: 0 42px 0 16px !important;\n    margin: 0 !important;\n\n    font-family: inherit !important;\n    font-size: 15px !important;\n    font-weight: 900 !important;\n    line-height: 1.2 !important;\n\n    box-shadow: 0 10px 24px rgba(0,0,0,.12) !important;\n    outline: none !important;\n    cursor: pointer !important;\n    text-overflow: ellipsis !important;\n  }\n\n  .hhh-trails-filter-card select:hover,\n  .hhh-trails-filter-card select:focus {\n    border-color: rgba(238,111,45,.74) !important;\n    box-shadow: 0 0 0 3px rgba(238,111,45,.14), 0 12px 26px rgba(0,0,0,.13) !important;\n  }\n\n  .hhh-trails-filter-card select option {\n    color: var(--hhh-text) !important;\n    background: #fff !important;\n    font-weight: 700 !important;\n  }\n\n  .hhh-trails-select-wrap::after {\n    content: \"\";\n    position: absolute;\n    right: 17px;\n    top: 50%;\n    width: 8px;\n    height: 8px;\n    border-right: 2px solid var(--hhh-mint);\n    border-bottom: 2px solid var(--hhh-mint);\n    transform: translateY(-65%) rotate(45deg);\n    pointer-events: none;\n  }\n\n  @media (max-width: 980px) {\n    .hhh-trails-filter-row {\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n    }\n  }\n\n  @media (max-width: 720px) {\n    .hhh-trails-filter-card {\n      width: min(100% - 24px, 1120px);\n      border-radius: 26px;\n      margin-bottom: 26px;\n    }\n\n    .hhh-trails-filter-inner {\n      padding: 22px;\n      border-radius: 26px;\n    }\n\n    .hhh-trails-search-row {\n      grid-template-columns: 1fr;\n      gap: 10px;\n    }\n\n    .hhh-trails-filter-card #hhh-search-button {\n      width: 100% !important;\n    }\n\n    .hhh-trails-filter-row {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      gap: 12px;\n    }\n  }\n\n  @media (max-width: 460px) {\n    .hhh-trails-filter-row {\n      grid-template-columns: 1fr;\n    }\n\n    .hhh-trails-filter-title {\n      font-size: 38px;\n    }\n  }\n\n\/* ==========================================\n   MOBILE COMPACT FIX FOR TRAILS FILTER\n   Add this at the very bottom of the style block\n========================================== *\/\n\n@media (max-width: 720px) {\n  #hhhTrailsFilters {\n    width: calc(100% - 24px) !important;\n    margin: 0 auto 24px !important;\n    border-radius: 24px !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-filter-inner {\n    padding: 26px 18px 22px !important;\n    border-radius: 24px !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-filter-heading {\n    margin-bottom: 20px !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-filter-kicker {\n    font-size: 11px !important;\n    letter-spacing: .16em !important;\n    margin-bottom: 10px !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-filter-title {\n    font-size: 43px !important;\n    line-height: .94 !important;\n    letter-spacing: -1.8px !important;\n    max-width: 310px !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-filter-subtitle {\n    margin-top: 16px !important;\n    font-size: 17px !important;\n    line-height: 1.45 !important;\n    max-width: 310px !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-search-row {\n    display: grid !important;\n    grid-template-columns: 1fr !important;\n    gap: 10px !important;\n    margin-bottom: 20px !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-search-input-wrap {\n    min-height: 54px !important;\n    height: 54px !important;\n    padding: 0 16px !important;\n    gap: 10px !important;\n    border-radius: 999px !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-search-icon,\n  #hhhTrailsFilters .hhh-trails-search-icon svg {\n    width: 20px !important;\n    height: 20px !important;\n    flex: 0 0 20px !important;\n  }\n\n  #hhhTrailsFilters #hhh-search-text {\n    font-size: 15px !important;\n    font-weight: 800 !important;\n  }\n\n  #hhhTrailsFilters #hhh-search-button {\n    min-height: 54px !important;\n    height: 54px !important;\n    width: 100% !important;\n    font-size: 14px !important;\n    border-radius: 999px !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-filter-row {\n    display: grid !important;\n    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;\n    gap: 12px !important;\n    align-items: end !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-filter-field {\n    min-width: 0 !important;\n    width: 100% !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-filter-field label {\n    font-size: 10px !important;\n    letter-spacing: .13em !important;\n    margin: 0 0 7px !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-select-wrap {\n    height: 48px !important;\n    width: 100% !important;\n  }\n\n  #hhhTrailsFilters select {\n    height: 48px !important;\n    min-height: 48px !important;\n    max-height: 48px !important;\n    width: 100% !important;\n    font-size: 14px !important;\n    font-weight: 900 !important;\n    padding: 0 34px 0 14px !important;\n    border-radius: 999px !important;\n    line-height: 1.1 !important;\n  }\n\n  #hhhTrailsFilters .hhh-trails-select-wrap::after {\n    right: 15px !important;\n    width: 7px !important;\n    height: 7px !important;\n  }\n}\n\n\/* Only go one-column on very tiny phones *\/\n@media (max-width: 350px) {\n  #hhhTrailsFilters .hhh-trails-filter-row {\n    grid-template-columns: 1fr !important;\n  }\n}\n<\/style>\n\n<script>\n  document.addEventListener('DOMContentLoaded', function () {\n    const root = document.getElementById('hhhTrailsFilters');\n    if (!root) return;\n\n    const path = window.location.pathname || '';\n    const isSpanish = path === '\/es' || path.indexOf('\/es\/') === 0;\n    const lang = isSpanish ? 'es' : 'en';\n\n    root.querySelectorAll('[data-en][data-es]').forEach(function (el) {\n      const value = el.getAttribute('data-' + lang);\n      if (value) el.textContent = value;\n    });\n\n    root.querySelectorAll('[data-placeholder-en][data-placeholder-es]').forEach(function (el) {\n      const value = el.getAttribute('data-placeholder-' + lang);\n      if (value) el.setAttribute('placeholder', value);\n    });\n  });\n<\/script>\n\n\n\n\t<div class=\"hhh-submit-trail-widget\">\n\n\t\t\n\t\t\n\t\t<button type=\"button\" class=\"hhh-submit-open-btn\" id=\"hhhOpenTrailSubmit\">\n\t\t\tSube tu propia ruta\n\t\t<\/button>\n\n\t\t<div class=\"hhh-submit-modal\" id=\"hhhTrailSubmitModal\" aria-hidden=\"true\">\n\t\t\t<div class=\"hhh-submit-modal-backdrop\" id=\"hhhCloseTrailSubmitBackdrop\"><\/div>\n\n\t\t\t<div class=\"hhh-submit-modal-card\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"hhhSubmitTrailTitle\">\n\n\t\t\t\t<button type=\"button\" class=\"hhh-submit-close\" id=\"hhhCloseTrailSubmit\" aria-label=\"Close trail submission form\">\n\t\t\t\t\t<span aria-hidden=\"true\">&times;<\/span>\n\t\t\t\t<\/button>\n\n\t\t\t\t<div class=\"hhh-submit-modal-header\">\n\t\t\t\t\t<p class=\"hhh-submit-eyebrow\">Rutas de la comunidad<\/p>\n\t\t\t\t\t<h2 id=\"hhhSubmitTrailTitle\">Sube tu propia ruta<\/h2>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tEnv\u00eda una ruta para revisi\u00f3n. Si se aprueba, podr\u00e1 aparecer en la p\u00e1gina de rutas de HHH.\n\t\t\t\t\t<\/p>\n\t\t\t\t<\/div>\n\n\t\t\t\t\n\t\t\t\t\t<div class=\"hhh-submit-login-box\">\n\t\t\t\t\t\t<h3>Necesitas una cuenta para subir una ruta.<\/h3>\n\t\t\t\t\t\t<p>Inicia sesi\u00f3n o crea una cuenta en la p\u00e1gina de cuenta de HHH. Despu\u00e9s de iniciar sesi\u00f3n, regresa aqu\u00ed y abre este formulario otra vez.<\/p>\n\n\t\t\t\t\t\t<div class=\"hhh-submit-login-actions\">\n\t\t\t\t\t\t\t<a class=\"hhh-submit-login-btn\" href=\"https:\/\/henryhateshiking.com\/es\/account\/?redirect_to=https%3A%2F%2Fhenryhateshiking.com%2Fes%2Ftrails%2F\">\n\t\t\t\t\t\t\t\tIniciar sesi\u00f3n\n\t\t\t\t\t\t\t<\/a>\n\n\t\t\t\t\t\t\t<a class=\"hhh-submit-register-btn\" href=\"https:\/\/henryhateshiking.com\/es\/account\/?redirect_to=https%3A%2F%2Fhenryhateshiking.com%2Fes%2Ftrails%2F\">\n\t\t\t\t\t\t\t\tCrear cuenta\n\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\n\t<style>\n\t\t.hhh-submit-trail-widget {\n\t\t\twidth: 100%;\n\t\t\tmargin: 18px 0 24px;\n\t\t\ttext-align: center;\n\t\t\tfont-family: inherit;\n\t\t}\n\n\t\t.hhh-submit-open-btn {\n\t\t\tdisplay: inline-flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t\tborder: none;\n\t\t\tborder-radius: 999px;\n\t\t\tpadding: 13px 22px;\n\t\t\tbackground: #14532d;\n\t\t\tcolor: #ffffff;\n\t\t\tfont-weight: 800;\n\t\t\tfont-size: 15px;\n\t\t\tcursor: pointer;\n\t\t\tbox-shadow: 0 10px 24px rgba(20, 83, 45, 0.18);\n\t\t\ttransition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;\n\t\t}\n\n\t\t.hhh-submit-open-btn:hover {\n\t\t\tbackground: #166534;\n\t\t\ttransform: translateY(-1px);\n\t\t\tbox-shadow: 0 14px 30px rgba(20, 83, 45, 0.24);\n\t\t}\n\n\t\t.hhh-submit-alert {\n\t\t\tmax-width: 820px;\n\t\t\tmargin: 0 auto 14px;\n\t\t\tborder-radius: 16px;\n\t\t\tpadding: 14px 16px;\n\t\t\ttext-align: left;\n\t\t\tfont-size: 14px;\n\t\t\tline-height: 1.45;\n\t\t}\n\n\t\t.hhh-submit-success {\n\t\t\tbackground: #ecfdf5;\n\t\t\tcolor: #064e3b;\n\t\t\tborder: 1px solid #bbf7d0;\n\t\t}\n\n\t\t.hhh-submit-error {\n\t\t\tbackground: #fef2f2;\n\t\t\tcolor: #7f1d1d;\n\t\t\tborder: 1px solid #fecaca;\n\t\t}\n\n\t\t.hhh-submit-modal {\n\t\t\tdisplay: none;\n\t\t\tposition: fixed;\n\t\t\tinset: 0;\n\t\t\tz-index: 999999;\n\t\t}\n\n\t\t.hhh-submit-modal.is-open {\n\t\t\tdisplay: block;\n\t\t}\n\n\t\t.hhh-submit-modal-backdrop {\n\t\t\tposition: absolute;\n\t\t\tinset: 0;\n\t\t\tbackground: rgba(0, 0, 0, 0.58);\n\t\t}\n\n\t\t.hhh-submit-modal-card {\n\t\t\tposition: relative;\n\t\t\tz-index: 2;\n\t\t\twidth: min(920px, calc(100% - 24px));\n\t\t\tmax-height: calc(100vh - 36px);\n\t\t\toverflow-y: auto;\n\t\t\tmargin: 18px auto;\n\t\t\tbackground: #ffffff;\n\t\t\tborder-radius: 24px;\n\t\t\tpadding: 24px;\n\t\t\ttext-align: left;\n\t\t\tbox-shadow: 0 24px 80px rgba(0, 0, 0, 0.35);\n\t\t}\n\n\t\t.hhh-submit-modal-card .hhh-submit-close {\n\t\t\tposition: absolute !important;\n\t\t\ttop: 20px !important;\n\t\t\tright: 20px !important;\n\t\t\twidth: 44px !important;\n\t\t\theight: 44px !important;\n\t\t\tmin-width: 44px !important;\n\t\t\tmax-width: 44px !important;\n\t\t\tmin-height: 44px !important;\n\t\t\tmax-height: 44px !important;\n\t\t\tpadding: 0 !important;\n\t\t\tmargin: 0 !important;\n\t\t\tdisplay: flex !important;\n\t\t\talign-items: center !important;\n\t\t\tjustify-content: center !important;\n\t\t\tborder-radius: 999px !important;\n\t\t\tborder: 1px solid #e5e7eb !important;\n\t\t\tbackground: #ffffff !important;\n\t\t\tcolor: #111827 !important;\n\t\t\tbox-shadow: 0 8px 20px rgba(0, 0, 0, 0.08) !important;\n\t\t\tcursor: pointer !important;\n\t\t\tz-index: 20 !important;\n\t\t\tappearance: none !important;\n\t\t\t-webkit-appearance: none !important;\n\t\t\tline-height: 1 !important;\n\t\t\tfont-family: Arial, sans-serif !important;\n\t\t}\n\n\t\t.hhh-submit-modal-card .hhh-submit-close span {\n\t\t\tdisplay: block !important;\n\t\t\tfont-size: 32px !important;\n\t\t\tfont-weight: 300 !important;\n\t\t\tline-height: 38px !important;\n\t\t\ttransform: translateY(-1px);\n\t\t}\n\n\t\t.hhh-submit-modal-card .hhh-submit-close:hover {\n\t\t\tbackground: #f3f4f6 !important;\n\t\t\ttransform: none !important;\n\t\t}\n\n\t\t.hhh-submit-modal-header {\n\t\t\tmargin-bottom: 20px;\n\t\t\tpadding-right: 72px;\n\t\t}\n\n\t\t.hhh-submit-eyebrow {\n\t\t\tmargin: 0 0 6px;\n\t\t\ttext-transform: uppercase;\n\t\t\tletter-spacing: 0.08em;\n\t\t\tfont-size: 12px;\n\t\t\tfont-weight: 900;\n\t\t\tcolor: #166534;\n\t\t}\n\n\t\t.hhh-submit-modal-header h2 {\n\t\t\tmargin: 0 0 8px;\n\t\t\tfont-size: clamp(26px, 4vw, 38px);\n\t\t\tline-height: 1.05;\n\t\t\tcolor: #111827;\n\t\t}\n\n\t\t.hhh-submit-modal-header p {\n\t\t\tmargin: 0;\n\t\t\tcolor: #4b5563;\n\t\t\tfont-size: 15px;\n\t\t\tline-height: 1.5;\n\t\t}\n\n\t\t.hhh-submit-form {\n\t\t\tdisplay: grid;\n\t\t\tgap: 18px;\n\t\t}\n\n\t\t.hhh-form-section {\n\t\t\tborder: 1px solid #e5e7eb;\n\t\t\tborder-radius: 20px;\n\t\t\tpadding: 18px;\n\t\t\tbackground: #f9fafb;\n\t\t}\n\n\t\t.hhh-form-section h3 {\n\t\t\tmargin: 0 0 14px;\n\t\t\tfont-size: 18px;\n\t\t\tcolor: #111827;\n\t\t}\n\n\t\t.hhh-form-section label {\n\t\t\tdisplay: grid;\n\t\t\tgap: 7px;\n\t\t\tmargin-bottom: 13px;\n\t\t\tfont-size: 13px;\n\t\t\tfont-weight: 800;\n\t\t\tcolor: #111827;\n\t\t}\n\n\t\t.hhh-form-section input,\n\t\t.hhh-form-section select,\n\t\t.hhh-form-section textarea {\n\t\t\twidth: 100%;\n\t\t\tborder: 1px solid #d1d5db;\n\t\t\tborder-radius: 14px;\n\t\t\tpadding: 12px 13px;\n\t\t\tbackground: #ffffff;\n\t\t\tcolor: #111827;\n\t\t\tfont-size: 15px;\n\t\t\tfont-family: inherit;\n\t\t\toutline: none;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t.hhh-form-section input:focus,\n\t\t.hhh-form-section select:focus,\n\t\t.hhh-form-section textarea:focus {\n\t\t\tborder-color: #166534;\n\t\t\tbox-shadow: 0 0 0 3px rgba(22, 101, 52, 0.12);\n\t\t}\n\n\t\t.hhh-form-grid {\n\t\t\tdisplay: grid;\n\t\t\tgrid-template-columns: repeat(3, minmax(0, 1fr));\n\t\t\tgap: 12px;\n\t\t}\n\n\t\t.hhh-form-note {\n\t\t\tmargin: -4px 0 14px;\n\t\t\tcolor: #6b7280;\n\t\t\tfont-size: 13px;\n\t\t\tline-height: 1.45;\n\t\t}\n\n\t\t.hhh-client-error {\n\t\t\tdisplay: none;\n\t\t\tmargin: 0 0 14px;\n\t\t\tborder-radius: 14px;\n\t\t\tpadding: 12px 13px;\n\t\t\tbackground: #fef2f2;\n\t\t\tcolor: #7f1d1d;\n\t\t\tborder: 1px solid #fecaca;\n\t\t\tfont-size: 13px;\n\t\t\tline-height: 1.4;\n\t\t}\n\n\t\t.hhh-client-status {\n\t\t\tdisplay: none;\n\t\t\tmargin: 0 0 14px;\n\t\t\tborder-radius: 14px;\n\t\t\tpadding: 12px 13px;\n\t\t\tbackground: #ecfdf5;\n\t\t\tcolor: #064e3b;\n\t\t\tborder: 1px solid #bbf7d0;\n\t\t\tfont-size: 13px;\n\t\t\tline-height: 1.4;\n\t\t}\n\n\t\t.hhh-submit-disclaimer {\n\t\t\tborder-radius: 16px;\n\t\t\tbackground: #fffbeb;\n\t\t\tborder: 1px solid #fde68a;\n\t\t\tcolor: #78350f;\n\t\t\tpadding: 13px 15px;\n\t\t\tfont-size: 13px;\n\t\t\tline-height: 1.45;\n\t\t}\n\n\t\t.hhh-submit-final-btn {\n\t\t\twidth: 100%;\n\t\t\tborder: none;\n\t\t\tborder-radius: 16px;\n\t\t\tbackground: #111827;\n\t\t\tcolor: #ffffff;\n\t\t\tpadding: 15px 18px;\n\t\t\tfont-weight: 900;\n\t\t\tfont-size: 16px;\n\t\t\tcursor: pointer;\n\t\t}\n\n\t\t.hhh-submit-final-btn:hover {\n\t\t\tbackground: #000000;\n\t\t}\n\n\t\t.hhh-submit-final-btn:disabled {\n\t\t\topacity: 0.7;\n\t\t\tcursor: not-allowed;\n\t\t}\n\n\t\t.hhh-submit-login-box {\n\t\t\tborder: 1px solid #e5e7eb;\n\t\t\tborder-radius: 20px;\n\t\t\tbackground: #f9fafb;\n\t\t\tpadding: 20px;\n\t\t}\n\n\t\t.hhh-submit-login-box h3 {\n\t\t\tmargin: 0 0 8px;\n\t\t\tcolor: #111827;\n\t\t}\n\n\t\t.hhh-submit-login-box p {\n\t\t\tmargin: 0 0 16px;\n\t\t\tcolor: #4b5563;\n\t\t}\n\n\t\t.hhh-submit-login-actions {\n\t\t\tdisplay: flex;\n\t\t\tflex-wrap: wrap;\n\t\t\tgap: 10px;\n\t\t}\n\n\t\t.hhh-submit-login-btn,\n\t\t.hhh-submit-register-btn {\n\t\t\tdisplay: inline-flex;\n\t\t\tjustify-content: center;\n\t\t\talign-items: center;\n\t\t\tborder-radius: 999px;\n\t\t\tpadding: 11px 16px;\n\t\t\tfont-weight: 900;\n\t\t\ttext-decoration: none;\n\t\t}\n\n\t\t.hhh-submit-login-btn {\n\t\t\tbackground: #14532d;\n\t\t\tcolor: #ffffff;\n\t\t}\n\n\t\t.hhh-submit-register-btn {\n\t\t\tbackground: #ffffff;\n\t\t\tcolor: #111827;\n\t\t\tborder: 1px solid #d1d5db;\n\t\t}\n\n\t\t.hhh-honeypot {\n\t\t\tposition: absolute !important;\n\t\t\tleft: -9999px !important;\n\t\t\twidth: 1px !important;\n\t\t\theight: 1px !important;\n\t\t\topacity: 0 !important;\n\t\t\tpointer-events: none !important;\n\t\t}\n\n\t\tbody.hhh-submit-modal-open {\n\t\t\toverflow: hidden;\n\t\t}\n\n\t\t@media (max-width: 720px) {\n\t\t\t.hhh-submit-modal-card {\n\t\t\t\twidth: calc(100% - 16px);\n\t\t\t\tmax-height: calc(100vh - 16px);\n\t\t\t\tmargin: 8px auto;\n\t\t\t\tborder-radius: 20px;\n\t\t\t\tpadding: 18px;\n\t\t\t}\n\n\t\t\t.hhh-submit-modal-card .hhh-submit-close {\n\t\t\t\ttop: 14px !important;\n\t\t\t\tright: 14px !important;\n\t\t\t\twidth: 40px !important;\n\t\t\t\theight: 40px !important;\n\t\t\t\tmin-width: 40px !important;\n\t\t\t\tmax-width: 40px !important;\n\t\t\t}\n\n\t\t\t.hhh-submit-modal-card .hhh-submit-close span {\n\t\t\t\tfont-size: 30px !important;\n\t\t\t\tline-height: 34px !important;\n\t\t\t}\n\n\t\t\t.hhh-submit-modal-header {\n\t\t\t\tpadding-right: 54px;\n\t\t\t}\n\n\t\t\t.hhh-form-grid {\n\t\t\t\tgrid-template-columns: 1fr;\n\t\t\t}\n\n\t\t\t.hhh-submit-open-btn {\n\t\t\t\twidth: 100%;\n\t\t\t\tmax-width: 420px;\n\t\t\t}\n\t\t}\n\t<\/style>\n\n\t<script>\n\t\tdocument.addEventListener('DOMContentLoaded', function () {\n\t\t\tconst openBtn = document.getElementById('hhhOpenTrailSubmit');\n\t\t\tconst modal = document.getElementById('hhhTrailSubmitModal');\n\t\t\tconst closeBtn = document.getElementById('hhhCloseTrailSubmit');\n\t\t\tconst backdrop = document.getElementById('hhhCloseTrailSubmitBackdrop');\n\t\t\tconst submitForm = document.querySelector('.hhh-submit-form');\n\t\t\tconst clientError = document.getElementById('hhhClientUploadError');\n\t\t\tconst clientStatus = document.getElementById('hhhClientUploadStatus');\n\n\t\t\tconst serverMaxBytes = 4 * 1024 * 1024;\n\t\t\tconst originalMaxBytes = 25 * 1024 * 1024;\n\t\t\tconst allowedTypes = ['image\/jpeg', 'image\/png', 'image\/webp'];\n\n\t\t\tif (!openBtn || !modal) return;\n\n\t\t\tfunction openModal() {\n\t\t\t\tmodal.classList.add('is-open');\n\t\t\t\tmodal.setAttribute('aria-hidden', 'false');\n\t\t\t\tdocument.body.classList.add('hhh-submit-modal-open');\n\t\t\t}\n\n\t\t\tfunction closeModal() {\n\t\t\t\tmodal.classList.remove('is-open');\n\t\t\t\tmodal.setAttribute('aria-hidden', 'true');\n\t\t\t\tdocument.body.classList.remove('hhh-submit-modal-open');\n\t\t\t}\n\n\t\t\tfunction showClientError(message) {\n\t\t\t\tif (!clientError) return;\n\t\t\t\tclientError.style.display = 'block';\n\t\t\t\tclientError.textContent = message;\n\t\t\t}\n\n\t\t\tfunction clearClientError() {\n\t\t\t\tif (!clientError) return;\n\t\t\t\tclientError.style.display = 'none';\n\t\t\t\tclientError.textContent = '';\n\t\t\t}\n\n\t\t\tfunction showClientStatus(message) {\n\t\t\t\tif (!clientStatus) return;\n\t\t\t\tclientStatus.style.display = 'block';\n\t\t\t\tclientStatus.textContent = message;\n\t\t\t}\n\n\t\t\tfunction clearClientStatus() {\n\t\t\t\tif (!clientStatus) return;\n\t\t\t\tclientStatus.style.display = 'none';\n\t\t\t\tclientStatus.textContent = '';\n\t\t\t}\n\n\t\t\tfunction readFileAsDataURL(file) {\n\t\t\t\treturn new Promise(function (resolve, reject) {\n\t\t\t\t\tconst reader = new FileReader();\n\n\t\t\t\t\treader.onload = function () {\n\t\t\t\t\t\tresolve(reader.result);\n\t\t\t\t\t};\n\n\t\t\t\t\treader.onerror = function () {\n\t\t\t\t\t\treject(new Error('No se pudo leer una de las fotos.'));\n\t\t\t\t\t};\n\n\t\t\t\t\treader.readAsDataURL(file);\n\t\t\t\t});\n\t\t\t}\n\n\t\t\tfunction loadImage(src) {\n\t\t\t\treturn new Promise(function (resolve, reject) {\n\t\t\t\t\tconst img = new Image();\n\n\t\t\t\t\timg.onload = function () {\n\t\t\t\t\t\tresolve(img);\n\t\t\t\t\t};\n\n\t\t\t\t\timg.onerror = function () {\n\t\t\t\t\t\treject(new Error('No se pudo procesar una de las fotos.'));\n\t\t\t\t\t};\n\n\t\t\t\t\timg.src = src;\n\t\t\t\t});\n\t\t\t}\n\n\t\t\tfunction canvasToBlob(canvas, type, quality) {\n\t\t\t\treturn new Promise(function (resolve) {\n\t\t\t\t\tcanvas.toBlob(function (blob) {\n\t\t\t\t\t\tresolve(blob);\n\t\t\t\t\t}, type, quality);\n\t\t\t\t});\n\t\t\t}\n\n\t\t\tasync function compressImage(file, maxDimension, quality) {\n\t\t\t\tconst dataUrl = await readFileAsDataURL(file);\n\t\t\t\tconst img = await loadImage(dataUrl);\n\n\t\t\t\tlet width = img.width;\n\t\t\t\tlet height = img.height;\n\n\t\t\t\tif (width > height && width > maxDimension) {\n\t\t\t\t\theight = Math.round(height * (maxDimension \/ width));\n\t\t\t\t\twidth = maxDimension;\n\t\t\t\t} else if (height > maxDimension) {\n\t\t\t\t\twidth = Math.round(width * (maxDimension \/ height));\n\t\t\t\t\theight = maxDimension;\n\t\t\t\t}\n\n\t\t\t\tconst canvas = document.createElement('canvas');\n\t\t\t\tcanvas.width = width;\n\t\t\t\tcanvas.height = height;\n\n\t\t\t\tconst ctx = canvas.getContext('2d');\n\n\t\t\t\tctx.fillStyle = '#ffffff';\n\t\t\t\tctx.fillRect(0, 0, width, height);\n\t\t\t\tctx.drawImage(img, 0, 0, width, height);\n\n\t\t\t\tconst blob = await canvasToBlob(canvas, 'image\/jpeg', quality);\n\n\t\t\t\tif (!blob) {\n\t\t\t\t\tthrow new Error('No se pudo reducir una de las fotos.');\n\t\t\t\t}\n\n\t\t\t\treturn blob;\n\t\t\t}\n\n\t\t\tasync function prepareImageInput(input, index) {\n\t\t\t\tif (!input || !input.files || !input.files[0]) return;\n\n\t\t\t\tconst file = input.files[0];\n\n\t\t\t\tif (!allowedTypes.includes(file.type)) {\n\t\t\t\t\tthrow new Error('Foto ' + index + ' debe ser JPG, PNG o WebP.');\n\t\t\t\t}\n\n\t\t\t\tif (file.size > originalMaxBytes) {\n\t\t\t\t\tthrow new Error('Foto ' + index + ' es demasiado grande. Elige una foto m\u00e1s peque\u00f1a.');\n\t\t\t\t}\n\n\t\t\t\tlet finalBlob = file;\n\n\t\t\t\tif (file.size > 1200000) {\n\t\t\t\t\tconst attempts = [\n\t\t\t\t\t\t{ maxDimension: 1800, quality: 0.74 },\n\t\t\t\t\t\t{ maxDimension: 1400, quality: 0.68 },\n\t\t\t\t\t\t{ maxDimension: 1100, quality: 0.62 }\n\t\t\t\t\t];\n\n\t\t\t\t\tfor (const attempt of attempts) {\n\t\t\t\t\t\tconst compressedBlob = await compressImage(file, attempt.maxDimension, attempt.quality);\n\n\t\t\t\t\t\tif (compressedBlob && compressedBlob.size < finalBlob.size) {\n\t\t\t\t\t\t\tfinalBlob = compressedBlob;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tif (finalBlob.size <= serverMaxBytes) {\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif (finalBlob.size > serverMaxBytes) {\n\t\t\t\t\tthrow new Error('Foto ' + index + ' sigue siendo demasiado grande despu\u00e9s de reducirse. Intenta con una imagen m\u00e1s peque\u00f1a.');\n\t\t\t\t}\n\n\t\t\t\tif (finalBlob !== file) {\n\t\t\t\t\tif (typeof DataTransfer === 'undefined') {\n\t\t\t\t\t\tthrow new Error('No se pudo reducir una de las fotos.');\n\t\t\t\t\t}\n\n\t\t\t\t\tconst newName = file.name.replace(\/\\.[^\/.]+$\/, '') + '-hhh.jpg';\n\t\t\t\t\tconst newFile = new File([finalBlob], newName, { type: 'image\/jpeg' });\n\n\t\t\t\t\tconst dataTransfer = new DataTransfer();\n\t\t\t\t\tdataTransfer.items.add(newFile);\n\t\t\t\t\tinput.files = dataTransfer.files;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tasync function prepareAllImages() {\n\t\t\t\tconst imageInputs = document.querySelectorAll('.hhh-photo-input');\n\t\t\t\tlet count = 0;\n\n\t\t\t\timageInputs.forEach(function (input) {\n\t\t\t\t\tif (input.files && input.files[0]) {\n\t\t\t\t\t\tcount++;\n\t\t\t\t\t}\n\t\t\t\t});\n\n\t\t\t\tif (count !== 3) {\n\t\t\t\t\tthrow new Error('Por favor sube exactamente 3 fotos.');\n\t\t\t\t}\n\n\t\t\t\tshowClientStatus('Preparando fotos. Las im\u00e1genes grandes se est\u00e1n reduciendo antes de subirse...');\n\n\t\t\t\tfor (let i = 0; i < imageInputs.length; i++) {\n\t\t\t\t\tawait prepareImageInput(imageInputs[i], i + 1);\n\t\t\t\t}\n\n\t\t\t\tshowClientStatus('Fotos listas. Enviando ruta...');\n\t\t\t}\n\n\t\t\topenBtn.addEventListener('click', openModal);\n\n\t\t\tif (closeBtn) {\n\t\t\t\tcloseBtn.addEventListener('click', closeModal);\n\t\t\t}\n\n\t\t\tif (backdrop) {\n\t\t\t\tbackdrop.addEventListener('click', closeModal);\n\t\t\t}\n\n\t\t\tdocument.addEventListener('keydown', function (event) {\n\t\t\t\tif (event.key === 'Escape') {\n\t\t\t\t\tcloseModal();\n\t\t\t\t}\n\t\t\t});\n\n\t\t\tif (submitForm) {\n\t\t\t\tsubmitForm.addEventListener('submit', async function (event) {\n\t\t\t\t\tif (submitForm.dataset.readyToSubmit === '1') {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tevent.preventDefault();\n\n\t\t\t\t\tclearClientError();\n\t\t\t\t\tclearClientStatus();\n\n\t\t\t\t\tconst submitBtn = submitForm.querySelector('.hhh-submit-final-btn');\n\n\t\t\t\t\tif (submitBtn) {\n\t\t\t\t\t\tsubmitBtn.disabled = true;\n\t\t\t\t\t\tsubmitBtn.textContent = 'Preparando fotos...';\n\t\t\t\t\t}\n\n\t\t\t\t\ttry {\n\t\t\t\t\t\tawait prepareAllImages();\n\n\t\t\t\t\t\tif (submitBtn) {\n\t\t\t\t\t\t\tsubmitBtn.textContent = 'Enviando ruta...';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tsubmitForm.dataset.readyToSubmit = '1';\n\t\t\t\t\t\tsubmitForm.submit();\n\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\tif (submitBtn) {\n\t\t\t\t\t\t\tsubmitBtn.disabled = false;\n\t\t\t\t\t\t\tsubmitBtn.textContent = 'Enviar ruta para revisi\u00f3n';\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tshowClientError(error.message || 'Hubo un problema con una de las fotos.');\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t}\n\t\t});\n\t<\/script>\n\n\t\n\n\n\n  <div id=\"hhh-trails-grid\">\n\n    \n        <article\n          id=\"trail-2946\"\n          class=\"hhh-trail-card\"\n          role=\"button\"\n          tabindex=\"0\"\n          data-title=\"calabace\u00f1as\n  &lt;div class=&quot;hhh-trail-added-by is-compact&quot;&gt;\n    &lt;a href=&quot;https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com&quot;&gt;\n      &lt;img alt=&#039;&#039; src=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg&#039; srcset=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x&#039; class=&#039;avatar avatar-26 photo&#039; height=&#039;26&#039; width=&#039;26&#039; \/&gt;      &lt;span&gt;\n        &lt;small&gt;agregada por&lt;\/small&gt;\n        &lt;strong&gt;henry hates hiking&lt;\/strong&gt;\n      &lt;\/span&gt;\n    &lt;\/a&gt;\n  &lt;\/div&gt;\n\n  \"\n          data-location=\"san pedro garza garcia, nuevo leon, mexico\"\n          data-search=\"calabace\u00f1as\n  &lt;div class=&quot;hhh-trail-added-by is-compact&quot;&gt;\n    &lt;a href=&quot;https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com&quot;&gt;\n      &lt;img alt=&#039;&#039; src=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg&#039; srcset=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x&#039; class=&#039;avatar avatar-26 photo&#039; height=&#039;26&#039; width=&#039;26&#039; \/&gt;      &lt;span&gt;\n        &lt;small&gt;agregada por&lt;\/small&gt;\n        &lt;strong&gt;henry hates hiking&lt;\/strong&gt;\n      &lt;\/span&gt;\n    &lt;\/a&gt;\n  &lt;\/div&gt;\n\n   san pedro garza garcia, nuevo leon, mexico a very scenic, calm route. you need to know someone who can let you into the private neighborhood to get to the trailhead.  moderate\"\n          data-difficulty=\"moderate\"\n          data-diffrank=\"2\"\n          data-distance=\"5\"\n          data-elevation=\"577\"\n          data-time=\"3\"\n          data-ratingavg=\"0\"\n          data-ratingcount=\"0\"\n        >\n\n                      <div class=\"hhh-trail-card-img-wrap hhh-lazy-bg\"\n                 role=\"img\"\n                 aria-label=\"Calabace\u00f1as\n  &lt;div class=&quot;hhh-trail-added-by is-compact&quot;&gt;\n    &lt;a href=&quot;https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com&quot;&gt;\n      &lt;img alt=&#039;&#039; src=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg&#039; srcset=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x&#039; class=&#039;avatar avatar-26 photo&#039; height=&#039;26&#039; width=&#039;26&#039; \/&gt;      &lt;span&gt;\n        &lt;small&gt;Agregada por&lt;\/small&gt;\n        &lt;strong&gt;Henry Hates Hiking&lt;\/strong&gt;\n      &lt;\/span&gt;\n    &lt;\/a&gt;\n  &lt;\/div&gt;\n\n  \"\n                 data-bg=\"https:\/\/henryhateshiking.com\/wp-content\/uploads\/2025\/11\/wp-1763410886837896252580264548652.jpg\"\n                 style=\"background-position: 50% 50%; background-image: url(&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2025\/11\/wp-1763410886837896252580264548652.jpg&#039;);\">\n            <\/div>\n          \n          <div class=\"hhh-trail-card-body\">\n            <h3>Calabace\u00f1as\n  <div class=\"hhh-trail-added-by is-compact\">\n    <a href=\"https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com\">\n      <img alt=\"20240818 153346 150x150\" src='https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg' srcset='https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x' class='avatar avatar-26 photo' height='26' width='26'  title=\"Sillalogia\" \/>      <span>\n        <small>Agregada por<\/small>\n        <strong>Henry Hates Hiking<\/strong>\n      <\/span>\n    <\/a>\n  <\/div>\n\n  <\/h3>\n\n                          <p class=\"hhh-trail-location\">San Pedro Garza Garcia, Nuevo Leon, Mexico<\/p>\n            \n            <div class=\"hhh-card-rating\">\n                              <span class=\"hhh-stars hhh-stars--md\" aria-hidden=\"true\">\n                  <span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span>\n                <\/span>\n              \n              <span class=\"hhh-card-rating__text\">\n                                  No ratings yet\n                              <\/span>\n            <\/div>\n\n            <p class=\"hhh-trail-stats\">\n                              <span class=\"hhh-stat-chip\">\ud83e\udd7e 5 km<\/span>\n              \n                              <span class=\"hhh-stat-chip\">\u26f0\ufe0f 577 m<\/span>\n              \n                              <span class=\"hhh-stat-chip\">\u23f1\ufe0f 3 h<\/span>\n                          <\/p>\n\n                          <p class=\"hhh-trail-diff-wrap\">\n                <span class=\"hhh-diff-badge hhh-diff-moderate\">\n                  \ud83d\udd25 moderate                <\/span>\n              <\/p>\n            \n                          <p class=\"hhh-trail-snippet\">A very scenic, calm route. You need to know someone who can let you into the private neighborhood to get to the trailhead. <\/p>\n            \n            <button class=\"hhh-open-trail\" type=\"button\" data-trail-id=\"2946\">\n              View full trail guide\n            <\/button>\n          <\/div>\n        <\/article>\n\n      \n        <article\n          id=\"trail-2865\"\n          class=\"hhh-trail-card\"\n          role=\"button\"\n          tabindex=\"0\"\n          data-title=\"ca\u00f1\u00f3n de la virgen\n  &lt;div class=&quot;hhh-trail-added-by is-compact&quot;&gt;\n    &lt;a href=&quot;https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com&quot;&gt;\n      &lt;img alt=&#039;&#039; src=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg&#039; srcset=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x&#039; class=&#039;avatar avatar-26 photo&#039; height=&#039;26&#039; width=&#039;26&#039; \/&gt;      &lt;span&gt;\n        &lt;small&gt;agregada por&lt;\/small&gt;\n        &lt;strong&gt;henry hates hiking&lt;\/strong&gt;\n      &lt;\/span&gt;\n    &lt;\/a&gt;\n  &lt;\/div&gt;\n\n  \"\n          data-location=\"santiago, nuevo leon, mexico\"\n          data-search=\"ca\u00f1\u00f3n de la virgen\n  &lt;div class=&quot;hhh-trail-added-by is-compact&quot;&gt;\n    &lt;a href=&quot;https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com&quot;&gt;\n      &lt;img alt=&#039;&#039; src=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg&#039; srcset=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x&#039; class=&#039;avatar avatar-26 photo&#039; height=&#039;26&#039; width=&#039;26&#039; \/&gt;      &lt;span&gt;\n        &lt;small&gt;agregada por&lt;\/small&gt;\n        &lt;strong&gt;henry hates hiking&lt;\/strong&gt;\n      &lt;\/span&gt;\n    &lt;\/a&gt;\n  &lt;\/div&gt;\n\n   santiago, nuevo leon, mexico a canyon scramble where you hop between giant rocks, climb the river bed, and get rewarded with a secret waterfall.  medium\"\n          data-difficulty=\"medium\"\n          data-diffrank=\"3\"\n          data-distance=\"11.48\"\n          data-elevation=\"360\"\n          data-time=\"5.5\"\n          data-ratingavg=\"0\"\n          data-ratingcount=\"0\"\n        >\n\n                      <div class=\"hhh-trail-card-img-wrap hhh-lazy-bg\"\n                 role=\"img\"\n                 aria-label=\"Ca\u00f1\u00f3n de la Virgen\n  &lt;div class=&quot;hhh-trail-added-by is-compact&quot;&gt;\n    &lt;a href=&quot;https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com&quot;&gt;\n      &lt;img alt=&#039;&#039; src=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg&#039; srcset=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x&#039; class=&#039;avatar avatar-26 photo&#039; height=&#039;26&#039; width=&#039;26&#039; \/&gt;      &lt;span&gt;\n        &lt;small&gt;Agregada por&lt;\/small&gt;\n        &lt;strong&gt;Henry Hates Hiking&lt;\/strong&gt;\n      &lt;\/span&gt;\n    &lt;\/a&gt;\n  &lt;\/div&gt;\n\n  \"\n                 data-bg=\"https:\/\/henryhateshiking.com\/wp-content\/uploads\/2025\/11\/wp-17632396689231495664098864355994.jpg\"\n                 style=\"background-position: 50% 55%; background-image: url(&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2025\/11\/wp-17632396689231495664098864355994.jpg&#039;);\">\n            <\/div>\n          \n          <div class=\"hhh-trail-card-body\">\n            <h3>Ca\u00f1\u00f3n de la Virgen\n  <div class=\"hhh-trail-added-by is-compact\">\n    <a href=\"https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com\">\n      <img alt=\"20240818 153346 150x150\" src='https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg' srcset='https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x' class='avatar avatar-26 photo' height='26' width='26'  title=\"Sillalogia\" \/>      <span>\n        <small>Agregada por<\/small>\n        <strong>Henry Hates Hiking<\/strong>\n      <\/span>\n    <\/a>\n  <\/div>\n\n  <\/h3>\n\n                          <p class=\"hhh-trail-location\">Santiago, Nuevo Leon, Mexico<\/p>\n            \n            <div class=\"hhh-card-rating\">\n                              <span class=\"hhh-stars hhh-stars--md\" aria-hidden=\"true\">\n                  <span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span>\n                <\/span>\n              \n              <span class=\"hhh-card-rating__text\">\n                                  No ratings yet\n                              <\/span>\n            <\/div>\n\n            <p class=\"hhh-trail-stats\">\n                              <span class=\"hhh-stat-chip\">\ud83e\udd7e 11.48 km<\/span>\n              \n                              <span class=\"hhh-stat-chip\">\u26f0\ufe0f 360 m<\/span>\n              \n                              <span class=\"hhh-stat-chip\">\u23f1\ufe0f 5.5 h<\/span>\n                          <\/p>\n\n                          <p class=\"hhh-trail-diff-wrap\">\n                <span class=\"hhh-diff-badge hhh-diff-medium\">\n                  \ud83d\udd25 medium                <\/span>\n              <\/p>\n            \n                          <p class=\"hhh-trail-snippet\">A canyon scramble where you hop between giant rocks, climb the river bed, and get rewarded with a secret waterfall. <\/p>\n            \n            <button class=\"hhh-open-trail\" type=\"button\" data-trail-id=\"2865\">\n              View full trail guide\n            <\/button>\n          <\/div>\n        <\/article>\n\n      \n        <article\n          id=\"trail-4257\"\n          class=\"hhh-trail-card\"\n          role=\"button\"\n          tabindex=\"0\"\n          data-title=\"ca\u00f1\u00f3n el mandarin\n  &lt;div class=&quot;hhh-trail-added-by is-compact&quot;&gt;\n    &lt;a href=&quot;https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com&quot;&gt;\n      &lt;img alt=&#039;&#039; src=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg&#039; srcset=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x&#039; class=&#039;avatar avatar-26 photo&#039; height=&#039;26&#039; width=&#039;26&#039; \/&gt;      &lt;span&gt;\n        &lt;small&gt;agregada por&lt;\/small&gt;\n        &lt;strong&gt;henry hates hiking&lt;\/strong&gt;\n      &lt;\/span&gt;\n    &lt;\/a&gt;\n  &lt;\/div&gt;\n\n  \"\n          data-location=\"allende, nuevo leon, mexico\"\n          data-search=\"ca\u00f1\u00f3n el mandarin\n  &lt;div class=&quot;hhh-trail-added-by is-compact&quot;&gt;\n    &lt;a href=&quot;https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com&quot;&gt;\n      &lt;img alt=&#039;&#039; src=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg&#039; srcset=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x&#039; class=&#039;avatar avatar-26 photo&#039; height=&#039;26&#039; width=&#039;26&#039; \/&gt;      &lt;span&gt;\n        &lt;small&gt;agregada por&lt;\/small&gt;\n        &lt;strong&gt;henry hates hiking&lt;\/strong&gt;\n      &lt;\/span&gt;\n    &lt;\/a&gt;\n  &lt;\/div&gt;\n\n   allende, nuevo leon, mexico a short but intense canyon route with crystal-clear pools, waterfalls, downclimbs, water jumps, and rugged river walking.  medium\"\n          data-difficulty=\"medium\"\n          data-diffrank=\"3\"\n          data-distance=\"6.14\"\n          data-elevation=\"1064\"\n          data-time=\"5\"\n          data-ratingavg=\"0\"\n          data-ratingcount=\"0\"\n        >\n\n                      <div class=\"hhh-trail-card-img-wrap hhh-lazy-bg\"\n                 role=\"img\"\n                 aria-label=\"Ca\u00f1\u00f3n El Mandarin\n  &lt;div class=&quot;hhh-trail-added-by is-compact&quot;&gt;\n    &lt;a href=&quot;https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com&quot;&gt;\n      &lt;img alt=&#039;&#039; src=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg&#039; srcset=&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x&#039; class=&#039;avatar avatar-26 photo&#039; height=&#039;26&#039; width=&#039;26&#039; \/&gt;      &lt;span&gt;\n        &lt;small&gt;Agregada por&lt;\/small&gt;\n        &lt;strong&gt;Henry Hates Hiking&lt;\/strong&gt;\n      &lt;\/span&gt;\n    &lt;\/a&gt;\n  &lt;\/div&gt;\n\n  \"\n                 data-bg=\"https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/06\/Screenshot-2026-06-21-at-6.44.21-AM.png\"\n                 style=\"background-position: 50% 50%; background-image: url(&#039;https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/06\/Screenshot-2026-06-21-at-6.44.21-AM.png&#039;);\">\n            <\/div>\n          \n          <div class=\"hhh-trail-card-body\">\n            <h3>Ca\u00f1\u00f3n El Mandarin\n  <div class=\"hhh-trail-added-by is-compact\">\n    <a href=\"https:\/\/henryhateshiking.com\/es\/es\/profile\/?user=hhenryarthurgmail-com\">\n      <img alt=\"20240818 153346 150x150\" src='https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg' srcset='https:\/\/henryhateshiking.com\/wp-content\/uploads\/2026\/05\/20240818_153346-150x150.jpg 2x' class='avatar avatar-26 photo' height='26' width='26'  title=\"Sillalogia\" \/>      <span>\n        <small>Agregada por<\/small>\n        <strong>Henry Hates Hiking<\/strong>\n      <\/span>\n    <\/a>\n  <\/div>\n\n  <\/h3>\n\n                          <p class=\"hhh-trail-location\">Allende, Nuevo Leon, Mexico<\/p>\n            \n            <div class=\"hhh-card-rating\">\n                              <span class=\"hhh-stars hhh-stars--md\" aria-hidden=\"true\">\n                  <span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span><span class=\"hhh-star is-empty\">\u2605<\/span>\n                <\/span>\n              \n              <span class=\"hhh-card-rating__text\">\n                                  No ratings yet\n                              <\/span>\n            <\/div>\n\n            <p class=\"hhh-trail-stats\">\n                              <span class=\"hhh-stat-chip\">\ud83e\udd7e 6.14 km<\/span>\n              \n                              <span class=\"hhh-stat-chip\">\u26f0\ufe0f 1064 m<\/span>\n              \n                              <span class=\"hhh-stat-chip\">\u23f1\ufe0f 5 h<\/span>\n                          <\/p>\n\n                          <p class=\"hhh-trail-diff-wrap\">\n                <span class=\"hhh-diff-badge hhh-diff-medium\">\n                  \ud83d\udd25 medium                <\/span>\n              <\/p>\n            \n                          <p class=\"hhh-trail-snippet\">A short but intense canyon route with crystal-clear pools, waterfalls, downclimbs, water jumps, and rugged river walking. <\/p>\n            \n            <button class=\"hhh-open-trail\" type=\"button\" data-trail-id=\"4257\">\n              View full trail guide\n            <\/button>\n          <\/div>\n        <\/article>\n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n        \n\n      \n  <\/div>\n\n  <div id=\"hhhTrailModal\" class=\"hhh-trail-modal\" aria-hidden=\"true\">\n    <div class=\"hhh-modal-backdrop\"><\/div>\n\n    <div class=\"hhh-modal-content\" role=\"dialog\" aria-modal=\"true\">\n      <button class=\"hhh-modal-close\" type=\"button\" aria-label=\"Close trail guide\">&times;<\/button>\n\n      <div id=\"hhhTrailModalContent\">\n        <p>Loading trail guide...<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <style>\n    \/* ==========================================\n       HHH Trails Page Redesign\n    ========================================== *\/\n\n    body:has(#hhh-trails-grid) {\n      background: #fbf7ef !important;\n    }\n\n    body:has(#hhh-trails-grid) .entry-content,\n    body:has(#hhh-trails-grid) .site-content,\n    body:has(#hhh-trails-grid) .ast-container {\n      max-width: none !important;\n    }\n\n    body:has(#hhh-trails-grid) .entry-content {\n      padding-left: 0 !important;\n      padding-right: 0 !important;\n    }\n\n    body:has(#hhh-trails-grid) .site-header,\n    body:has(#hhh-trails-grid) .main-header-bar,\n    body:has(#hhh-trails-grid) .ast-primary-header-bar,\n    body:has(#hhh-trails-grid) .ast-above-header-bar,\n    body:has(#hhh-trails-grid) .ast-below-header-bar {\n      background: transparent !important;\n      box-shadow: none !important;\n      border-bottom: none !important;\n    }\n\n    body:has(#hhh-trails-grid) .site-header,\n    body:has(#hhh-trails-grid) #masthead {\n      position: absolute !important;\n      top: 0;\n      left: 0;\n      width: 100%;\n      z-index: 9999;\n    }\n\n    body:has(#hhh-trails-grid) .main-header-menu .menu-link,\n    body:has(#hhh-trails-grid) .ast-builder-menu-1 .menu-item > .menu-link {\n      color: #ffffff !important;\n    }\n\n    body:has(#hhh-trails-grid) .main-header-menu .menu-link:hover,\n    body:has(#hhh-trails-grid) .ast-builder-menu-1 .menu-item > .menu-link:hover {\n      color: #7ff0d2 !important;\n    }\n\n    :root {\n      --hhh-trails-bg: #fbf7ef;\n      --hhh-trails-card: #ffffff;\n      --hhh-trails-text: #16231d;\n      --hhh-trails-muted: #625f56;\n      --hhh-trails-green: #173d30;\n      --hhh-trails-green-2: #256456;\n      --hhh-trails-teal: #4fb7c5;\n      --hhh-trails-orange: #ee6f2d;\n      --hhh-trails-orange-dark: #c9551f;\n      --hhh-trails-mint: #7ff0d2;\n      --hhh-trails-border: rgba(22, 35, 29, .12);\n      --hhh-trails-shadow: 0 18px 44px rgba(22, 35, 29, .12);\n    }\n\n    \/* ==========================================\n       Filter\/search bar styling\n    ========================================== *\/\n\n    #hhh-search-text,\n    #hhh-filter-distance,\n    #hhh-filter-elevation,\n    #hhh-filter-time,\n    #hhh-filter-difficulty,\n    #hhh-filter-sort {\n      min-height: 52px !important;\n      border-radius: 999px !important;\n      border: 1px solid rgba(22,35,29,.14) !important;\n      background: #ffffff !important;\n      color: var(--hhh-trails-text) !important;\n      padding: 12px 16px !important;\n      font-family: inherit !important;\n      font-size: 15px !important;\n      font-weight: 750 !important;\n      box-shadow: 0 8px 22px rgba(22,35,29,.06) !important;\n      outline: none !important;\n    }\n\n    #hhh-search-text:focus,\n    #hhh-filter-distance:focus,\n    #hhh-filter-elevation:focus,\n    #hhh-filter-time:focus,\n    #hhh-filter-difficulty:focus,\n    #hhh-filter-sort:focus {\n      border-color: var(--hhh-trails-orange) !important;\n      box-shadow: 0 0 0 3px rgba(238,111,45,.14), 0 10px 24px rgba(22,35,29,.08) !important;\n    }\n\n    #hhh-search-button {\n      min-height: 52px !important;\n      border: 0 !important;\n      border-radius: 999px !important;\n      background: var(--hhh-trails-orange) !important;\n      color: #ffffff !important;\n      padding: 13px 20px !important;\n      font-family: inherit !important;\n      font-size: 15px !important;\n      font-weight: 950 !important;\n      cursor: pointer !important;\n      box-shadow: 0 14px 30px rgba(238,111,45,.24) !important;\n      transition: transform .18s ease, background .18s ease, box-shadow .18s ease !important;\n    }\n\n    #hhh-search-button:hover {\n      background: var(--hhh-trails-orange-dark) !important;\n      transform: translateY(-2px) !important;\n      box-shadow: 0 18px 38px rgba(238,111,45,.30) !important;\n    }\n\n    .hhh-trails-filters,\n    .hhh-filter-wrap,\n    .hhh-trails-controls,\n    .hhh-search-filter-wrap,\n    .trails-filter-wrap {\n      width: min(1120px, calc(100% - 32px)) !important;\n      margin: 0 auto 28px !important;\n      padding: 20px !important;\n      border-radius: 28px !important;\n      background: rgba(255,255,255,.78) !important;\n      border: 1px solid rgba(22,35,29,.10) !important;\n      box-shadow: 0 18px 44px rgba(22,35,29,.08) !important;\n      backdrop-filter: blur(10px) !important;\n    }\n\n    \/* ==========================================\n       Grid layout\n    ========================================== *\/\n\n    #hhh-trails-grid {\n      width: min(1120px, calc(100% - 32px));\n      max-width: 1120px;\n      margin: 28px auto 76px;\n      display: grid;\n      gap: 24px;\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n      align-items: stretch;\n    }\n\n    @media (max-width: 1050px) {\n      #hhh-trails-grid {\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n      }\n    }\n\n    @media (max-width: 680px) {\n      #hhh-trails-grid {\n        width: min(100% - 24px, 1120px);\n        grid-template-columns: 1fr;\n        gap: 20px;\n        margin-top: 22px;\n        margin-bottom: 56px;\n      }\n    }\n\n    \/* ==========================================\n       Trail cards\n    ========================================== *\/\n\n    .hhh-trail-card {\n      position: relative;\n      background: var(--hhh-trails-card);\n      border: 1px solid var(--hhh-trails-border);\n      border-radius: 28px;\n      box-shadow: 0 12px 28px rgba(22,35,29,.08);\n      overflow: hidden;\n      display: flex;\n      flex-direction: column;\n      cursor: pointer;\n      min-height: 100%;\n      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;\n    }\n\n    .hhh-trail-card:hover {\n      transform: translateY(-5px);\n      box-shadow: 0 22px 48px rgba(22,35,29,.14);\n      border-color: rgba(238,111,45,.25);\n    }\n\n    .hhh-trail-card:focus {\n      outline: 3px solid rgba(238,111,45,.24);\n      outline-offset: 4px;\n    }\n\n    .hhh-trail-card-img-wrap {\n      width: 100%;\n      height: 242px;\n      background-size: cover;\n      background-repeat: no-repeat;\n      background-position: center center;\n      background-color: #e9dfd2;\n      position: relative;\n      overflow: hidden;\n    }\n\n    .hhh-trail-card-img-wrap::after {\n      content: \"\";\n      position: absolute;\n      inset: 0;\n      background:\n        linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.34) 100%),\n        radial-gradient(circle at top right, rgba(127,240,210,.18), transparent 34%);\n      pointer-events: none;\n    }\n\n    .hhh-trail-card-body {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      padding: 22px;\n    }\n\n    .hhh-trail-card-body h3 {\n      margin: 0;\n      color: var(--hhh-trails-text);\n      font-size: 25px;\n      line-height: 1.05;\n      letter-spacing: -0.8px;\n      font-weight: 950;\n    }\n\n    .hhh-trail-location {\n      margin: 8px 0 0;\n      color: var(--hhh-trails-muted);\n      font-size: 15px;\n      line-height: 1.4;\n      font-weight: 650;\n    }\n\n    .hhh-card-rating {\n      display: flex;\n      align-items: center;\n      flex-wrap: wrap;\n      gap: 9px;\n      margin: 14px 0 0;\n      font-weight: 900;\n    }\n\n    .hhh-card-rating__text {\n      color: var(--hhh-trails-muted);\n      font-size: 13px;\n      line-height: 1;\n      font-weight: 850;\n    }\n\n    .hhh-stars {\n      display: inline-flex;\n      gap: 3px;\n      line-height: 1;\n      color: #f59e0b;\n    }\n\n    .hhh-stars--md .hhh-star {\n      font-size: 16px;\n    }\n\n    .hhh-star.is-full {\n      opacity: 1;\n    }\n\n    .hhh-star.is-half {\n      opacity: .65;\n    }\n\n    .hhh-star.is-empty {\n      opacity: .25;\n    }\n\n    .hhh-trail-stats {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 7px;\n      margin: 16px 0 0;\n      line-height: 1.2;\n    }\n\n    .hhh-stat-chip {\n      display: inline-flex;\n      align-items: center;\n      padding: 7px 9px;\n      border-radius: 999px;\n      background: #f0eadf;\n      color: var(--hhh-trails-green);\n      font-size: 12px;\n      font-weight: 900;\n      line-height: 1;\n    }\n\n    .hhh-trail-diff-wrap {\n      margin: 12px 0 0;\n    }\n\n    .hhh-diff-badge {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      padding: 7px 10px;\n      border-radius: 999px;\n      font-size: 12px;\n      font-weight: 950;\n      line-height: 1;\n      white-space: nowrap;\n    }\n\n    #hhh-trails-grid .hhh-diff-badge.hhh-diff-easy {\n      background-color: #2e7d32 !important;\n      color: #fff !important;\n    }\n\n    #hhh-trails-grid .hhh-diff-badge.hhh-diff-moderate {\n      background-color: #fde68a !important;\n      color: #3c2a00 !important;\n    }\n\n    #hhh-trails-grid .hhh-diff-badge.hhh-diff-medium {\n      background-color: #f59e0b !important;\n      color: #2b1a00 !important;\n    }\n\n    #hhh-trails-grid .hhh-diff-badge.hhh-diff-hard {\n      background-color: #c62828 !important;\n      color: #fff !important;\n    }\n\n    #hhh-trails-grid .hhh-diff-badge.hhh-diff-difficult {\n      background-color: #111 !important;\n      color: #fff !important;\n    }\n\n    .hhh-trail-snippet {\n      margin: 16px 0 0;\n      color: var(--hhh-trails-muted);\n      font-size: 16px;\n      line-height: 1.5;\n    }\n\n    .hhh-open-trail {\n      width: 100%;\n      min-height: 52px;\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      margin-top: auto;\n      padding: 14px 18px;\n      border-radius: 18px;\n      border: none;\n      cursor: pointer;\n      background: var(--hhh-trails-orange);\n      color: #ffffff !important;\n      font-family: inherit;\n      font-size: 15px;\n      font-weight: 950;\n      line-height: 1;\n      box-shadow: 0 14px 30px rgba(238,111,45,.20);\n      transition: transform .18s ease, background .18s ease, box-shadow .18s ease;\n    }\n\n    .hhh-open-trail:hover {\n      background: var(--hhh-trails-orange-dark);\n      transform: translateY(-2px);\n      box-shadow: 0 18px 36px rgba(238,111,45,.28);\n    }\n\n    .hhh-no-trails {\n      grid-column: 1 \/ -1;\n      text-align: center;\n      padding: 30px;\n      border-radius: 24px;\n      background: #ffffff;\n      border: 1px solid var(--hhh-trails-border);\n      color: var(--hhh-trails-muted);\n      font-weight: 850;\n    }\n\n    \/* ==========================================\n       AJAX modal \/ popup redesign\n    ========================================== *\/\n\n    .hhh-trail-modal {\n      display: none;\n      position: fixed;\n      inset: 0;\n      z-index: 100000;\n      padding: 22px;\n      overflow-y: auto;\n    }\n\n    .hhh-trail-modal.is-open {\n      display: grid;\n      place-items: center;\n    }\n\n    .hhh-modal-backdrop {\n      position: fixed;\n      inset: 0;\n      background: rgba(15, 49, 39, .78);\n      backdrop-filter: blur(7px);\n      z-index: 1;\n    }\n\n    .hhh-modal-content {\n      width: min(980px, 100%);\n      max-height: min(88svh, 900px);\n      overflow: auto;\n      background: #ffffff;\n      color: var(--hhh-trails-text);\n      border-radius: 30px;\n      position: relative;\n      box-sizing: border-box;\n      z-index: 2;\n      padding: 0;\n      box-shadow: 0 30px 90px rgba(0,0,0,.34);\n    }\n\n    .hhh-modal-close {\n      position: sticky;\n      top: 14px;\n      z-index: 5;\n      float: right;\n      margin: 14px 14px -60px 0;\n      width: 46px;\n      height: 46px;\n      border: 0;\n      border-radius: 999px;\n      background: var(--hhh-trails-green);\n      color: #ffffff;\n      font-size: 30px;\n      line-height: 1;\n      cursor: pointer;\n      box-shadow: 0 12px 24px rgba(0,0,0,.18);\n    }\n\n    .hhh-modal-close:hover {\n      background: var(--hhh-trails-orange);\n    }\n\n    body.hhh-modal-open {\n      overflow: hidden;\n    }\n\n    #hhhTrailModalContent {\n      padding: clamp(24px, 4vw, 44px);\n    }\n\n    #hhhTrailModalContent > p:first-child {\n      margin: 0;\n      color: var(--hhh-trails-muted);\n      font-weight: 900;\n      text-align: center;\n    }\n\n    .hhh-loaded-trail-guide h2 {\n      margin: 0;\n      padding-right: 50px;\n      color: var(--hhh-trails-text);\n      font-size: clamp(34px, 4vw, 58px);\n      line-height: .95;\n      letter-spacing: -2px;\n      font-weight: 950;\n    }\n\n    .hhh-loaded-trail-guide > p {\n      color: var(--hhh-trails-muted);\n      font-size: 17px;\n      line-height: 1.65;\n    }\n\n    .hhh-loaded-trail-guide strong {\n      color: var(--hhh-trails-text);\n      font-weight: 950;\n    }\n\n    .hhh-loaded-trail-guide h3 {\n      margin: 30px 0 10px;\n      padding-top: 24px;\n      border-top: 1px solid var(--hhh-trails-border);\n      color: var(--hhh-trails-text);\n      font-size: 26px;\n      line-height: 1.05;\n      letter-spacing: -.8px;\n      font-weight: 950;\n    }\n\n    .hhh-loaded-trail-guide div,\n    .hhh-loaded-trail-guide li {\n      color: var(--hhh-trails-muted);\n      font-size: 17px;\n      line-height: 1.65;\n    }\n\n    .hhh-loaded-trail-guide p {\n      color: var(--hhh-trails-muted);\n    }\n\n    .hhh-modal-rating {\n      margin: 22px 0;\n      padding: 18px;\n      border: 1px solid var(--hhh-trails-border);\n      border-radius: 22px;\n      background: #fbf7ef;\n    }\n\n    .hhh-modal-rating__meta {\n      margin: 10px 0 14px;\n      color: var(--hhh-trails-text);\n      font-weight: 900;\n    }\n\n    .hhh-reviews-btn,\n    .route-map-btn {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      min-height: 46px;\n      padding: 12px 16px;\n      border-radius: 999px;\n      text-decoration: none !important;\n      font-weight: 950;\n      background: var(--hhh-trails-orange);\n      color: #ffffff !important;\n      box-shadow: 0 14px 30px rgba(238,111,45,.20);\n      transition: transform .18s ease, background .18s ease, box-shadow .18s ease;\n    }\n\n    .hhh-reviews-btn:hover,\n    .route-map-btn:hover {\n      background: var(--hhh-trails-orange-dark);\n      color: #ffffff !important;\n      transform: translateY(-2px);\n      box-shadow: 0 18px 36px rgba(238,111,45,.28);\n    }\n\n    \/* ==========================================\n       Modal gallery + lightbox\n    ========================================== *\/\n\n    .hhh-lightbox-gallery {\n      display: grid;\n      grid-template-columns: 1.4fr .8fr .8fr;\n      gap: 10px;\n      margin: 14px 0 22px;\n      align-items: stretch;\n    }\n\n    .hhh-trail-gallery-img {\n      width: 100%;\n      height: 250px !important;\n      display: block;\n      object-fit: cover;\n      border-radius: 18px;\n      cursor: pointer;\n      background: #e9dfd2;\n      transition: transform .18s ease, filter .18s ease;\n    }\n\n    .hhh-trail-gallery-img:hover {\n      transform: translateY(-2px);\n      filter: brightness(.96);\n    }\n\n    .hhh-image-overlay {\n      position: fixed;\n      inset: 0;\n      background: rgba(0,0,0,.90);\n      z-index: 100001;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: 20px;\n    }\n\n    .hhh-image-overlay-inner {\n      position: relative;\n      max-width: 95%;\n      max-height: 95%;\n    }\n\n    .hhh-image-overlay-inner img {\n      width: auto;\n      height: auto;\n      max-width: 100%;\n      max-height: 90vh;\n      object-fit: contain;\n      display: block;\n      border-radius: 18px;\n    }\n\n    .hhh-image-overlay-close {\n      position: absolute;\n      top: -42px;\n      right: 0;\n      font-size: 34px;\n      line-height: 1;\n      color: #ffffff;\n      cursor: pointer;\n    }\n\n    \/* ==========================================\n       Mobile\n    ========================================== *\/\n\n    @media (max-width: 768px) {\n      .hhh-trail-card-img-wrap {\n        height: 230px;\n      }\n\n      .hhh-lightbox-gallery {\n        grid-template-columns: 1fr;\n      }\n\n      .hhh-trail-gallery-img {\n        height: auto !important;\n        max-height: 360px;\n      }\n\n      .hhh-trail-modal {\n        padding: 12px;\n      }\n\n      .hhh-modal-content {\n        border-radius: 24px;\n        max-height: 88svh;\n      }\n\n      #hhhTrailModalContent {\n        padding: 24px;\n      }\n\n      .hhh-modal-close {\n        width: 42px;\n        height: 42px;\n        font-size: 28px;\n      }\n\n      .hhh-loaded-trail-guide h2 {\n        font-size: clamp(32px, 10vw, 46px);\n        padding-right: 44px;\n      }\n    }\n\n    @media (max-width: 480px) {\n      .hhh-trail-card-body {\n        padding: 20px;\n      }\n\n      .hhh-trail-card-body h3 {\n        font-size: 24px;\n      }\n\n      .hhh-open-trail {\n        border-radius: 16px;\n      }\n    }\n  <\/style>\n\n  <script>\n    document.addEventListener('DOMContentLoaded', function () {\n      const ajaxUrl = \"https:\\\/\\\/henryhateshiking.com\\\/wp-admin\\\/admin-ajax.php\";\n      const ajaxNonce = \"ddd7ed69a8\";\n\n      const grid = document.getElementById('hhh-trails-grid');\n      const cards = Array.from(document.querySelectorAll('.hhh-trail-card'));\n\n      const modal = document.getElementById('hhhTrailModal');\n      const modalContent = document.getElementById('hhhTrailModalContent');\n      const modalClose = modal ? modal.querySelector('.hhh-modal-close') : null;\n      const modalBackdrop = modal ? modal.querySelector('.hhh-modal-backdrop') : null;\n\n      const trailCache = {};\n\n      \/* ---------- LAZY LOAD CARD BACKGROUND IMAGES ---------- *\/\n      function loadCardBg(el) {\n        if (!el) return;\n\n        const bg = el.getAttribute('data-bg');\n\n        if (!bg) return;\n\n        el.style.backgroundImage = \"url('\" + bg + \"')\";\n        el.removeAttribute('data-bg');\n      }\n\n      const lazyBgEls = Array.from(document.querySelectorAll('.hhh-lazy-bg'));\n\n      if ('IntersectionObserver' in window) {\n        const bgObserver = new IntersectionObserver(function (entries) {\n          entries.forEach(function (entry) {\n            if (entry.isIntersecting) {\n              loadCardBg(entry.target);\n              bgObserver.unobserve(entry.target);\n            }\n          });\n        }, {\n          rootMargin: '300px 0px'\n        });\n\n        lazyBgEls.forEach(function (el) {\n          if (el.getAttribute('data-bg')) {\n            bgObserver.observe(el);\n          }\n        });\n      } else {\n        lazyBgEls.forEach(loadCardBg);\n      }\n\n      function normalize(str) {\n        return (str || '').toString().toLowerCase().trim();\n      }\n\n      function parseRange(value) {\n        if (!value) return null;\n\n        value = value.trim();\n\n        if (value.endsWith('+')) {\n          const min = parseFloat(value.replace('+', ''));\n\n          if (isNaN(min)) return null;\n\n          return [min, Infinity];\n        }\n\n        const parts = value.split('-');\n\n        if (parts.length !== 2) return null;\n\n        const min = parseFloat(parts[0]);\n        const max = parseFloat(parts[1]);\n\n        if (isNaN(min) || isNaN(max)) return null;\n\n        return [min, max];\n      }\n\n      function openModal() {\n        if (!modal) return;\n\n        modal.classList.add('is-open');\n        modal.setAttribute('aria-hidden', 'false');\n        document.body.classList.add('hhh-modal-open');\n      }\n\n      function closeModal() {\n        if (!modal || !modalContent) return;\n\n        modal.classList.remove('is-open');\n        modal.setAttribute('aria-hidden', 'true');\n        document.body.classList.remove('hhh-modal-open');\n        modalContent.innerHTML = '<p>Loading trail guide...<\/p>';\n      }\n\n      function loadTrailGuide(trailId) {\n        if (!modalContent || !trailId) return;\n\n        openModal();\n\n        if (trailCache[trailId]) {\n          modalContent.innerHTML = trailCache[trailId];\n          return;\n        }\n\n        modalContent.innerHTML = '<p>Loading trail guide...<\/p>';\n\n        const formData = new FormData();\n        formData.append('action', 'hhh_fast_load_trail_guide');\n        formData.append('trail_id', trailId);\n        formData.append('nonce', ajaxNonce);\n\n        fetch(ajaxUrl, {\n          method: 'POST',\n          body: formData,\n          credentials: 'same-origin'\n        })\n        .then(function (response) {\n          return response.json();\n        })\n        .then(function (data) {\n          if (data && data.success && data.data && data.data.html) {\n            trailCache[trailId] = data.data.html;\n            modalContent.innerHTML = data.data.html;\n          } else {\n            modalContent.innerHTML = '<p>Sorry, this trail guide could not load.<\/p>';\n          }\n        })\n        .catch(function () {\n          modalContent.innerHTML = '<p>Sorry, this trail guide could not load.<\/p>';\n        });\n      }\n\n      \/* ---------- OPEN MODAL FROM BUTTON OR CARD ---------- *\/\n      document.addEventListener('click', function (e) {\n        const openBtn = e.target.closest('.hhh-open-trail');\n\n        if (openBtn) {\n          e.preventDefault();\n          e.stopPropagation();\n          loadTrailGuide(openBtn.getAttribute('data-trail-id'));\n          return;\n        }\n\n        const card = e.target.closest('.hhh-trail-card');\n\n        if (!card) return;\n\n        if (e.target.closest('a, button, input, select, textarea, label')) return;\n\n        const btn = card.querySelector('.hhh-open-trail');\n\n        if (btn) {\n          loadTrailGuide(btn.getAttribute('data-trail-id'));\n        }\n      });\n\n      document.addEventListener('keydown', function (e) {\n        const card = e.target.closest('.hhh-trail-card');\n\n        if (!card) return;\n        if (document.activeElement !== card) return;\n        if (e.key !== 'Enter' && e.key !== ' ') return;\n\n        e.preventDefault();\n\n        const btn = card.querySelector('.hhh-open-trail');\n\n        if (btn) {\n          loadTrailGuide(btn.getAttribute('data-trail-id'));\n        }\n      });\n\n      if (modalClose) {\n        modalClose.addEventListener('click', closeModal);\n      }\n\n      if (modalBackdrop) {\n        modalBackdrop.addEventListener('click', closeModal);\n      }\n\n      document.addEventListener('keydown', function (e) {\n        if (e.key === 'Escape') {\n          closeModal();\n        }\n      });\n\n      \/* ---------- LIGHTBOX GALLERY INSIDE AJAX MODAL ---------- *\/\n      document.addEventListener('click', function (e) {\n        const img = e.target.closest('.hhh-trail-gallery-img');\n\n        if (!img) return;\n\n        const fullUrl = img.getAttribute('data-full') || img.src;\n\n        const overlay = document.createElement('div');\n        overlay.className = 'hhh-image-overlay';\n\n        const inner = document.createElement('div');\n        inner.className = 'hhh-image-overlay-inner';\n\n        const close = document.createElement('span');\n        close.className = 'hhh-image-overlay-close';\n        close.innerHTML = '&times;';\n\n        const fullImg = document.createElement('img');\n        fullImg.src = fullUrl;\n        fullImg.alt = img.alt || '';\n\n        inner.appendChild(close);\n        inner.appendChild(fullImg);\n        overlay.appendChild(inner);\n        document.body.appendChild(overlay);\n\n        overlay.addEventListener('click', function (event) {\n          if (\n            event.target.classList.contains('hhh-image-overlay') ||\n            event.target.classList.contains('hhh-image-overlay-close')\n          ) {\n            document.body.removeChild(overlay);\n          }\n        });\n      });\n\n      \/* ---------- FILTERING + SORTING ---------- *\/\n      const searchInput     = document.getElementById('hhh-search-text');\n      const searchButton    = document.getElementById('hhh-search-button');\n      const distanceSelect  = document.getElementById('hhh-filter-distance');\n      const elevSelect      = document.getElementById('hhh-filter-elevation');\n      const timeSelect      = document.getElementById('hhh-filter-time');\n      const diffSelect      = document.getElementById('hhh-filter-difficulty');\n      const sortSelect      = document.getElementById('hhh-filter-sort');\n\n      function filterTrails() {\n        const query   = searchInput ? normalize(searchInput.value) : '';\n        const distRng = parseRange(distanceSelect ? distanceSelect.value : '');\n        const elevRng = parseRange(elevSelect ? elevSelect.value : '');\n        const timeRng = parseRange(timeSelect ? timeSelect.value : '');\n        const diffVal = normalize(diffSelect ? diffSelect.value : '');\n\n        cards.forEach(function (card) {\n          const cardSearch = normalize(card.dataset.search);\n          const cardDiff   = normalize(card.dataset.difficulty);\n          const cardDist   = parseFloat(card.dataset.distance || '0');\n          const cardElev   = parseFloat(card.dataset.elevation || '0');\n          const cardTime   = parseFloat(card.dataset.time || '0');\n\n          let visible = true;\n\n          if (query && (!cardSearch || !cardSearch.includes(query))) visible = false;\n          if (visible && diffVal && cardDiff !== diffVal) visible = false;\n\n          if (visible && distRng) {\n            if (cardDist < distRng[0] || cardDist > distRng[1]) visible = false;\n          }\n\n          if (visible && elevRng) {\n            if (cardElev < elevRng[0] || cardElev > elevRng[1]) visible = false;\n          }\n\n          if (visible && timeRng) {\n            if (cardTime < timeRng[0] || cardTime > timeRng[1]) visible = false;\n          }\n\n          card.style.display = visible ? '' : 'none';\n        });\n      }\n\n      function sortTrails() {\n        const value = sortSelect ? sortSelect.value : '';\n\n        if (!value || !grid) return;\n\n        const parts = value.split('-');\n        const field = parts[0];\n        const dir = parts[1];\n\n        const sorted = cards.slice().sort(function (a, b) {\n          const titleA = (a.dataset.title || '').toString();\n          const titleB = (b.dataset.title || '').toString();\n\n          const distA  = parseFloat(a.dataset.distance || '0');\n          const distB  = parseFloat(b.dataset.distance || '0');\n\n          const timeA  = parseFloat(a.dataset.time || '0');\n          const timeB  = parseFloat(b.dataset.time || '0');\n\n          const elevA  = parseFloat(a.dataset.elevation || '0');\n          const elevB  = parseFloat(b.dataset.elevation || '0');\n\n          const rankA  = parseFloat(a.dataset.diffrank || '0');\n          const rankB  = parseFloat(b.dataset.diffrank || '0');\n\n          const ratA   = parseFloat(a.dataset.ratingavg || '0');\n          const ratB   = parseFloat(b.dataset.ratingavg || '0');\n\n          const rcA    = parseFloat(a.dataset.ratingcount || '0');\n          const rcB    = parseFloat(b.dataset.ratingcount || '0');\n\n          let cmp = 0;\n\n          if (field === 'name') {\n            cmp = titleA.localeCompare(titleB, undefined, { sensitivity: 'base' });\n\n          } else if (field === 'distance') {\n            cmp = distA - distB;\n\n          } else if (field === 'time') {\n            cmp = timeA - timeB;\n\n          } else if (field === 'elev') {\n            cmp = elevA - elevB;\n\n          } else if (field === 'difficulty') {\n            cmp = rankA - rankB;\n\n          } else if (field === 'rating') {\n            cmp = ratA - ratB;\n\n            if (cmp === 0) {\n              cmp = rcA - rcB;\n            }\n          }\n\n          return dir === 'desc' ? -cmp : cmp;\n        });\n\n        sorted.forEach(function (card) {\n          grid.appendChild(card);\n        });\n      }\n\n      if (searchInput)    searchInput.addEventListener('input', filterTrails);\n      if (searchButton)   searchButton.addEventListener('click', filterTrails);\n      if (distanceSelect) distanceSelect.addEventListener('change', filterTrails);\n      if (elevSelect)     elevSelect.addEventListener('change', filterTrails);\n      if (timeSelect)     timeSelect.addEventListener('change', filterTrails);\n      if (diffSelect)     diffSelect.addEventListener('change', filterTrails);\n\n      if (sortSelect) {\n        sortSelect.addEventListener('change', function () {\n          sortTrails();\n          filterTrails();\n        });\n      }\n\n      filterTrails();\n    });\n  <\/script>\n\n  \t<section id=\"hhh-trails-unlock\" class=\"hhh-trails-unlock\" aria-labelledby=\"hhh-trails-unlock-title\">\n\t\t<div class=\"hhh-trails-unlock__ghosts\" aria-hidden=\"true\">\n\t\t\t<div class=\"hhh-trails-unlock__ghost hhh-trails-unlock__ghost--one\"><\/div>\n\t\t\t<div class=\"hhh-trails-unlock__ghost hhh-trails-unlock__ghost--two\"><\/div>\n\t\t\t<div class=\"hhh-trails-unlock__lock\">\n\t\t\t\t<svg viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n\t\t\t\t\t<path d=\"M7.5 10V7.75a4.5 4.5 0 0 1 9 0V10m-10 0h11a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2h-11a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2Zm5.5 4.25v2.5\" \/>\n\t\t\t\t<\/svg>\n\t\t\t<\/div>\n\t\t\t<span>36 rutas adicionales bloqueadas<\/span>\n\t\t<\/div>\n\n\t\t<div class=\"hhh-trails-unlock__content\">\n\t\t\t<div class=\"hhh-trails-unlock__topline\">\n\t\t\t\t<span class=\"hhh-trails-unlock__eyebrow\">BIBLIOTECA COMPLETA DE RUTAS<\/span>\n\t\t\t\t<span class=\"hhh-trails-unlock__price\"><b>$99<\/b> MXN <small>una vez<\/small><\/span>\n\t\t\t<\/div>\n\n\t\t\t<h2 id=\"hhh-trails-unlock-title\">Todas las rutas. Un solo pago.<\/h2>\n\t\t\t<p class=\"hhh-trails-unlock__copy\">Desbloquea cada gu\u00eda completa, mapa, dificultad, desnivel, c\u00f3mo llegar, consejos de seguridad y todas las rutas nuevas que agreguemos.<\/p>\n\n\t\t\t<ul class=\"hhh-trails-unlock__features\">\n\t\t\t\t<li>\n\t\t\t\t\t<svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"m5 12 4 4L19 6\" \/><\/svg>\n\t\t\t\t\tAcceso de por vida\t\t\t\t<\/li>\n\t\t\t\t<li>\n\t\t\t\t\t<svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"m5 12 4 4L19 6\" \/><\/svg>\n\t\t\t\t\tTodas las gu\u00edas actuales\t\t\t\t<\/li>\n\t\t\t\t<li>\n\t\t\t\t\t<svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"m5 12 4 4L19 6\" \/><\/svg>\n\t\t\t\t\tNuevas rutas incluidas\t\t\t\t<\/li>\n\t\t\t<\/ul>\n\n\t\t\t<a class=\"hhh-trails-unlock__button\" href=\"https:\/\/henryhateshiking.com\/es\/checkout\/?add-to-cart=4485&#038;quantity=1\">\n\t\t\t\t<span>Desbloquear todas las rutas \u2014 $99 MXN<\/span>\n\t\t\t\t<svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M5 12h14m-5-5 5 5-5 5\" \/><\/svg>\n\t\t\t<\/a>\n\t\t\t<p class=\"hhh-trails-unlock__payment\">Pago seguro con Stripe \u00b7 Acceso inmediato<\/p>\n\t\t\t<a class=\"hhh-trails-unlock__login\" href=\"https:\/\/henryhateshiking.com\/es\/account\/?redirect=https:\/\/henryhateshiking.com\/es\/trails\/\">\u00bfYa compraste? Inicia sesi\u00f3n<\/a>\n\t\t<\/div>\n\t<\/section>\n\n\t<style id=\"hhh-trails-access-styles\">\n\t\t.hhh-trails-unlock,\n\t\t.hhh-trails-unlock * {\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t.hhh-trails-unlock {\n\t\t\t--hhh-gate-ink: #12261e;\n\t\t\t--hhh-gate-green: #173d30;\n\t\t\t--hhh-gate-green-deep: #0d2e25;\n\t\t\t--hhh-gate-mint: #7ff0d2;\n\t\t\t--hhh-gate-orange: #ee6f2d;\n\t\t\tposition: relative;\n\t\t\tisolation: isolate;\n\t\t\tdisplay: grid;\n\t\t\tgrid-template-columns: minmax(280px, .78fr) minmax(0, 1.22fr);\n\t\t\twidth: min(1120px, calc(100% - 32px));\n\t\t\tmargin: 14px auto 64px;\n\t\t\toverflow: hidden;\n\t\t\tborder: 1px solid rgba(18, 38, 30, .12);\n\t\t\tborder-radius: 32px;\n\t\t\tbackground: #fffdf8;\n\t\t\tbox-shadow: 0 30px 80px rgba(18, 38, 30, .17);\n\t\t\tcolor: var(--hhh-gate-ink);\n\t\t}\n\n\t\t.hhh-trails-unlock::after {\n\t\t\tcontent: \"\";\n\t\t\tposition: absolute;\n\t\t\tz-index: -1;\n\t\t\tinset: auto -12% -55% 38%;\n\t\t\theight: 340px;\n\t\t\tbackground: radial-gradient(circle, rgba(127, 240, 210, .22), transparent 68%);\n\t\t\tpointer-events: none;\n\t\t}\n\n\t\t.hhh-trails-unlock__ghosts {\n\t\t\tposition: relative;\n\t\t\tmin-height: 510px;\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t\tpadding: 42px 28px;\n\t\t\toverflow: hidden;\n\t\t\tbackground:\n\t\t\t\tlinear-gradient(155deg, rgba(255, 255, 255, .08), transparent 46%),\n\t\t\t\trepeating-linear-gradient(135deg, rgba(255, 255, 255, .035) 0, rgba(255, 255, 255, .035) 1px, transparent 1px, transparent 13px),\n\t\t\t\tlinear-gradient(145deg, var(--hhh-gate-green), var(--hhh-gate-green-deep));\n\t\t\tcolor: #fff;\n\t\t}\n\n\t\t.hhh-trails-unlock__ghost {\n\t\t\tposition: absolute;\n\t\t\twidth: 72%;\n\t\t\theight: 280px;\n\t\t\tborder: 1px solid rgba(255, 255, 255, .16);\n\t\t\tborder-radius: 24px;\n\t\t\tbackground:\n\t\t\t\tlinear-gradient(180deg, rgba(255, 255, 255, .18) 0 44%, rgba(255, 255, 255, .08) 44% 100%);\n\t\t\tbox-shadow: 0 24px 50px rgba(0, 0, 0, .24);\n\t\t}\n\n\t\t.hhh-trails-unlock__ghost::before,\n\t\t.hhh-trails-unlock__ghost::after {\n\t\t\tcontent: \"\";\n\t\t\tposition: absolute;\n\t\t\tleft: 18px;\n\t\t\tright: 18px;\n\t\t\theight: 10px;\n\t\t\tborder-radius: 999px;\n\t\t\tbackground: rgba(255, 255, 255, .16);\n\t\t}\n\n\t\t.hhh-trails-unlock__ghost::before {\n\t\t\ttop: 154px;\n\t\t\tright: 32%;\n\t\t}\n\n\t\t.hhh-trails-unlock__ghost::after {\n\t\t\ttop: 180px;\n\t\t\tright: 48%;\n\t\t}\n\n\t\t.hhh-trails-unlock__ghost--one {\n\t\t\ttransform: translate(-38px, -20px) rotate(-8deg);\n\t\t\topacity: .48;\n\t\t}\n\n\t\t.hhh-trails-unlock__ghost--two {\n\t\t\ttransform: translate(38px, 20px) rotate(8deg);\n\t\t\topacity: .7;\n\t\t}\n\n\t\t.hhh-trails-unlock__lock {\n\t\t\tposition: relative;\n\t\t\tz-index: 2;\n\t\t\tdisplay: grid;\n\t\t\tplace-items: center;\n\t\t\twidth: 88px;\n\t\t\theight: 88px;\n\t\t\tborder: 1px solid rgba(255, 255, 255, .72);\n\t\t\tborder-radius: 50%;\n\t\t\tbackground: var(--hhh-gate-mint);\n\t\t\tcolor: var(--hhh-gate-green-deep);\n\t\t\tbox-shadow: 0 22px 45px rgba(0, 0, 0, .34);\n\t\t}\n\n\t\t.hhh-trails-unlock__lock svg {\n\t\t\twidth: 39px;\n\t\t\theight: 39px;\n\t\t\tfill: none;\n\t\t\tstroke: currentColor;\n\t\t\tstroke-width: 1.8;\n\t\t\tstroke-linecap: round;\n\t\t\tstroke-linejoin: round;\n\t\t}\n\n\t\t.hhh-trails-unlock__ghosts > span {\n\t\t\tposition: relative;\n\t\t\tz-index: 2;\n\t\t\tmargin-top: 26px;\n\t\t\tpadding: 9px 13px;\n\t\t\tborder: 1px solid rgba(255, 255, 255, .16);\n\t\t\tborder-radius: 999px;\n\t\t\tbackground: rgba(10, 34, 26, .72);\n\t\t\tcolor: rgba(255, 255, 255, .9);\n\t\t\tfont-size: 12px;\n\t\t\tfont-weight: 900;\n\t\t\tletter-spacing: .055em;\n\t\t\ttext-align: center;\n\t\t\ttext-transform: uppercase;\n\t\t\tbackdrop-filter: blur(9px);\n\t\t}\n\n\t\t.hhh-trails-unlock__content {\n\t\t\tpadding: clamp(34px, 5vw, 64px);\n\t\t\talign-self: center;\n\t\t}\n\n\t\t.hhh-trails-unlock__topline {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: space-between;\n\t\t\tgap: 20px;\n\t\t\tmargin-bottom: 24px;\n\t\t}\n\n\t\t.hhh-trails-unlock__eyebrow {\n\t\t\tcolor: var(--hhh-gate-orange);\n\t\t\tfont-size: 12px;\n\t\t\tfont-weight: 950;\n\t\t\tletter-spacing: .14em;\n\t\t\tline-height: 1.35;\n\t\t\ttext-transform: uppercase;\n\t\t}\n\n\t\t.hhh-trails-unlock__price {\n\t\t\tflex: 0 0 auto;\n\t\t\tdisplay: inline-flex;\n\t\t\talign-items: baseline;\n\t\t\tgap: 4px;\n\t\t\tpadding: 9px 12px;\n\t\t\tborder-radius: 14px;\n\t\t\tbackground: #eef9f4;\n\t\t\tcolor: var(--hhh-gate-green);\n\t\t\tfont-size: 12px;\n\t\t\tfont-weight: 900;\n\t\t\twhite-space: nowrap;\n\t\t}\n\n\t\t.hhh-trails-unlock__price b {\n\t\t\tfont-size: 22px;\n\t\t\tletter-spacing: -.04em;\n\t\t}\n\n\t\t.hhh-trails-unlock__price small {\n\t\t\tmargin-left: 2px;\n\t\t\tcolor: #64786f;\n\t\t\tfont-size: 9px;\n\t\t\tletter-spacing: .08em;\n\t\t\ttext-transform: uppercase;\n\t\t}\n\n\t\t.hhh-trails-unlock h2 {\n\t\t\tmax-width: 690px;\n\t\t\tmargin: 0 !important;\n\t\t\tcolor: var(--hhh-gate-ink) !important;\n\t\t\tfont-family: inherit !important;\n\t\t\tfont-size: clamp(42px, 5.2vw, 68px) !important;\n\t\t\tfont-weight: 950 !important;\n\t\t\tletter-spacing: -.055em !important;\n\t\t\tline-height: .94 !important;\n\t\t\ttext-transform: none !important;\n\t\t}\n\n\t\t.hhh-trails-unlock__copy {\n\t\t\tmax-width: 660px;\n\t\t\tmargin: 24px 0 0 !important;\n\t\t\tcolor: #53655d;\n\t\t\tfont-size: clamp(16px, 1.6vw, 19px);\n\t\t\tfont-weight: 650;\n\t\t\tline-height: 1.58;\n\t\t}\n\n\t\t.hhh-trails-unlock__features {\n\t\t\tdisplay: grid;\n\t\t\tgrid-template-columns: repeat(3, minmax(0, 1fr));\n\t\t\tgap: 10px;\n\t\t\tmargin: 25px 0 29px !important;\n\t\t\tpadding: 0 !important;\n\t\t\tlist-style: none !important;\n\t\t}\n\n\t\t.hhh-trails-unlock__features li {\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tgap: 8px;\n\t\t\tmargin: 0 !important;\n\t\t\tcolor: #31473d;\n\t\t\tfont-size: 12px;\n\t\t\tfont-weight: 850;\n\t\t\tline-height: 1.35;\n\t\t}\n\n\t\t.hhh-trails-unlock__features svg {\n\t\t\tflex: 0 0 24px;\n\t\t\twidth: 24px;\n\t\t\theight: 24px;\n\t\t\tpadding: 5px;\n\t\t\tborder-radius: 50%;\n\t\t\tbackground: #dff9ee;\n\t\t\tfill: none;\n\t\t\tstroke: #1f6658;\n\t\t\tstroke-width: 2.4;\n\t\t\tstroke-linecap: round;\n\t\t\tstroke-linejoin: round;\n\t\t}\n\n\t\t.hhh-trails-unlock__button {\n\t\t\tdisplay: flex !important;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t\tgap: 12px;\n\t\t\twidth: 100%;\n\t\t\tmin-height: 60px;\n\t\t\tpadding: 15px 20px;\n\t\t\tborder-radius: 999px;\n\t\t\tbackground: var(--hhh-gate-orange);\n\t\t\tcolor: #fff !important;\n\t\t\tfont-size: 14px;\n\t\t\tfont-weight: 950;\n\t\t\tletter-spacing: .015em;\n\t\t\ttext-align: center;\n\t\t\ttext-decoration: none !important;\n\t\t\tbox-shadow: 0 18px 38px rgba(238, 111, 45, .28);\n\t\t\ttransition: transform .18s ease, box-shadow .18s ease, background .18s ease;\n\t\t}\n\n\t\t.hhh-trails-unlock__button:hover {\n\t\t\ttransform: translateY(-2px);\n\t\t\tbackground: #cf5923;\n\t\t\tcolor: #fff !important;\n\t\t\tbox-shadow: 0 23px 45px rgba(238, 111, 45, .36);\n\t\t}\n\n\t\t.hhh-trails-unlock__button svg {\n\t\t\twidth: 20px;\n\t\t\theight: 20px;\n\t\t\tfill: none;\n\t\t\tstroke: currentColor;\n\t\t\tstroke-width: 2;\n\t\t\tstroke-linecap: round;\n\t\t\tstroke-linejoin: round;\n\t\t\ttransition: transform .18s ease;\n\t\t}\n\n\t\t.hhh-trails-unlock__button:hover svg {\n\t\t\ttransform: translateX(3px);\n\t\t}\n\n\t\t.hhh-trails-unlock__payment {\n\t\t\tmargin: 12px 0 0 !important;\n\t\t\tcolor: #7a8a82;\n\t\t\tfont-size: 11px;\n\t\t\tfont-weight: 750;\n\t\t\ttext-align: center;\n\t\t}\n\n\t\t.hhh-trails-unlock__login {\n\t\t\tdisplay: block;\n\t\t\twidth: fit-content;\n\t\t\tmargin: 18px auto 0;\n\t\t\tcolor: var(--hhh-gate-green) !important;\n\t\t\tfont-size: 12px;\n\t\t\tfont-weight: 850;\n\t\t\ttext-decoration: underline !important;\n\t\t\ttext-underline-offset: 3px;\n\t\t}\n\n\t\t.hhh-trails-access-success {\n\t\t\twidth: min(1120px, calc(100% - 32px));\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tjustify-content: center;\n\t\t\tgap: 10px 18px;\n\t\t\tmargin: 18px auto 26px;\n\t\t\tpadding: 14px 18px;\n\t\t\tborder: 1px solid #a8e6cd;\n\t\t\tborder-radius: 16px;\n\t\t\tbackground: #e8fbf3;\n\t\t\tcolor: #123d30;\n\t\t\tfont-size: 13px;\n\t\t\ttext-align: center;\n\t\t\tbox-shadow: 0 12px 30px rgba(18, 61, 48, .09);\n\t\t}\n\n\t\t.hhh-trails-access-success strong {\n\t\t\tfont-weight: 950;\n\t\t}\n\n\t\t.hhh-trails-access-success span {\n\t\t\tcolor: #42675a;\n\t\t\tfont-weight: 700;\n\t\t}\n\n\t\t@media (max-width: 820px) {\n\t\t\t.hhh-trails-unlock {\n\t\t\t\tgrid-template-columns: 1fr;\n\t\t\t\tborder-radius: 27px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__ghosts {\n\t\t\t\tmin-height: 270px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__ghost {\n\t\t\t\twidth: min(260px, 70%);\n\t\t\t\theight: 210px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__ghost::before {\n\t\t\t\ttop: 121px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__ghost::after {\n\t\t\t\ttop: 145px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__content {\n\t\t\t\tpadding: 36px 28px 40px;\n\t\t\t}\n\t\t}\n\n\t\t@media (max-width: 560px) {\n\t\t\t.hhh-trails-unlock {\n\t\t\t\twidth: min(100% - 24px, 1120px);\n\t\t\t\tmargin-bottom: 46px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__ghosts {\n\t\t\t\tmin-height: 235px;\n\t\t\t\tpadding: 28px 18px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__lock {\n\t\t\t\twidth: 72px;\n\t\t\t\theight: 72px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__lock svg {\n\t\t\t\twidth: 32px;\n\t\t\t\theight: 32px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__ghosts > span {\n\t\t\t\tmax-width: calc(100% - 28px);\n\t\t\t\tmargin-top: 18px;\n\t\t\t\tfont-size: 10px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__content {\n\t\t\t\tpadding: 30px 20px 34px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__topline {\n\t\t\t\talign-items: flex-start;\n\t\t\t\tmargin-bottom: 20px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__eyebrow {\n\t\t\t\tfont-size: 10px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock h2 {\n\t\t\t\tfont-size: 42px !important;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__copy {\n\t\t\t\tmargin-top: 18px !important;\n\t\t\t\tfont-size: 16px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__features {\n\t\t\t\tgrid-template-columns: 1fr;\n\t\t\t\tgap: 11px;\n\t\t\t\tmargin: 22px 0 25px !important;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__features li {\n\t\t\t\tfont-size: 13px;\n\t\t\t}\n\n\t\t\t.hhh-trails-unlock__button {\n\t\t\t\tmin-height: 58px;\n\t\t\t\tpadding-inline: 16px;\n\t\t\t\tfont-size: 13px;\n\t\t\t}\n\n\t\t\t.hhh-trails-access-success {\n\t\t\t\tdisplay: block;\n\t\t\t\twidth: min(100% - 24px, 1120px);\n\t\t\t}\n\n\t\t\t.hhh-trails-access-success span {\n\t\t\t\tdisplay: block;\n\t\t\t\tmargin-top: 4px;\n\t\t\t}\n\t\t}\n\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\t.hhh-trails-unlock__button,\n\t\t\t.hhh-trails-unlock__button svg {\n\t\t\t\ttransition: none;\n\t\t\t}\n\t\t}\n\t<\/style>\n\t\n\n\n\n<style>\n\/* Force 3 cards per row on desktop for the Trails grid *\/\n@media (min-width: 1024px) {\n  #hhh-trails-grid {\n    display: grid !important;\n    grid-auto-flow: row !important;\n    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;\n    gap: 24px !important;\n  }\n\n  #hhh-trails-grid .hhh-trail-card {\n    width: auto !important;\n  }\n}\n\n\/* Tablet: 2 cards per row *\/\n@media (min-width: 700px) and (max-width: 1023px) {\n  #hhh-trails-grid {\n    display: grid !important;\n    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;\n    gap: 24px !important;\n  }\n\n  #hhh-trails-grid .hhh-trail-card {\n    width: auto !important;\n  }\n}\n\n\/* Mobile stays 1 card per row (no change) *\/\n<\/style>\n","protected":false},"excerpt":{"rendered":"<p>Trail guides Hiking routes in Monterrey Find complete hiking guides for trails such as Cerro de la Silla, Pico Norte, Pico Sur, Chipinque, La Huasteca, Cerro de las Mitras and waterfalls near Monterrey. Presented by Trail finder Find your hike Search by trail name, location, distance, elevation, time, or difficulty. Search Distance Any0\u20134 km4\u20138 km8\u201312 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"om_disable_all_campaigns":false,"_uag_custom_page_level_css":"","_monsterinsights_skip_tracking":false,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1644","page","type-page","status-publish","hentry"],"acf":[],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false,"woocommerce_thumbnail":false,"woocommerce_single":false,"woocommerce_gallery_thumbnail":false},"uagb_author_info":{"display_name":"Henry Hates Hiking","author_link":"https:\/\/henryhateshiking.com\/es\/author\/hhenryarthurgmail-com\/"},"uagb_comment_info":0,"uagb_excerpt":"Trail guides Hiking routes in Monterrey Find complete hiking guides for trails such as Cerro de la Silla, Pico Norte, Pico Sur, Chipinque, La Huasteca, Cerro de las Mitras and waterfalls near Monterrey. Presented by Trail finder Find your hike Search by trail name, location, distance, elevation, time, or difficulty. Search Distance Any0\u20134 km4\u20138 km8\u201312&hellip;","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/henryhateshiking.com\/es\/wp-json\/wp\/v2\/pages\/1644","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/henryhateshiking.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/henryhateshiking.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/henryhateshiking.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/henryhateshiking.com\/es\/wp-json\/wp\/v2\/comments?post=1644"}],"version-history":[{"count":152,"href":"https:\/\/henryhateshiking.com\/es\/wp-json\/wp\/v2\/pages\/1644\/revisions"}],"predecessor-version":[{"id":4380,"href":"https:\/\/henryhateshiking.com\/es\/wp-json\/wp\/v2\/pages\/1644\/revisions\/4380"}],"wp:attachment":[{"href":"https:\/\/henryhateshiking.com\/es\/wp-json\/wp\/v2\/media?parent=1644"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}