/* =========================
   Base
   ========================= */

.bp-freemodule{
  text-align:center;
  background:none;
  font-family:GROBOLD;
  letter-spacing:1px;
  padding:2px;
  margin-left:auto; margin-right:auto;
}

.bp-freemoduletitle{
  text-align:center; color:#fff; background:none; font-family:GROBOLD;
  letter-spacing:1px; font-size:30px !important; padding:2px;
  margin-left:auto; margin-right:auto;
  background-color:#F95706; border-radius:5px; margin:5px;
}
.bp-freebannerback{ background-color:#F95706; text-align:center; margin:5px; padding:10px; }

.bp-inner-orange{ padding:10px 1px; background-color:#f95706; }
.bp-white{ color:#FFF; }

.bp-review-img{ position:relative; display:block; float:left; margin:0 5px; }
.bp-review-details{ display:block; margin:0 5px; }
.bp-boat-ratings{ font-size:10px; }
.bp-customer-text{ font-size:11px; color:#fff; }
.bp-customer-name{ font-size:9px; }
.bp-whole-reviews{ margin:5px 0; }
.bp-all-reviews-font{ font-size:10px; clear:both; }
.bp-yellow{ color:yellow; }

.bp-review-heading{ clear:both; color:white; font-weight:bold; }

.bp-our-customers-title{
  text-align:center; color:#fff; background:none; font-family:GROBOLD;
  letter-spacing:1px; font-size:20px !important;
}
.bp-font-happy{ font-size:12px; }
.bp-clear-both{ clear:both; }

.visually-hidden{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* Our Customers panel */
.bp-happycustomersbannerback{
  background-color:#2C496F;
  text-align:center;
  margin:0;
  padding:10px;
}

/* =========================
   Social links (icons + labels stay together)
   ========================= */

.bp-social-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:10px 16px;     /* row gap / column gap */
  margin:6px 0 5px;
}
.bp-social-item{
  display:inline-flex;
  align-items:center;
  gap:6px;
  white-space:nowrap; /* prevent icon/text splitting */
}
.bp-social-row .bp-social-item i{ position:relative; top:.5px; color:#c7d6f5; }

/* Base link look inside the blue panel (used by social + “Read all…”) */
.bp-font-happy a{
  color:#e2ebf9;
  text-decoration:none;
  font-weight:500;
  transition:color .15s ease, text-decoration-thickness .15s ease;
}
.bp-font-happy a:hover,
.bp-font-happy a:focus{
  color:#fff;
  text-decoration:underline;
  text-underline-offset:.15em;
  text-decoration-thickness:1px;
  outline:none;
}

/* =========================
   Reviews: overlay & caption
   ========================= */

.bp-boat-badge{
  position:absolute;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:11px;
  line-height:1.2;
  padding:2px 6px;
  border-radius:4px;
  pointer-events:none;
}

/* Make the whole card clickable without changing look */
.bp-review-link{ display:block; color:inherit; text-decoration:none; }


/* Desktop polish: hover lift */
@media (hover:hover) and (pointer:fine){
  .bp-review-link{ border-radius:6px; transition:background-color .18s, box-shadow .18s; }
  .bp-review-img img{ transition: transform .22s ease, filter .22s ease; }
  .bp-review-link:hover{ background:rgba(255,255,255,.04); box-shadow:0 4px 14px rgba(0,0,0,.15); }
  .bp-review-link:hover .bp-review-img img{ transform:scale(1.06); filter:saturate(1.03) brightness(1.03); }
  .bp-review-link:hover .bp-boat-badge{ background:rgba(0,0,0,.7); }
}

/* =========================
   Breakpoints
   ========================= */

/* Phones */ 
@media (max-width: 766px){
  .bp-freemodule{ font-size:15px !important; } 
  .bp-inner-orange{ margin:0 -10px; height:265px; }
  .bp-happycustomersbannerback{ margin:10px 0; }

  /* Reviews: 1-up, centered */
  .bp-reviews-grid .bp-whole-reviews{ width:100% !important; float:none !important; clear:both; text-align:center !important; }
  .bp-review-details{
    float:none !important; width:100% !important; margin:0 auto !important; padding:0 !important;
    text-align:center !important; display:flex !important; flex-direction:column; align-items:center;
  }
  .bp-boat-ratings, .bp-customer-text, .bp-customer-name{ text-align:center !important; margin-left:0 !important; margin-right:0 !important; }

  /* Image sizing */
  .bp-happycustomersbannerback .bp-review-img{
    width:85% !important; max-width:270px !important; height:auto !important;
    overflow:visible !important; float:none !important; margin:0 auto 12px !important; box-sizing:border-box; text-align:center;
  }
  .bp-happycustomersbannerback .bp-review-img img{ display:block; width:100% !important; height:auto !important; object-fit:contain; }

  /* Larger text & caption pill */
  .bp-customer-text{ font-size:15px; }
  .bp-customer-name{ font-size:13px; }
  .bp-boat-badge{ display:none !important; }
  .bp-boat-caption{
    display:inline-block; font-size:18px !important; font-weight:700; line-height:1.25;
    margin-top:10px; padding:4px 10px; background:rgba(0,0,0,.55); color:#fff; border-radius:4px; word-break:break-word;
  }

  /* Heading: reliable space above even after floats */
  .bp-review-heading{ margin-top:0 !important; margin-bottom:10px; font-size:18px !important; line-height:1.2; position:relative; }
  .bp-review-heading::before{ content:""; display:block; height:16px; }

  /* Social links: clearer on mobile */
  .bp-social-row{ gap:8px 12px; }
  .bp-font-happy a{
    color:#f1f6ff; text-decoration:underline; text-underline-offset:.12em; text-decoration-thickness:1.1px; font-weight:600;
  }
}

/* Tablet */
@media (min-width: 767px) and (max-width: 989px){
  .bp-freemodule{ font-size:15px !important; }
  .bp-inner-orange{ margin:0 -10px; height:230px; }

  .bp-happycustomersbannerback .bp-review-img{ width:auto !important; height:auto !important; overflow:visible !important; }
  .bp-boat-badge{ display:inline-block; }
  .bp-boat-caption{ display:none; }
}

/* Small desktop */
@media (min-width: 990px) and (max-width: 1199px){
  .bp-freemodule{ font-size:20px !important; }
  .bp-inner-orange{ height:230px; }
}

/* Large desktop */
@media (min-width: 1200px){
  .bp-freemodule{ font-size:30px !important; }
  .bp-inner-orange{ height:280px; }
}

/* Desktop (≥990px): classic thumb + left-aligned details */
@media (min-width: 990px){
  .bp-happycustomersbannerback .bp-review-img{
    width:80px !important; height:60px !important; overflow:hidden !important;
    float:left !important; margin:0 5px 0 0 !important;
  }
  .bp-happycustomersbannerback .bp-review-img img{ width:100% !important; height:100% !important; object-fit:cover; }
  .bp-happycustomersbannerback .bp-review-details,
  .bp-happycustomersbannerback .bp-boat-ratings,
  .bp-happycustomersbannerback .bp-customer-text,
  .bp-happycustomersbannerback .bp-customer-name{ text-align:left !important; }

  /* Overlay position top-left, avoid stretch */
  .bp-boat-badge{
    top:1px !important; left:1px !important; right:auto !important; bottom:auto !important;
    width:auto !important; height:auto !important; display:inline-block !important; white-space:nowrap; max-width:calc(100% - 16px);
  }
}


/* Mobile (≤767px): use btn-info colors for social + promo buttons */
@media (max-width:767px){
  /* Social buttons */
  .bp-social-row .bp-social-item a{
    display:inline-flex; align-items:center; gap:8px;
    padding:8px 12px; font-size:15px; line-height:1.35; font-weight:600;
    border-radius:4px;                         /* like .btn */
    background-color:#5bc0de;                  /* btn-info */
    border:1px solid #46b8da;                  /* btn-info border */
    color:#fff !important; text-decoration:none !important;
    cursor:pointer; touch-action:manipulation; user-select:none;
    transition:background-color .15s ease, border-color .15s ease, transform .06s ease;
  }
  .bp-social-row .bp-social-item a:hover,
  .bp-social-row .bp-social-item a:focus{
    background-color:#31b0d5;                  /* bootstrap hover */
    border-color:#269abc;
    outline:none;
  }
  .bp-social-row .bp-social-item a:active{ transform:translateY(1px); }

  /* Place the logo inside the button (Font Awesome 4 codes) */
  .bp-social-row .bp-social-item i{ display:none; }
  .bp-social-row .bp-social-item a::before{
    font-family:"FontAwesome"; font-weight:normal; font-style:normal;
    display:inline-block; font-size:1em; line-height:1; color:inherit; content:"";
  }
  .bp-social-row .bp-social-item i.fa-tripadvisor + a::before { content:"\f262"; } /* TripAdvisor */
  .bp-social-row .bp-social-item i.fa-facebook    + a::before { content:"\f09a"; } /* Facebook */
  .bp-social-row .bp-social-item i.fa-google      + a::before { content:"\f1a0"; } /* Google */

  /* Promo buttons */
  .bp-offer-link{ text-align:center; }
  .bp-offer-link a{
    display:inline-flex; align-items:center; gap:8px; justify-content:center;
    padding:8px 12px; font-size:15px; line-height:1.35; font-weight:700;
    border-radius:4px;
    background-color:#5bc0de; border:1px solid #46b8da; color:#fff !important;
    text-decoration:none !important; box-shadow:none;
    transition:background-color .15s ease, border-color .15s ease, transform .06s ease;
    white-space:normal; text-align:center;
  }
  .bp-offer-link a:hover,
  .bp-offer-link a:focus{ background-color:#31b0d5; border-color:#269abc; }
  .bp-offer-link a:active{ transform:translateY(1px); }

  /* Hide manual line breaks so the text wraps naturally in the button */
  .bp-offer-link a br{ display:none; }

  /* Icons inside promo buttons: gift (T-shirt) / life ring (Drybag/Towel) */
  .bp-offer-link a::before{
    font-family:"FontAwesome"; font-weight:normal; font-style:normal;
    display:inline-block; font-size:1em; line-height:1; color:inherit;
    content:"\f06b"; /* fa-gift default */
  }
  .bp-tshirtbannertop .bp-nogutter .clearfix > [class*="col-"]:last-child .bp-offer-link a::before{
    content:"\f1cd"; /* fa-life-ring for the second card */
  }

  /* (Optional) make buttons comfortably wide for tapping
  .bp-social-row .bp-social-item a, .bp-offer-link a{ width:100%; max-width:320px; } */
}