:root {
	/* Lock heading display font to Pronghorn's geometric-humanist default;
	   prevents future Pronghorn token-default changes from silently moving towmads. */
	--pr-heading-font-display: var(--wp--preset--font-family--geometric-humanist);
}

header {
  & > div {
    background-image: url(../images/Devils-Punchbowl-Title-BG.webp);
    background-size: cover;
  }
}


.wp-block-pronghorn-post-meta {
	color: var(--wp--preset--color--highlightbackground-contrast);
  background-color: var(--wp--preset--color--highlightbackground);
}

footer {
  p.about-site mark {
    --towmads-background-tape: url("data:image/svg+xml,%3Csvg width='69' height='30' viewBox='0 0 69 30' fill='%23f2f1ea' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2_8)'%3E%3Cpath d='M0.600001 1L-1.3 3.3L7.15256e-07 5.8L0.300001 7.6L0.900001 8.7L2.4 10.5L1.9 10.8L2.4 11.9V12.8L2.1 13.8L1.3 14.7L1.9 15.8L2.4 16.8L2 17.5L1.5 18.1L0.200001 20.2L1.4 21.5L2.2 24.1L1.4 25.4L0.500001 27.4V27.8L1.2 28.3L2.1 28.5L2.9 29H12.8V1H0.600001Z'/%3E%3C/g%3E%3Cpath d='M65 1L65.2 2.1L65.6 2.9V3.3L65.8 3.7V4.3L66 5V5.7V6.3L65.5 6.7L65.8 7.3L66 7.8L66.6 8.3V8.6L66.5 8.9L66.6 9.9V10.5L67.4 11.6L67.1 12L67.4 12.2L66.8 12.8L66.4 13.5L66.6 13.7H66.9L67 13.9L66.5 15.1L65.8 16L64.1 17.7L64.7 18.2L64.3 19L64.7 19.8L64.6 20.6L64.7 21.5L64.6 21.9V22.3L65.1 22.8L64.6 23.6L64.7 24V24.2L64.9 24.4L64.5 24.7L64.3 25.4V25.9L63.8 26.2L63.5 27.1L63.8 27.8L64.4 28.6L62.8 29H55.9V1H65Z'/%3E%3Cg clip-path='url(%23clip1_2_8)'%3E%3Crect x='12' y='1' width='44' height='28'/%3E%3C/g%3E%3C/svg%3E%0A");

    -webkit-mask-image: var(--towmads-background-tape);
    mask-image: var(--towmads-background-tape);
    -webkit-mask-size: 100%;
    mask-size: 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;

    padding: 4px 18px 3px 10px;
    display: inline-block;
    margin-left: 5px;
    margin-right: -5px;

    a {
      /* text-decoration: none; */
      text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);
      transition: text-decoration-color 300ms;

      &:hover {
        /* text-decoration: underline; */
        text-decoration-color: currentColor;
      }
    }
  }

  .newsletter-signup {
    font-weight: 400;
    margin: 0;

    input:not([type=submit]){

      /* from comment form */
      /* border: 1px solid #949494;
      font-family: inherit;
      font-size: 1em;
      padding: calc(.667em + 2px);

      box-sizing: border-box;
      display: block;
      width: 100%; */

      /* from old site; */

    
      margin: 0;

      padding-block: 1px;
      padding-inline: 2px;

      position: relative;
      width: 100%;
      padding: 12px 16px;
      font-size: var(--wp--preset--font-size--medium);

      /* line-height: calc(50px -(24px - 2px)); */
      background-color: transparent;
      border: 1px solid #e1e1e1;
      border-radius: 0;
      outline: 0;
      /* cursor: text; */


      /* -webkit-appearance: none; */

      /* -webkit-box-sizing: border-box;
      box-sizing: border-box; */


      /* -webkit-transition: border-color .2s ease-in-out;
      -o-transition: border-color .2s ease-in-out; */
      transition: border-color .2s ease-in-out;


      border-top: none;
      border-right: none;
      max-width: 222px;
      padding-left: 20px;
      color: #fff;

      /* #respond input:focus[type=text],#respond textarea:focus,.mkdf-style-form textarea:focus,.wpcf7-form-control.wpcf7-date:focus,.wpcf7-form-control.wpcf7-number:focus,.wpcf7-form-control.wpcf7-quiz:focus,.wpcf7-form-control.wpcf7-select:focus,.wpcf7-form-control.wpcf7-text:focus,.wpcf7-form-control.wpcf7-textarea:focus,input:focus[type=email],input:focus[type=password],input:focus[type=text] {
        color: #1e1e1e;
        border-color: #878787
    } */

      &:focus {
        border-color: #878787;
      }

      &::placeholder {
        color: #ccc;
        font-style: italic;
        font-size: var(--wp--preset--font-size--small);
      }

    }

    .footer-newsletter-button {

      --towmads-arrow-icon: url("data:image/svg+xml,%0A%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='15px' height='15px' x='0px' y='0px' viewBox='0 0 17 17' style='enable-background:new 0 0 17 17;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23FFFFFF;stroke-width:2;stroke-miterlimit:10;%7D%0A%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M15,1.9'/%3E%3Cline class='st0' x1='1.7' y1='15.3' x2='15' y2='1.9'/%3E%3Cline class='st0' x1='16' y1='1.9' x2='15' y2='1.9'/%3E%3Cline class='st0' x1='15' y1='1.9' x2='1' y2='1.9'/%3E%3Cpath class='st0' d='M15,1.9'/%3E%3Cline class='st0' x1='15' y1='16' x2='15' y2='1.9'/%3E%3C/g%3E%3C/svg%3E%0A");

      position: relative;
      display: inline-block;
      vertical-align: middle;
      width: auto;
      margin: 0;
      font-family: sans-serif;
      font-size: 16px;
      line-height: 2em;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0;
      outline: 0;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      -webkit-transition: color .2s ease-in-out,background-color .2s ease-in-out,border-color .2s ease-in-out;
      -o-transition: color .2s ease-in-out,background-color .2s ease-in-out,border-color .2s ease-in-out;
      transition: color .2s ease-in-out,background-color .2s ease-in-out,border-color .2s ease-in-out;
      padding: 10px 40px;
      cursor: pointer;



      color: #fff;
      background-color: #59815b;
      border: 1px solid transparent;


      position: relative;
      background-color: transparent;
      padding: 0;
      color: #fff;
      margin-top: 10px;
      overflow: hidden;


      /* width:100%; */
      text-align: left;



      &::before {
        /* content: url(../images/arrow_light.svg); */
        content: var(--towmads-arrow-icon);
        vertical-align: top;
        margin-left: 9px;
        display: inline-block;
        position: absolute;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transition: .3s;
        -o-transition: .3s;
        transition: .3s;
        left: -37%;
      }

      &::after {
        /* content: url(../images/arrow_light.svg); */
        content: var(--towmads-arrow-icon);
        position: absolute;
        vertical-align: top;
        margin-left: 9px;
        display: inline-block;
        -webkit-transform: rotate(0);
        -ms-transform: rotate(0);
        transform: rotate(0);
        -webkit-transition: .3s;
        -o-transition: .3s;
        transition: .3s;
        position: absolute;
        right: 0;
      }


      span {
        display: inline-block;
        -webkit-transition: .3s;
        -o-transition: .3s;
        transition: .3s;
        padding-right: 20px;
      }


      &:hover {
        background-color: transparent;
      }
      
      &:hover span {
          -webkit-transform: translateX(18px);
          -ms-transform: translateX(18px);
          transform: translateX(18px);
          opacity: .1;
          -webkit-transition: .3s .2s;
          -o-transition: .3s .2s;
          transition: .3s .2s
      }
      
      
      &:hover::before {
          left: 37%;
          -webkit-transition: .3s .2s;
          -o-transition: .3s .2s;
          transition: .3s .2s
      }
      
      &:hover::after {
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
        right: -24px;
        -webkit-transition: right .3s .2s,-webkit-transform .3s;
        transition: right .3s .2s,-webkit-transform .3s;
        -o-transition: right .3s .2s,transform .3s;
        transition: right .3s .2s,transform .3s;
        transition: right .3s .2s,transform .3s,-webkit-transform .3s
      }
    }
  }

  .wp-block-latest-posts__list {
    
    margin-top: var(--wp--preset--spacing--20);

    li {
      margin-bottom: var(--wp--preset--spacing--30);

      .wp-block-latest-posts__post-title {
        font-weight: 500;
        /* text-decoration: none; */
        /* text-decoration: underline 0.15em rgba(255, 255, 255, 0); */
        text-decoration: underline;
        text-decoration-thickness: 0.10em;
        /* text-decoration-color: rgba(255, 255, 255, 0); */
        text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);
        transition: text-decoration-color 300ms;

        &:visited {
          color: var(--wp--preset--color--secondary);
        }

        &:hover {
          text-decoration-color: currentColor;
          /* text-decoration-color: color-mix(in srgb, currentColor 100%, transparent); */
          
        }

        
      }

      .wp-block-latest-posts__post-date {
        display: flex;
        align-items: center;
        margin-left: 3px;
        margin-top: 2px;
        font-style: italic;

        &::before {
          content: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' d='M26 4h-4V2h-2v2h-8V2h-2v2H6c-1.1 0-2 .9-2 2v20c0 1.1.9 2 2 2h20c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2m0 22H6V12h20zm0-16H6V6h4v2h2V6h8v2h2V6h4z'/%3E%3C/svg%3E ");
          height: 18px;
          margin-right: 3px;
        }
      }
    }
  }

  .wp-block-heading {
    color: #fff;
  }

  .heading-has-icon {
    display: flex;
    align-items: center;

    &::before {
      margin-right: 5px;
      height: 1.5rem;
    }
  }

  .footer-recent-posts-heading {
    &::before {
      content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 32 32'%3E%3Cpath fill='white' d='M28.828 3.172a4.094 4.094 0 0 0-5.656 0L4.05 22.292A6.954 6.954 0 0 0 2 27.242V30h2.756a6.952 6.952 0 0 0 4.95-2.05L28.828 8.829a3.999 3.999 0 0 0 0-5.657M10.91 18.26l2.829 2.829l-2.122 2.121l-2.828-2.828Zm-2.619 8.276A4.967 4.967 0 0 1 4.756 28H4v-.759a4.967 4.967 0 0 1 1.464-3.535l1.91-1.91l2.829 2.828ZM27.415 7.414l-12.261 12.26l-2.829-2.828l12.262-12.26a2.047 2.047 0 0 1 2.828 0a2 2 0 0 1 0 2.828'/%3E%3C/svg%3E");
    }
  }

  .footer-newsletter-heading {
    &::before {
      content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 32 32'%3E%3Cpath fill='white' d='M28 6H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h24a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2m-2.2 2L16 14.78L6.2 8ZM4 24V8.91l11.43 7.91a1 1 0 0 0 1.14 0L28 8.91V24Z'/%3E%3C/svg%3E");
    }
  }

  .footer-instagram-feed-heading {
    &::before {
      content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 32 32'%3E%3Ccircle cx='22.406' cy='9.594' r='1.44' fill='white'/%3E%3Cpath fill='white' d='M16 9.838A6.162 6.162 0 1 0 22.162 16A6.162 6.162 0 0 0 16 9.838M16 20a4 4 0 1 1 4-4a4 4 0 0 1-4 4'/%3E%3Cpath fill='white' d='M16 6.162c3.204 0 3.584.012 4.849.07a6.642 6.642 0 0 1 2.228.413a3.975 3.975 0 0 1 2.278 2.278a6.642 6.642 0 0 1 .413 2.228c.058 1.265.07 1.645.07 4.85s-.012 3.583-.07 4.848a6.642 6.642 0 0 1-.413 2.228a3.975 3.975 0 0 1-2.278 2.278a6.642 6.642 0 0 1-2.228.413c-1.265.058-1.645.07-4.849.07s-3.584-.012-4.849-.07a6.642 6.642 0 0 1-2.228-.413a3.975 3.975 0 0 1-2.278-2.278a6.642 6.642 0 0 1-.413-2.228c-.058-1.265-.07-1.645-.07-4.849s.012-3.584.07-4.849a6.642 6.642 0 0 1 .413-2.228a3.975 3.975 0 0 1 2.278-2.278a6.642 6.642 0 0 1 2.228-.413c1.265-.058 1.645-.07 4.849-.07M16 4c-3.259 0-3.668.014-4.948.072a8.807 8.807 0 0 0-2.912.558a6.136 6.136 0 0 0-3.51 3.51a8.807 8.807 0 0 0-.558 2.913C4.014 12.333 4 12.74 4 16s.014 3.668.072 4.948a8.807 8.807 0 0 0 .558 2.912a6.136 6.136 0 0 0 3.51 3.51a8.807 8.807 0 0 0 2.913.558c1.28.058 1.688.072 4.947.072s3.668-.014 4.948-.072a8.807 8.807 0 0 0 2.913-.558a6.136 6.136 0 0 0 3.51-3.51a8.807 8.807 0 0 0 .557-2.913C27.986 19.667 28 19.26 28 16s-.014-3.668-.072-4.948a8.807 8.807 0 0 0-.558-2.912a6.136 6.136 0 0 0-3.51-3.51a8.807 8.807 0 0 0-2.913-.557C19.667 4.013 19.26 4 16 4'/%3E%3C/svg%3E");
    }
  }
}

@media ( max-width: 550px ) {
  div.wp-block-group.wp-container-core-group-layout-23.footer-bottom {
    justify-content: center;
  }
}

/* classes for adding the painted edge effect */
.towmads-has-painted-edge {
  position: relative;
  /* &::after {
    content: " ";
    background-image: url(../images/painted_edge.webp);
    position: absolute;
    bottom: 0;
    width: 100vw;
    height: 20px;
  } */
}

.towmads-painted-bottom {
  width: 100vw;
  margin-block-start: 0;
  /* background-color: red; */
  position: absolute;
  bottom: 0;
  /* display: none; */

  img {
    width: 100vw;
  }
}

.towmads-painted-top {
  width: 100vw;
  margin-block-start: 0;
  /* background-color: red; */
  position: absolute;
  top: 0;
  transform: rotate(180deg);
  /* display: none; */

  img {
    width: 100vw;
  }
}


@keyframes fade-in {
  0% {
    opacity: 0.3;
    
  }
  100% {
    opacity: 1;
  }
}

.towmads-map-background {
  background-image: url(../images/map_background.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* styling for front page and about-us */
.home,
.page-id-1200 {
  --towmads-background-tape:       url("data:image/svg+xml,%3Csvg width='69' height='30' preserveAspectRatio='none' viewBox='0 0 69 30' fill='%23f2f1ea' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2_8)'%3E%3Cpath d='M0.600001 1L-1.3 3.3L7.15256e-07 5.8L0.300001 7.6L0.900001 8.7L2.4 10.5L1.9 10.8L2.4 11.9V12.8L2.1 13.8L1.3 14.7L1.9 15.8L2.4 16.8L2 17.5L1.5 18.1L0.200001 20.2L1.4 21.5L2.2 24.1L1.4 25.4L0.500001 27.4V27.8L1.2 28.3L2.1 28.5L2.9 29H12.8V1H0.600001Z'/%3E%3C/g%3E%3Cpath d='M65 1L65.2 2.1L65.6 2.9V3.3L65.8 3.7V4.3L66 5V5.7V6.3L65.5 6.7L65.8 7.3L66 7.8L66.6 8.3V8.6L66.5 8.9L66.6 9.9V10.5L67.4 11.6L67.1 12L67.4 12.2L66.8 12.8L66.4 13.5L66.6 13.7H66.9L67 13.9L66.5 15.1L65.8 16L64.1 17.7L64.7 18.2L64.3 19L64.7 19.8L64.6 20.6L64.7 21.5L64.6 21.9V22.3L65.1 22.8L64.6 23.6L64.7 24V24.2L64.9 24.4L64.5 24.7L64.3 25.4V25.9L63.8 26.2L63.5 27.1L63.8 27.8L64.4 28.6L62.8 29H55.9V1H65Z'/%3E%3Cg clip-path='url(%23clip1_2_8)'%3E%3Crect x='12' y='1' width='44' height='28'/%3E%3C/g%3E%3C/svg%3E");
  --towmads-background-tape-light: url("data:image/svg+xml,%3Csvg width='69' height='30' preserveAspectRatio='none' viewBox='0 0 69 30' fill='%23ffffff' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2_8)'%3E%3Cpath d='M0.600001 1L-1.3 3.3L7.15256e-07 5.8L0.300001 7.6L0.900001 8.7L2.4 10.5L1.9 10.8L2.4 11.9V12.8L2.1 13.8L1.3 14.7L1.9 15.8L2.4 16.8L2 17.5L1.5 18.1L0.200001 20.2L1.4 21.5L2.2 24.1L1.4 25.4L0.500001 27.4V27.8L1.2 28.3L2.1 28.5L2.9 29H12.8V1H0.600001Z'/%3E%3C/g%3E%3Cpath d='M65 1L65.2 2.1L65.6 2.9V3.3L65.8 3.7V4.3L66 5V5.7V6.3L65.5 6.7L65.8 7.3L66 7.8L66.6 8.3V8.6L66.5 8.9L66.6 9.9V10.5L67.4 11.6L67.1 12L67.4 12.2L66.8 12.8L66.4 13.5L66.6 13.7H66.9L67 13.9L66.5 15.1L65.8 16L64.1 17.7L64.7 18.2L64.3 19L64.7 19.8L64.6 20.6L64.7 21.5L64.6 21.9V22.3L65.1 22.8L64.6 23.6L64.7 24V24.2L64.9 24.4L64.5 24.7L64.3 25.4V25.9L63.8 26.2L63.5 27.1L63.8 27.8L64.4 28.6L62.8 29H55.9V1H65Z'/%3E%3Cg clip-path='url(%23clip1_2_8)'%3E%3Crect x='12' y='1' width='44' height='28'/%3E%3C/g%3E%3C/svg%3E");

  main {
    p.title-intro {
      margin-bottom: -1.5rem;
    }
  
    /* h1 {
      
    } */
  
    h2 {
  
      color: #1e1e1e;
      font-style: normal;
      font-weight: 800;
  
      a {
        color: var(--wp--preset--color--primary);
        text-decoration: none;
        padding: 8px 15px 8px 12px;
        background-image: var(--towmads-background-tape);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100% 100%;
        display: inline-block;
        margin-top: 10px;
      }
    }
  
    .highlight-background h2 a {
      background-image: var(--towmads-background-tape-light);
    }

    input[type="text"],
    input[type="email"] {
      /* padding-block: 1px;
      padding-inline: 2px; */
      border: 1px solid #949494;
      font-family: inherit;
      font-size: 1em;
      padding: calc(.667em + 2px);

      box-sizing: border-box;
      display: block;
      width: 100%;
    }
  }
  
}

/* about-us */
.page-id-1200 {
  background-image: url(../images/map_bg2.webp);
  background-repeat: no-repeat;
  background-position: center 0;
  background-size: cover;

  header {
    & > div {
      background-image: url(../images/lake_louise2.webp);
      background-position: center 0;
    }
  }
}

/* trailer-made-recipes */
.page-id-5410,
.single-pronghorn_recipe {
  header {
    & > div {
      background-image: url(../images/food-section-header-2.webp);
      background-position: center 0;
    }
  }
}

/* travel pages */
.page-id-61,
.single-pronghorn_trip,
.post-type-archive-pronghorn_place,
.single-pronghorn_place,
.post-type-archive-towmads_attraction,
.single-towmads_attraction
{
  header {
    & > div {
      background-image: url(../images/Towing-To-Banff-Title-BG-4.webp);
      background-position: right;
    }
  }
}

/* Style the main Towmads quote on these pages.
Might eventually move to being the main styling for pullquotes. */
.towmads-home-hero,
.single-pronghorn_place,
.single-towmads_attraction {
  /* .wp-block-pullquote, */
  .wp-block-quote {
    
    /* @see - https://hype4.academy/tools/glassmorphism-generator */
    background: rgba( 255, 255, 255, 0.35 );
    /* box-shadow: 0 4px 9px 0 rgba( 31, 38, 135, 0.37 ); */
    box-shadow: 0 4px 9px 0 rgba( 6, 147, 227, 0.37 );
    backdrop-filter: blur( 4px );
    -webkit-backdrop-filter: blur( 4px );
    border-radius: 8px;
    border: 1px solid rgba( 255, 255, 255, 0.18 );

    padding: 4px 10px;
    position: relative;
    margin-block-start: 2rem;
    margin-block-end: 2rem;

    p {
      
      color: #333; 
      font-size: var(--wp--preset--font-size--large);
      font-style: italic;

      border-top: #cfcfcf solid 3px;
      border-bottom: #cfcfcf solid 3px;

      padding: .8rem .5rem;

    }
  
    & > p:before,
    & > p:after {
      font-family: var(--wp--preset--font-family--antique); 
      /* font-size: 60px; */
      font-size: 70px;
      position: absolute;
      /* color: #636363; */
      color: var(--wp--preset--color--primary);
    }
  
  
    & > p:before {
      /* content: '“'; */
      content: open-quote;
      left: -6px;
      top: -29px;
      
    }
    
    & > p:after {
      /* content: '”'; */
      content: close-quote;
      /* right: -7px; */
      right: 9px;
      bottom: -65px;
      
    }
  }
}

.towmads-home-hero {
  --towmads-background-tape: url("data:image/svg+xml,%3Csvg width='68' height='30' viewBox='0 0 68 30' fill='none' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2_8)'%3E%3Cpath d='M0.600001 1L-1.3 3.3L7.15256e-07 5.8L0.300001 7.6L0.900001 8.7L2.4 10.5L1.9 10.8L2.4 11.9V12.8L2.1 13.8L1.3 14.7L1.9 15.8L2.4 16.8L2 17.5L1.5 18.1L0.200001 20.2L1.4 21.5L2.2 24.1L1.4 25.4L0.500001 27.4V27.8L1.2 28.3L2.1 28.5L2.9 29H12.8V1H0.600001Z' fill='%23F2F1EA'/%3E%3C/g%3E%3Cpath d='M64 1L64.2 2.1L64.6 2.9V3.3L64.8 3.7V4.3L65 5V5.7V6.3L64.5 6.7L64.8 7.3L65 7.8L65.6 8.3V8.6L65.5 8.9L65.6 9.9V10.5L66.4 11.6L66.1 12L66.4 12.2L65.8 12.8L65.4 13.5L65.6 13.7H65.9L66 13.9L65.5 15.1L64.8 16L63.1 17.7L63.7 18.2L63.3 19L63.7 19.8L63.6 20.6L63.7 21.5L63.6 21.9V22.3L64.1 22.8L63.6 23.6L63.7 24V24.2L63.9 24.4L63.5 24.7L63.3 25.4V25.9L62.8 26.2L62.5 27.1L62.8 27.8L63.4 28.6L61.8 29H54.9V1H64Z' fill='%23F2F1EA'/%3E%3Cg clip-path='url(%23clip1_2_8)'%3E%3Crect x='12' y='1' width='44' height='28' fill='%23F2F1EA'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_2_8'%3E%3Crect width='15.7' height='30' fill='white'/%3E%3C/clipPath%3E%3CclipPath id='clip1_2_8'%3E%3Crect width='44' height='28' fill='white' transform='translate(12 1)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");

  .wp-block-quote {
    padding-top: 13px;
    padding-bottom: 10px;
    padding-right: 20px;
    padding-left: 13px;
    margin-top: 24vh;
    background: rgba( 255, 255, 255, 0.55 );
    
    /* background: none;
    background-image: var(--towmads-background-tape);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%; */

    -webkit-mask-image: var(--towmads-background-tape);
    mask-image: var(--towmads-background-tape);
    -webkit-mask-size: 100%;
    mask-size: 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;

    p {
      font-size: 24px;
      font-weight: 500;
      border-top: #a1a0a0 solid 3px;
      border-bottom: #a1a0a0 solid 3px;
    }

    & > p:before {
      top: -18px;
      left: -4px;
    }

    & > p:after {
      bottom: -57px;
      right: 24px;
    }
    
  }
}



/* Trip At A Glance Component */

/* =========================================
   Towmads Trip at a Glance Card
   ========================================= */

.towmads-trip-glance {
	margin-top: 2.5rem;
	margin-bottom: 2.5rem;
	--towmads-glance-accent:       #b45f2a;
	--towmads-glance-label:        #244033;
	--towmads-glance-bg:           #fffaf2;
	--towmads-glance-border-outer: rgba(120, 92, 55, 0.25);
	--towmads-glance-border-inner: rgba(120, 92, 55, 0.18);
}

.towmads-trip-glance h2 {
	margin-bottom: 1rem;
}

.towmads-trip-glance-card {
	border: 1px solid var(--towmads-glance-border-outer);
	border-radius: 18px;
	padding: 1.25rem;
	background: var(--towmads-glance-bg);
	box-shadow: 0 8px 24px rgba(50, 40, 25, 0.06);
}

/* Each fact row */
.towmads-trip-glance-row {
	position: relative;
	padding: 0.85rem 0 0.85rem 2.75rem;
	border-bottom: 1px solid var(--towmads-glance-border-inner);
	gap: 0.75rem;
}

.towmads-trip-glance-card .towmads-trip-glance-row {
	margin-bottom: 0;
}

/* Remove border from final row before buttons */
.towmads-trip-glance-row:last-of-type {
	border-bottom: none;
}

/* Shared icon styling */
.towmads-trip-glance-row::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.9rem;
	width: 1.65rem;
	height: 1.65rem;
	background-color: var(--towmads-glance-accent);

	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;

	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
}

/* Individual row icons */

.towmads-icon-status::before {
	mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/activity.svg");
	-webkit-mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/activity.svg");
}

.towmads-icon-calendar::before {
	mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/calendar-days.svg");
	-webkit-mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/calendar-days.svg");
}

.towmads-icon-clock::before {
	mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/clock.svg");
	-webkit-mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/clock.svg");
}

.towmads-icon-phase::before {
	mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/notebook-text.svg");
	-webkit-mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/notebook-text.svg");
}

.towmads-icon-route::before {
	mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/route.svg");
	-webkit-mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/route.svg");
}

.towmads-icon-note::before {
	mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/compass.svg");
	-webkit-mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/compass.svg");
}

/* Label/value text */
.towmads-trip-glance-label {
	margin: 0;
	font-weight: 700;
	color: var(--towmads-glance-label);
	font-size: 0.95rem;
}

.towmads-trip-glance-value {
	margin: 0;
	color: #3f3a32;
	font-size: 0.95rem;
	line-height: 1.45;
}

/* Buttons */
.towmads-trip-glance-buttons {
	display: flex;
	margin-top: 1rem;
	gap: 0.75rem;
}

.towmads-trip-glance-buttons .wp-block-button__link {
	border-radius: 999px;
	padding: 0.65rem 1rem;
	font-size: 0.9rem;
}

.towmads-trip-glance-buttons .wp-block-button.is-style-outline .wp-block-button__link {
	color: var(--towmads-glance-accent);
	border-color: var(--towmads-glance-accent);
	background: transparent;
}

.towmads-trip-glance-buttons .wp-block-button.is-style-outline .wp-block-button__link:hover {
	color: var(--towmads-glance-bg);
	background: var(--towmads-glance-accent);
	border-color: var(--towmads-glance-accent);
}

/* =========================================
   Mobile
   ========================================= */

@media (max-width: 781px) {
	.towmads-trip-glance-card {
		padding: 1rem;
	}

	.towmads-trip-glance-row {
		padding: 0.85rem 0 0.85rem 2.5rem;
	}

	.towmads-trip-glance-row::before {
		top: 0.95rem;
		width: 1.45rem;
		height: 1.45rem;
	}

	.towmads-trip-glance-row .wp-block-column {
		/* !important fights inline flex-basis from the editor's column width attribute */
		flex-basis: 100% !important;
	}

	.towmads-trip-glance-label {
		margin-bottom: 0.2rem;
		font-size: 0.78rem;
		text-transform: uppercase;
		letter-spacing: 0.04em;
	}

	.towmads-trip-glance-value {
		font-size: 1rem;
	}

	.towmads-trip-glance-buttons {
		flex-direction: column;
	}

	.towmads-trip-glance-buttons .wp-block-button {
		width: 100%;
	}

	.towmads-trip-glance-buttons .wp-block-button__link {
		width: 100%;
		text-align: center;
	}
}

/* =========================================
   Testing new colors that better align with current theme.
   ========================================= */

.towmads-trip-glance-row::before {
	background-color: var(--wp--preset--color--primary);
}

.towmads-trip-glance-buttons .wp-block-button.is-style-outline .wp-block-button__link {
	color: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	background: transparent;
}

.towmads-trip-glance-buttons .wp-block-button.is-style-outline .wp-block-button__link:hover {
	color: var(--wp--preset--color--primary-contrast);
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
}


/* =========================================
   Towmads Route Leg Cards
   ========================================= */

.towmads-route-legs {
	margin-top: 2.5rem;
	margin-bottom: 2.5rem;
}

.towmads-route-legs h3 {
	margin-bottom: 0.75rem;
}

.towmads-route-legs-intro {
	margin-bottom: 1.25rem;
	color: #3f3a32;
	line-height: 1.55;
}

.towmads-route-leg-card {
	position: relative;
	margin-top: 1rem;
	margin-bottom: 1rem;
	padding: 1.1rem;
	border: 1px solid rgba(0, 122, 186, 0.22);
	border-radius: 18px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(30, 50, 70, 0.06);
}

.towmads-route-leg-card::before {
	content: "";
	position: absolute;
	left: 0;
	top: 1rem;
	bottom: 1rem;
	width: 4px;
	border-radius: 999px;
	background: var(--wp--preset--color--primary);
	opacity: 0.45;
}

.towmads-route-leg-card.towmads-leg-current::before {
	opacity: 1;
}

.towmads-route-leg-header {
	margin-bottom: 0.55rem;
	gap: 0.6rem;
}

.towmads-route-leg-title-wrap {
	gap: 0.5rem;
}

.towmads-route-leg-pill {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: 0.25rem 0.55rem;
	border-radius: 999px;
	background: rgba(0, 143, 211, 0.10);
	color: #006ca8;
	font-size: 0.78rem;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
}

.towmads-route-leg-title {
	margin: 0 !important;
	color: #1f3340;
	font-size: 1.1rem;
	line-height: 1.25;
}

.towmads-route-leg-status {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: 0.25rem 0.6rem;
	border-radius: 999px;
	font-size: 0.72rem;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	white-space: nowrap;
}

.towmads-leg-current .towmads-route-leg-status {
	background: var(--wp--preset--color--primary);
	color: #ffffff;
}

.towmads-leg-planned .towmads-route-leg-status {
	background: rgba(31, 51, 64, 0.08);
	color: #455866;
}

.towmads-leg-completed .towmads-route-leg-status {
	background: rgba(46, 125, 74, 0.12);
	color: #2e7d4a;
}

.towmads-route-leg-route {
	margin: 0.4rem 0 0.65rem;
	color: #006ca8;
	font-size: 0.92rem;
	font-style: italic;
	line-height: 1.45;
}

.towmads-route-leg-summary {
	margin: 0;
	color: #3f3a32;
	font-size: 0.98rem;
	line-height: 1.55;
}

/* Quick stats for current/active leg */
.towmads-route-leg-stats {
	margin-top: 0.95rem;
	gap: 0.5rem;
}

.towmads-route-leg-stat {
	position: relative;
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: 0.45rem 0.65rem 0.45rem 2rem;
	border: 1px solid rgba(0, 122, 186, 0.18);
	border-radius: 999px;
	background: rgba(0, 143, 211, 0.06);
	color: #1f3340;
	font-size: 0.82rem;
	font-weight: 700;
	line-height: 1;
}

.towmads-route-leg-stat::before {
	content: "";
	position: absolute;
	left: 0.65rem;
	top: 50%;
	width: 1rem;
	height: 1rem;
	transform: translateY(-50%);
	background-color: var(--wp--preset--color--primary);

	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;

	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
}

.towmads-stat-number {
	margin-right: 0.25rem;
	color: #006ca8;
	font-weight: 800;
}

/* Update /YOUR-THEME/ to your actual theme folder path */

.towmads-stat-tow-stops::before {
	mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/map-pin-house.svg");
	-webkit-mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/map-pin-house.svg");
}

.towmads-stat-finds::before {
	mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/sparkles.svg");
	-webkit-mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/sparkles.svg");
}

.towmads-stat-posts::before {
	mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/newspaper.svg");
	-webkit-mask-image: url("/wp-content/themes/towmads/assets/icons/lucide/newspaper.svg");
}

/* =========================================
   Mobile refinements
   ========================================= */

@media (max-width: 781px) {
	.towmads-route-leg-card {
		padding: 1rem 1rem 1rem 1.05rem;
	}

	.towmads-route-leg-header {
		align-items: flex-start;
	}

	.towmads-route-leg-title-wrap {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
	}

	.towmads-route-leg-title {
		font-size: 1.05rem;
	}

	.towmads-route-leg-status {
		margin-top: 0.15rem;
	}

	.towmads-route-leg-route {
		font-size: 0.9rem;
	}

	.towmads-route-leg-summary {
		font-size: 0.96rem;
	}

	.towmads-route-leg-stats {
		display: flex;
		flex-wrap: wrap;
	}

	.towmads-route-leg-stat {
		font-size: 0.78rem;
	}
}