
/* =========================================================
   Global tokens
   ========================================================= */
:root {
  --site-header-height: 80px;
}

@media (max-width: 991.98px) {
  :root {
    --site-header-height: 60px;
  }
}

@media (max-width: 575.98px) {
  :root {
    --site-header-height: 56px;
  }
}


/* =========================================================
   Common styles
   ========================================================= */
body {
  font-size: 1.0625rem;
  color: #0a0a0a;
}

p {
  margin-bottom: 1.875rem;
  line-height: 1.75;
}

h2, h3, h4, h5, h6 {
  margin-bottom: 1.875rem;
}

h1 {
  text-transform: uppercase;
}

hr{
  border: 0;
  height: 1px;
  margin: 3rem 0;
  background: linear-gradient(to right, transparent, rgba(15, 23, 42, 1), transparent);
}


/* =========================================================
   STICKY FOOTER LAYOUT
   - Push footer to bottom when page content is shorter
   - Updated for current Helix Ultimate structure
   ========================================================= */

html,
body{
  min-height: 100%;
}

body.site{
  min-height: 100vh;
  min-height: 100dvh;
}

body.site .body-wrapper,
body.site .body-innerwrapper{
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

/* Main wrapper now contains hero + content + footer */
#sp-main{
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* Let the content area grow and push footer down */
#sp-main-body{
  flex: 1 0 auto;
}

/* Footer goes to the bottom when content is short */
#sp-footer{
  margin-top: auto;
}


/* =========================================================
   Helix overrides
   ========================================================= */
#sp-header {
  height: var(--site-header-height) !important;
}

#sp-breadcrumbs {
  padding-top: 20px;
}

#sp-footer1 {
//  text-align: center;
}

#sp-main-body {
  padding: 20px 0;
}

.custom-menu-footer {
//  text-align: center;
}

.custom-menu-header {
  text-transform: uppercase;
}


/* =========================================================
   Top bar responsive fix (< 992px)
   - Keep social icons on the left
   - Keep language switcher on the right
   - Prevent stacking and center alignment on mobile
   ========================================================= */
@media (max-width: 991.98px) {

  /* Keep both top-bar columns on the same row */
  #sp-top-bar .row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
  }

  /* Force each column to take 50% width on mobile/tablet */
  #sp-top-bar #sp-top1,
  #sp-top-bar #sp-top2 {
    flex: 0 0 50%;
    max-width: 50%;
  }

  /* Override Helix/Bootstrap center alignment on mobile */
  #sp-top-bar #sp-top1 .sp-column,
  #sp-top-bar #sp-top2 .sp-column {
    display: flex;
    align-items: center;
  }

  #sp-top-bar #sp-top1 .sp-column {
    justify-content: flex-start !important;
    text-align: left !important;
  }

  #sp-top-bar #sp-top2 .sp-column {
    justify-content: flex-end !important;
    text-align: right !important;
  }

  /* Keep social icons and language links on a single line */
  #sp-top-bar .social-icons,
  #sp-top-bar .lang-inline {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    white-space: nowrap;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  /* Normalize list item spacing */
  #sp-top-bar .social-icons li,
  #sp-top-bar .lang-inline li {
    margin: 0;
    padding: 0;
  }

  /* Controlled spacing */
  #sp-top-bar .social-icons {
    gap: 12px;
  }

  #sp-top-bar .lang-inline {
    gap: 8px;
  }

  /* Remove extra module spacing that can affect alignment */
  #sp-top-bar .sp-module,
  #sp-top-bar .sp-module-content,
  #sp-top-bar .mod-languages {
    margin: 0;
  }
}

/* =========================================================
   Header default state
   - Semi-transparent white background when page is at top
   - Soft blur effect applied behind the header
   - Disable extra framework animations for smoother behavior
   ========================================================= */
#sp-header {
  background: rgba(255, 255, 255, 0.7);
  transition:
    background 0.75s ease,
    box-shadow 0.75s ease,
    backdrop-filter 0.75s ease,
    -webkit-backdrop-filter 0.75s ease;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  animation: none !important;
  -webkit-animation: none !important;
}

/* =========================================================
   Header sticky state
   - Solid white background after Helix activates sticky mode
   - Stronger shadow to separate header from page content
   - Remove blur once header is fixed on scroll
   ========================================================= */
#sp-header.header-sticky {
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  animation: none !important;
  -webkit-animation: none !important;
}

/* ==========================================================================
   Footer (Helix Ultimate) - Custom Overrides
   Targets: #sp-footer (and #sp-bottom if present)
   Changes:
   - Set footer background to white (#ffffff)
   - Set default footer text color to black (#000000)
   - Set footer link color to black (#000000)
   - Set footer link hover/focus color to maroon (#ed145b)
   - Set footer active/current menu item color to maroon (#ed145b)
   - Desktop: left column left-aligned, right column right-aligned
   - Mobile (<992px): center-align, swap order (menu above copyright),
     and add vertical spacing between the two stacked blocks
   ========================================================================== */
/* Base footer colors */
#sp-footer,
#sp-bottom {
  background: #ffffff !important;
  color: #000000 !important;
}

/* Ensure common footer text inherits black */
#sp-footer .sp-copyright,
#sp-bottom .sp-copyright {
  color: #000000 !important;
}

/* Links: default, hover/focus, active */
#sp-footer a,
#sp-bottom a {
  color: #000000 !important;
  text-decoration: none !important;
}

#sp-footer a:hover,
#sp-footer a:focus,
#sp-bottom a:hover,
#sp-bottom a:focus {
  color: #ed145b !important;
  text-decoration: none !important;
}

#sp-footer a:active,
#sp-bottom a:active {
  color: #ed145b !important;
}

/* Menu item "active/current" states (Joomla menus) */
#sp-footer .menu > li.active > a,
#sp-footer .menu > li.current > a,
#sp-footer .menu > li.active > a:hover,
#sp-footer .menu > li.current > a:hover,
#sp-bottom .menu > li.active > a,
#sp-bottom .menu > li.current > a,
#sp-bottom .menu > li.active > a:hover,
#sp-bottom .menu > li.current > a:hover {
  color: #ed145b !important;
}

/* Desktop alignment (2 columns) */
#sp-footer1 { text-align: left; }
#sp-footer2 { text-align: right; }

/* Responsive: when columns stack (below Bootstrap LG) */
@media (max-width: 991.98px) {
  /* Ensure row behaves as flex so ordering works reliably */
  #sp-footer .row {
    display: flex !important;
    flex-wrap: wrap;
  }

  /* Center both columns */
  #sp-footer1,
  #sp-footer2 {
    text-align: center !important;
  }

  /* Reorder: menu (right column) above copyright (left column) */
  #sp-footer2 { order: 1; }
  #sp-footer1 { order: 2; }

  /* Add vertical spacing between the two stacked blocks */
  #sp-footer2 { margin-bottom: 0.5rem; }
  #sp-footer1 { margin-top: 0.5rem; }

  /* Center the footer menu and keep it nicely spaced */
  #sp-footer2 .menu {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center !important;
    gap: 0.5rem 1.25rem; /* row-gap / column-gap */
    padding-left: 0;
    margin: 0;
  }

  #sp-footer2 .menu > li {
    list-style: none;
    margin: 0;
    padding: 0;
  }
}


/* =========================================================
   QT ICONS (Font Awesome 6 Free Solid)
   Usage: add class "qt-icon-bed", "qt-icon-car", etc. on the <a>
   Each class sets --qt-icon-fa, consumed by ::before
   ========================================================= */
.qt-icon-question     { --qt-icon-fa: "\f059"; } /* circle-question */
.qt-icon-info         { --qt-icon-fa: "\f05a"; } /* circle-info */
.qt-icon-warn         { --qt-icon-fa: "\f071"; } /* triangle-exclamation */
.qt-icon-credit-card  { --qt-icon-fa: "\f09d"; } /* credit-card */
.qt-icon-sterling     { --qt-icon-fa: "\f154"; } /* sterling-sign */
.qt-icon-bed          { --qt-icon-fa: "\f236"; } /* bed */
.qt-icon-food         { --qt-icon-fa: "\f2e7"; } /* utensils */
.qt-icon-plane        { --qt-icon-fa: "\f072"; } /* plane */
.qt-icon-car          { --qt-icon-fa: "\f1b9"; } /* car */
.qt-icon-insurance    { --qt-icon-fa: "\f0fa"; } /* suitcase-medical */
.qt-icon-luggage      { --qt-icon-fa: "\f5c1"; } /* suitcase-rolling */
.qt-icon-map          { --qt-icon-fa: "\f5a0"; } /* map-location-dot */
.qt-icon-bus          { --qt-icon-fa: "\f207"; } /* bus */
.qt-icon-ok           { --qt-icon-fa: "\f058"; } /* circle-check */
.qt-icon-ban          { --qt-icon-fa: "\f05e"; } /* ban */
.qt-icon-christmas    { --qt-icon-fa: "\f06b"; } /* gift */
.qt-icon-transfer     { --qt-icon-fa: "\f5b6"; } /* van-shuttle */
.qt-icon-idea         { --qt-icon-fa: "\f0eb"; } /* lightbulb */
.qt-icon-star         { --qt-icon-fa: "\f005"; } /* star */
.qt-icon-ticket       { --qt-icon-fa: "\f3ff"; } /* ticket-simple */
.qt-icon-sim          { --qt-icon-fa: "\f7c4"; } /* sim-card */
.qt-icon-newsletter   { --qt-icon-fa: "\f0e0"; } /* envelope */
.qt-icon-wifi         { --qt-icon-fa: "\f1eb"; } /* wifi */
.qt-icon-vpn          { --qt-icon-fa: "\f3ed"; } /* shield-halved */
.qt-icon-passport     { --qt-icon-fa: "\f5ab"; } /* passport */
.qt-icon-train        { --qt-icon-fa: "\f238"; } /* train */
.qt-icon-camera       { --qt-icon-fa: "\f030"; } /* camera */
.qt-icon-weather      { --qt-icon-fa: "\f6c4"; } /* cloud-sun */
.qt-icon-landmark     { --qt-icon-fa: "\f66f"; } /* landmark */
.qt-icon-route        { --qt-icon-fa: "\f4d7"; } /* route */
.qt-icon-newspaper    { --qt-icon-fa: "\f1ea"; } /* newspaper */
.qt-icon-chess-rook   { --qt-icon-fa: "\f447"; } /* chess-rook */
.qt-icon-heart        { --qt-icon-fa: "\f004"; } /* heart */
.qt-icon-ship         { --qt-icon-fa: "\f21a"; } /* ship */


/* =========================================================
   QT SIDE PANEL NAV — STYLES
   - Scoped variables (no global :root)
   - Spacing uses flex gap
   - Typography inherits from site (em + inherit)
   - Template-safe: overrides Helix ul>li>a forcing (padding/line-height/display)
   ========================================================= */

.qt-sidepanel-nav{
  /* Colors */
  --qtsp-fill: #cfefff;
  --qtsp-fill-hover: #a2d8f2;
  --qtsp-title-bg: #ffffff;

  /* Borders */
  --qtsp-border: #000000;
  --qtsp-bw-title: 3px;
  --qtsp-bw-btn: 2px;

  /* Spacing / geometry */
  --qtsp-item-gap: 8px;
  --qtsp-radius: 26px;

  /* Typography */
  --qtsp-title-size: 1.75em;
  --qtsp-btn-size: 1.125em;
  --qtsp-title-weight: 600;
  --qtsp-btn-weight: 600;
  --qtsp-title-tracking: 0.02em;
  --qtsp-btn-tracking: 0.01em;

  /* Button padding */
  --qtsp-btn-py: 16px; /* top/bottom */
  --qtsp-btn-px: 20px; /* left/right */

  /* Icon */
  --qtsp-icon-gap: 16px;
  --qtsp-icon-size: 1.1em;
  --qtsp-icon-col: currentColor;

  /* Layout */
  display: flex;
  flex-direction: column;
  gap: var(--qtsp-item-gap);
}

/* Base */
.qt-sidepanel-nav,
.qt-sidepanel-nav *{
  box-sizing: border-box;
}

/* Header */
.qt-sidepanel-nav__title{
  background: var(--qtsp-title-bg);

  border: var(--qtsp-bw-title) solid var(--qtsp-border);
  border-radius: var(--qtsp-radius) var(--qtsp-radius) 0 0;

  text-align: center;
  text-transform: uppercase;

  font-size: var(--qtsp-title-size);
  font-weight: var(--qtsp-title-weight);
  letter-spacing: var(--qtsp-title-tracking);

  line-height: normal;
  padding: 10px 14px;

  color: inherit;
}

/* List reset + spacing between items via gap */
.qt-sidepanel-nav__list{
  list-style: none;
  margin: 0 !important;
  padding: 0;

  display: flex;
  flex-direction: column;
  gap: var(--qtsp-item-gap);
}

.qt-sidepanel-nav__item{
  margin: 0;
  padding: 0;
}

/* Button */
.qt-sidepanel-nav__btn{
  display: flex;
  align-items: center;
  gap: var(--qtsp-icon-gap);

  width: 100%;

  background: var(--qtsp-fill);
  text-decoration: none;
  text-align: left;

  border: var(--qtsp-bw-btn) solid var(--qtsp-border);
  padding: var(--qtsp-btn-py) var(--qtsp-btn-px);

  text-transform: uppercase;

  font-size: var(--qtsp-btn-size);
  font-weight: var(--qtsp-btn-weight);
  letter-spacing: var(--qtsp-btn-tracking);

  line-height: normal;
  color: inherit;
}

/* If TinyMCE wraps text in <p> */
.qt-sidepanel-nav__btn p{ margin: 0; }

/* Round only the last button */
.qt-sidepanel-nav__item:last-child .qt-sidepanel-nav__btn{
  border-radius: 0 0 var(--qtsp-radius) var(--qtsp-radius);
}

/* Flat icon (no circular chip) */
.qt-sidepanel-nav__btn::before{
  content: var(--qt-icon-fa, "\f0c1");

  width: 1.35em;
  flex: 0 0 auto;
  text-align: center;

  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  -webkit-font-smoothing: antialiased;

  font-size: var(--qtsp-icon-size);
  line-height: 1;
  color: var(--qtsp-icon-col);

  background: none;
  border: 0;
  border-radius: 0;
}

/* Remove arrows entirely */
.qt-sidepanel-nav__btn::after{
  content: none;
  display: none;
}

/* Hover / focus */
@media (hover:hover){
  .qt-sidepanel-nav__btn:hover{
    background: var(--qtsp-fill-hover);
  }
}

.qt-sidepanel-nav__btn:focus-visible{
  outline: 3px solid rgba(0,0,0,.25);
  outline-offset: 3px;
}

/* =========================================================
   Bootstrap XL breakpoint (<= 1399.98px)
   ========================================================= */
@media (max-width: 1399.98px){
  .qt-sidepanel-nav{
    --qtsp-title-size: 1.40em;
    --qtsp-title-tracking: 0.01em;

    --qtsp-btn-size: 1.05em;

    --qtsp-btn-py: 14px;
    --qtsp-btn-px: 16px;

    --qtsp-icon-gap: 12px;
    --qtsp-item-gap: 7px;
  }

  .qt-sidepanel-nav__title{
    padding: 9px 12px;
  }
}

/* =========================================================
   Bootstrap LG breakpoint (<= 1199.98px)
   ========================================================= */
@media (max-width: 1199.98px){
  .qt-sidepanel-nav{
    --qtsp-title-size: 1.15em;
    --qtsp-title-tracking: 0.006em;

    --qtsp-btn-size: 0.95em;
    --qtsp-btn-tracking: 0.004em;

    --qtsp-btn-py: 10px;
    --qtsp-btn-px: 8px;

    --qtsp-icon-gap: 6px;
    --qtsp-item-gap: 5px;
  }

  .qt-sidepanel-nav__title{
    padding: 8px 10px;
  }
}

/* =========================================================
   Bootstrap MD breakpoint (<= 991.98px)
   ========================================================= */
@media (max-width: 991.98px){
  .qt-sidepanel-nav{
    --qtsp-title-size: 1.50em;
    --qtsp-title-tracking: 0.01em;

    --qtsp-btn-size: 1.20em;
    --qtsp-btn-px: 26px;
    --qtsp-icon-gap: 18px;

    --qtsp-btn-py: 14px;
    --qtsp-item-gap: 7px;

    --qtsp-icon-size: 1.1em;
  }

  .qt-sidepanel-nav__title{
    padding: 9px 12px;
  }
}

/* =========================================================
   Bootstrap SM breakpoint (<= 767.98px)
   ========================================================= */
@media (max-width: 767.98px){
  .qt-sidepanel-nav{
    --qtsp-title-size: 1.35em;
    --qtsp-title-tracking: 0.01em;

    --qtsp-btn-size: 1.14em;

    --qtsp-btn-py: 10px;
    --qtsp-btn-px: 26px;

    --qtsp-icon-gap: 18px;
    --qtsp-item-gap: 6px;

    --qtsp-icon-size: 1.1em;
  }

  .qt-sidepanel-nav__title{
    padding: 9px 12px;
  }
}

/* =========================================================
   Bootstrap XS breakpoint (<= 575.98px)
   ========================================================= */
@media (max-width: 575.98px){
  .qt-sidepanel-nav{
    --qtsp-title-size: 1.20em;

    --qtsp-btn-size: 1.08em;

    --qtsp-btn-py: 9px;
    --qtsp-btn-px: 26px; /* keep lateral padding */

    --qtsp-icon-gap: 18px; /* keep icon/text spacing */
    --qtsp-item-gap: 5px;

    --qtsp-icon-size: 1.05em;
  }

  .qt-sidepanel-nav__title{
    padding: 8px 12px;
  }
}

/* ---------------------------------------------------------
   Helix/Template override shield
   --------------------------------------------------------- */
#sp-left  .sp-module .qt-sidepanel-nav__list > li > a.qt-sidepanel-nav__btn,
#sp-right .sp-module .qt-sidepanel-nav__list > li > a.qt-sidepanel-nav__btn{
  display: flex;
  padding: var(--qtsp-btn-py) var(--qtsp-btn-px);
  line-height: normal;
  color: inherit;
}


/* Article blocks */
/* ===========================
   NOTES (travel callout blocks)
   - Color style:   .qt-note--do | .qt-note--info | .qt-note--tip | .qt-note--warn | .qt-note--none
   - Icon selector: .qt-icon-xxxx (sets --qt-icon-fa)
   Font Awesome 6 Free (Solid) required
   =========================== */

.qt-note{
  /* Left accent bar width */
  --qt-note-bar: 0.5rem;

  /* Default tokens (overridden by qt-note--*) */
  --qt-note-bg: #f6f7f9;
  --qt-note-bd: #e6e8ee;
  --qt-note-accent: #94a3b8;

  /* Default icon (overridden by qt-icon-*) */
  --qt-note-default-fa: "\f05a"; /* circle-info */

  border: 1px solid var(--qt-note-bd);
  border-radius: 1.5rem;
  background: var(--qt-note-bg);

  /* Compensate the left accent bar in the left padding */
  padding: 1.1rem 1.1rem 1rem calc(1.1rem + var(--qt-note-bar));
  margin: 1.875rem 0;

  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
  position: relative;
  overflow: hidden;
}

.qt-note::before{
  content:"";
  position:absolute;
  inset: 0 auto 0 0;
  width: var(--qt-note-bar);
  background: var(--qt-note-accent);
  opacity: .85;
}

/* Title row */
.qt-note__title{
  margin: 0 0 .6rem;
  font-weight: 700;
  letter-spacing: -0.01em;

  display: flex;
  align-items: center;
  gap: .65rem;
}

/* Icon chip (pseudo-element) */
.qt-note__title::before{
  content: var(--qt-icon-fa, var(--qt-note-default-fa, "\f05a"));

  width: 2.1rem;
  height: 2.1rem;
  flex: 0 0 auto;

  display: inline-grid;
  place-items: center;

  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.7);

  color: var(--qt-note-accent);

  /* Font Awesome 6 Free Solid */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-style: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;

  font-size: 1.05rem;
  line-height: 1;
}

/* Content spacing */
.qt-note__body > :first-child{ margin-top: 0; }
.qt-note__body > :last-child{ margin-bottom: 0; }
.qt-note__body p{ margin: .55rem 0; }

/* Links inside the block */
.qt-note a{
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
}

/* ===========================
   5 color styles (as requested)
   =========================== */

.qt-note--do{
  --qt-note-bg: #f1fbf5;
  --qt-note-bd: #d7f3e2;
  --qt-note-accent: #34d399;
}

.qt-note--info{
  --qt-note-bg: #eef6ff;
  --qt-note-bd: #d8ebff;
  --qt-note-accent: #0ea5e9;
}

.qt-note--tip{
  --qt-note-bg: #f5f3ff;
  --qt-note-bd: #e9d5ff;
  --qt-note-accent: #8b5cf6;
}

.qt-note--warn{
  --qt-note-bg: #fff1f2;
  --qt-note-bd: #ffd7dc;
  --qt-note-accent: #fb7185;
}

.qt-note--none{
  --qt-note-bg: #f8fafc;
  --qt-note-bd: #e2e8f0;
  --qt-note-accent: #64748b;
}

/* Responsive */
@media (max-width: 576px){
  .qt-note{
    padding: 1rem 1rem 1rem calc(1rem + var(--qt-note-bar));
    border-radius: 1.25rem;
  }
  .qt-note__title::before{
    width: 1.9rem;
    height: 1.9rem;
    font-size: 1rem;
  }
}


/* =========================================================
   QT BLOG THUMBNAIL CARD
   - Custom category-blog card for Blog Thumbnail
   ========================================================= */

.qt-blog-card {
  --qtbc-radius: 1.5rem;
  --qtbc-titlebox-radius: 0.7rem;
  --qtbc-titlebox-offset: 1.5rem;
  --qtbc-titlebox-padding: 0.3rem;
  --qtbc-overlay-bg: rgb(255 255 255 / 20%);
  --qtbc-card-shadow: 4px 5px 10px 1px #a5a5a5;
  --qtbc-card-shadow-hover: 4px 5px 15px 1px #8d8d8d;
  --qtbc-titlebox-shadow: 0 0 20px rgb(0 0 0 / 50%);
  --qtbc-titlebox-shadow-hover: 0 0 25px rgb(0 0 0 / 65%);

  position: relative;
  height: 100%;
  margin: 0;
}

.qt-blog-card__link {
  position: relative;
  display: block;
  height: 100%;
  color: inherit !important;
  text-decoration: none !important;
  border-radius: var(--qtbc-radius);
  overflow: hidden;
  background: #ffffff;
  box-shadow: var(--qtbc-card-shadow);
  transition:
    box-shadow 0.30s ease,
    transform 0.30s ease;
}

.qt-blog-card__link:hover,
.qt-blog-card__link:focus-visible {
  color: inherit !important;
  text-decoration: none !important;
  box-shadow: var(--qtbc-card-shadow-hover);
  transition-duration: 0.15s;
}

.qt-blog-card__link:focus-visible {
  outline: 3px solid rgb(15 23 42 / 18%);
  outline-offset: 3px;
}

.qt-blog-card__media {
  position: relative;
  aspect-ratio: 3 / 4;
  background: #e9ecef;
}

.qt-blog-card__media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: var(--qtbc-overlay-bg);
  opacity: 1;
  transition: opacity 0.30s ease;
}

.qt-blog-card__link:hover .qt-blog-card__media::after,
.qt-blog-card__link:focus-visible .qt-blog-card__media::after {
  opacity: 0;
  transition-duration: 0.15s;
}

.qt-blog-card__picture {
  display: block;
  width: 100%;
  height: 100%;
}

.qt-blog-card__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.qt-blog-card__titlebox {
  position: absolute;
  z-index: 2;
  top: var(--qtbc-titlebox-offset);
  left: var(--qtbc-titlebox-offset);
  right: var(--qtbc-titlebox-offset);
  padding: var(--qtbc-titlebox-padding);
  border-radius: var(--qtbc-titlebox-radius);
  background: #ffffff;
  box-shadow: var(--qtbc-titlebox-shadow);
  pointer-events: none;
  transition: box-shadow 0.30s ease;
}

.qt-blog-card__link:hover .qt-blog-card__titlebox,
.qt-blog-card__link:focus-visible .qt-blog-card__titlebox {
  box-shadow: var(--qtbc-titlebox-shadow-hover);
  transition-duration: 0.15s;
}

.qt-blog-card__title {
  margin: 0;
  color: #0a0a0a;
  font-size: 1.45rem;
  line-height: 1.5em;
  font-weight: 500;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 0.02em;
  overflow-wrap: anywhere;
  word-break: normal;
}

.qt-blog-card__status-badges {
  position: absolute;
  z-index: 3;
  left: 15px;
  right: 9rem;
  bottom: 15px;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  pointer-events: none;
}

.qt-blog-card__status-badge.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  line-height: 1.1;
  padding: 0.45em 0.70em;
  border-radius: 999px;
  box-shadow: 0 4px 14px rgb(0 0 0 / 22%);
  pointer-events: none;
}

.qt-blog-card__featured-badge.badge {
  position: absolute;
  z-index: 4;
  right: 15px;
  bottom: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  line-height: 1.1;
  padding: 0.45em 0.70em;
  border-radius: 999px;
  box-shadow: 0 4px 14px rgb(0 0 0 / 22%);
  pointer-events: none;
  cursor: default;
}

/* Safety: prevent default link styling on title text */
.qt-blog-card__link:hover .qt-blog-card__title,
.qt-blog-card__link:focus-visible .qt-blog-card__title {
  color: #0a0a0a;
}

/* =========================================================
   QT BLOG THUMBNAIL GRID — BASE SPACING
   ========================================================= */

.blog .article-list {
  margin: 0 4rem;
}

.blog .article-list > .row {
  row-gap: 2.625rem;
}

.blog .article-list > .row > * {
  padding-right: 1.25rem;
  padding-left: 1.25rem;
}

/* =========================================================
   QT BLOG THUMBNAIL RESPONSIVE
   ========================================================= */

/* First responsive step: below 1400px */
@media (max-width: 1399.98px) {
  .blog .article-list {
    margin: 0 2rem;
  }

  .qt-blog-card {
    --qtbc-titlebox-offset: 1.35rem;
  }

  .qt-blog-card__title {
    font-size: 1.29rem;
  }

  .qt-blog-card__status-badge.badge,
  .qt-blog-card__featured-badge.badge {
    font-size: 0.79rem;
    line-height: 1em;
  }
}

/* Second responsive step: below 1200px */
@media (max-width: 1199.98px) {
  .blog .article-list {
    margin: 0 1rem;
  }

  .qt-blog-card {
    --qtbc-titlebox-offset: 1.15rem;
  }

  .qt-blog-card__title {
    font-size: 1.08rem;
  }

  .qt-blog-card__status-badge.badge,
  .qt-blog-card__featured-badge.badge {
    font-size: 0.65rem;
    line-height: 0.8em;
  }
}

/* Third responsive step: below 992px */
@media (max-width: 991.98px) {
  .qt-blog-card {
    --qtbc-titlebox-offset: 1.25rem;
  }

  .qt-blog-card__title {
    font-size: 1.23rem;
  }

  .qt-blog-card__status-badge.badge,
  .qt-blog-card__featured-badge.badge {
    font-size: 0.76rem;
    line-height: 0.87em;
  }
}

/* Fourth responsive step: below 768px */
@media (max-width: 767.98px) {
  .blog .article-list {
    margin: 0;
  }

  .qt-blog-card {
    --qtbc-titlebox-offset: 0.95rem;
  }

  .qt-blog-card__title {
    font-size: 0.92rem;
  }

  .qt-blog-card__status-badge.badge,
  .qt-blog-card__featured-badge.badge {
    font-size: 0.54rem;
    line-height: 0.65em;
  }
}

/* Fifth responsive step: below 576px */
@media (max-width: 575.98px) {
  .blog .article-list {
    margin: 0 clamp(1.5rem, calc(-21.718rem + 82.553vw), 8rem);
  }

  .qt-blog-card {
    --qtbc-titlebox-offset: clamp(1.15rem, calc(2.5216rem - 3.8097vw), 1.45rem);
  }

  .qt-blog-card__title {
    font-size: clamp(1.13rem, calc(2.7302rem - 4.4452vw), 1.48rem);
  }

  .qt-blog-card__status-badge.badge,
  .qt-blog-card__featured-badge.badge {
    font-size: clamp(0.68rem, calc(1.83rem - 3.2vw), 0.93rem);
    line-height: clamp(0.82em, calc(1.42em - 1.66vw), 0.95em);
  }
}

/* Sixth responsive step: below 450px
   Fluid scale referenced between 300px and 450px */
@media (max-width: 449.98px) {
  .blog .article-list {
    margin: 0 1.5rem;
  }

  .qt-blog-card {
    --qtbc-titlebox-offset: clamp(0.85rem, calc(-0.35rem + 6.4vw), 1.45rem);
  }

  .qt-blog-card__title {
    font-size: clamp(0.85rem, calc(-0.41rem + 6.72vw), 1.48rem);
  }

  .qt-blog-card__status-badge.badge,
  .qt-blog-card__featured-badge.badge {
    font-size: clamp(0.49rem, calc(-6.24px + 4.69vw), 0.93rem);
    line-height: clamp(0.7em, calc(0.2em + 2.67vw), 0.95em);
  }
}


/* =========================================================
   QT HOME HERO
   - Background images controlled from custom.css
   - Desktop image: 12:5
   - Mobile image:  3:4 when viewport aspect-ratio <= 2/3
   - Format priority: AVIF > WebP > JPG
   - No fixed min-height
   - Custom bottom wave via SVG
   - Fluid scaling by Bootstrap breakpoints
   - Mobile vertical text scaling from 1000px down to 320px
   - Hero pulled up behind the transparent header

   Classes to use in SP Page Builder:
   - Section:   qt-home-hero-section
   - Column:    qt-home-hero-column
   - Div addon: qt-home-hero-copybox
   - H2 addon:  qt-home-hero-claim
   ========================================================= */

.sp-page-builder .page-content .qt-home-hero-section{
  position: relative;
  overflow: hidden;

  --qthh-image-ratio: 12 / 5;
  --qthh-wave-height: 6.6666667vw;
  --qthh-header-offset: var(--site-header-height);

  /* 1920px -> 1400px fluid desktop scaling */
  --qthh-col-pad-top: clamp(1.8rem, calc(-0.0846rem + 2.1538vw), 2.5rem);
  --qthh-col-pad-inline: clamp(0.72rem, calc(-0.0338rem + 0.8615vw), 1rem);
  --qthh-col-pad-bottom-extra: clamp(0.864rem, calc(-0.0406rem + 1.0338vw), 1.2rem);
  --qthh-col-gap: clamp(2.16rem, calc(-0.1015rem + 2.5846vw), 3rem);

  --qthh-copy-gap: clamp(0.216rem, calc(-0.0102rem + 0.2585vw), 0.3rem);
  --qthh-copy-pad-y: clamp(1.296rem, calc(-0.0609rem + 1.5508vw), 1.8rem);
  --qthh-copy-pad-x: clamp(2.016rem, calc(-0.0948rem + 2.4123vw), 2.8rem);
  --qthh-copy-radius: clamp(0.81rem, calc(-0.0381rem + 0.9692vw), 1.125rem);

  --qthh-h1-fz: clamp(3.6rem, calc(-0.1692rem + 4.3077vw), 5rem);
  --qthh-h1-lh: clamp(4.5rem, calc(-0.2115rem + 5.3846vw), 6.25rem);

  --qthh-p-fz: clamp(1.44rem, calc(-0.0677rem + 1.7231vw), 2rem);
  --qthh-p-lh: clamp(2.25rem, calc(-0.1058rem + 2.6923vw), 3.125rem);

  --qthh-h2-fz: clamp(1.71rem, calc(-0.0804rem + 2.0462vw), 2.375rem);
  --qthh-h2-lh: clamp(2.16rem, calc(-0.1015rem + 2.5846vw), 3rem);

  aspect-ratio: var(--qthh-image-ratio);
  min-height: 0 !important;

  margin-top: calc(-1 * var(--qthh-header-offset));
  z-index: 0;

  background-color: #000000;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: 100% auto !important;

  /* Fallback */
  background-image: url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home/scottish-thistle-edinburgh-castle-view-home-1920.jpg");

  /* Preferred formats */
  background-image: -webkit-image-set(
    url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home/scottish-thistle-edinburgh-castle-view-home-1920.avif") type("image/avif") 1x,
    url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home/scottish-thistle-edinburgh-castle-view-home-1920.webp") type("image/webp") 1x,
    url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home/scottish-thistle-edinburgh-castle-view-home-1920.jpg") type("image/jpeg") 1x
  );
  background-image: image-set(
    url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home/scottish-thistle-edinburgh-castle-view-home-1920.avif") type("image/avif") 1x,
    url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home/scottish-thistle-edinburgh-castle-view-home-1920.webp") type("image/webp") 1x,
    url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home/scottish-thistle-edinburgh-castle-view-home-1920.jpg") type("image/jpeg") 1x
  );
}

/* Keep header above the hero */
#sp-header{
  position: relative;
  z-index: 1000;
}

/* Hide native SP Page Builder bottom shape if still enabled */
.sp-page-builder .page-content .qt-home-hero-section .sppb-shape-container.sppb-bottom-shape{
  display: none !important;
}

/* Make the whole internal structure fill the proportional hero height */
.sp-page-builder .page-content .qt-home-hero-section > .sppb-container-inner,
.sp-page-builder .page-content .qt-home-hero-section > .sppb-container-inner > .sppb-row,
.sp-page-builder .page-content .qt-home-hero-section .sppb-row-column,
.sp-page-builder .page-content .qt-home-hero-section .qt-home-hero-column,
.sp-page-builder .page-content .qt-home-hero-section .qt-home-hero-column > .sppb-column-addons{
  height: 100%;
}

/* Custom bottom wave */
.sp-page-builder .page-content .qt-home-hero-section::after{
  content: "";
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 0;
  height: var(--qthh-wave-height);
  pointer-events: none;
  background: url("/media/mod_qthero/images/hero-bottom-wave.svg") bottom center / 100% 100% no-repeat;
  transform: translateY(1px);
}

/* Keep overlay and content ordered correctly */
.sp-page-builder .page-content .qt-home-hero-section > .sppb-row-overlay{
  z-index: 1;
}

.sp-page-builder .page-content .qt-home-hero-section > .sppb-container-inner{
  position: relative;
  z-index: 2;
}

.sp-page-builder .qt-home-hero-column > .sppb-column-addons{
  min-height: 0 !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  padding:
    calc(var(--qthh-col-pad-top) + var(--qthh-header-offset))
    var(--qthh-col-pad-inline)
    calc(var(--qthh-wave-height) + var(--qthh-col-pad-bottom-extra));
  gap: var(--qthh-col-gap);
}

.sp-page-builder .qt-home-hero-column > .sppb-column-addons > .sppb-addon-wrapper{
  width: 100%;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.sp-page-builder .qt-home-hero-column .sppb-addon-title{
  text-align: center;
  margin: 0 !important;
}

.sp-page-builder .qt-home-hero-copybox{
  display: flex !important;
  flex-direction: column !important;
  align-items: center;
  gap: var(--qthh-copy-gap);

  width: fit-content;
  max-width: calc(100% - 32px);

  margin-left: auto !important;
  margin-right: auto !important;

  padding: var(--qthh-copy-pad-y) var(--qthh-copy-pad-x) !important;
  background: rgba(3, 3, 3, 0.40) !important;
  border-radius: var(--qthh-copy-radius);

  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.sp-page-builder .qt-home-hero-copybox > .sppb-addon-wrapper{
  width: auto;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.sp-page-builder .qt-home-hero-copybox .sppb-addon-title,
.sp-page-builder .qt-home-hero-copybox p,
.sp-page-builder .qt-home-hero-copybox h1{
  text-align: center;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.sp-page-builder .qt-home-hero-copybox h1{
  font-size: var(--qthh-h1-fz) !important;
  line-height: var(--qthh-h1-lh) !important;
}

.sp-page-builder .qt-home-hero-copybox p{
  font-size: var(--qthh-p-fz) !important;
  line-height: var(--qthh-p-lh) !important;
}

.sp-page-builder .qt-home-hero-claim .sppb-addon-title,
.sp-page-builder .qt-home-hero-claim h2{
  font-size: var(--qthh-h2-fz) !important;
  line-height: var(--qthh-h2-lh) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  text-align: center;
}

/* =========================================================
   Bootstrap XL breakpoint
   1400px -> 1200px fluid desktop scaling
   ========================================================= */
@media (max-width: 1399.98px){
  .sp-page-builder .page-content .qt-home-hero-section{
    --qthh-col-pad-top: clamp(1.525rem, calc(-0.125rem + 2.2vw), 1.8rem);
    --qthh-col-pad-inline: clamp(0.61rem, calc(-0.05rem + 0.88vw), 0.72rem);
    --qthh-col-pad-bottom-extra: clamp(0.732rem, calc(-0.06rem + 1.056vw), 0.864rem);
    --qthh-col-gap: clamp(1.83rem, calc(-0.15rem + 2.64vw), 2.16rem);

    --qthh-copy-gap: clamp(0.183rem, calc(-0.015rem + 0.264vw), 0.216rem);
    --qthh-copy-pad-y: clamp(1.098rem, calc(-0.09rem + 1.584vw), 1.296rem);
    --qthh-copy-pad-x: clamp(1.708rem, calc(-0.14rem + 2.464vw), 2.016rem);
    --qthh-copy-radius: clamp(0.68625rem, calc(-0.05625rem + 0.99vw), 0.81rem);

    --qthh-h1-fz: clamp(3.05rem, calc(-0.25rem + 4.4vw), 3.6rem);
    --qthh-h1-lh: clamp(3.8125rem, calc(-0.3125rem + 5.5vw), 4.5rem);

    --qthh-p-fz: clamp(1.22rem, calc(-0.1rem + 1.76vw), 1.44rem);
    --qthh-p-lh: clamp(1.90625rem, calc(-0.15625rem + 2.75vw), 2.25rem);

    --qthh-h2-fz: clamp(1.449583rem, calc(-0.112919rem + 2.083336vw), 1.71rem);
    --qthh-h2-lh: clamp(1.83rem, calc(-0.15rem + 2.64vw), 2.16rem);
  }
}

/* =========================================================
   Bootstrap LG breakpoint
   1200px -> 992px fluid desktop scaling
   ========================================================= */
@media (max-width: 1199.98px){
  .sp-page-builder .page-content .qt-home-hero-section{
    --qthh-col-pad-top: clamp(1.25rem, calc(-0.0615rem + 2.1154vw), 1.525rem);
    --qthh-col-pad-inline: clamp(0.5rem, calc(-0.0246rem + 0.8462vw), 0.61rem);
    --qthh-col-pad-bottom-extra: clamp(0.6rem, calc(-0.0295rem + 1.0154vw), 0.732rem);
    --qthh-col-gap: clamp(1.5rem, calc(-0.0738rem + 2.5385vw), 1.83rem);

    --qthh-copy-gap: clamp(0.15rem, calc(-0.0074rem + 0.2538vw), 0.183rem);
    --qthh-copy-pad-y: clamp(0.9rem, calc(-0.0443rem + 1.5231vw), 1.098rem);
    --qthh-copy-pad-x: clamp(1.4rem, calc(-0.0689rem + 2.3692vw), 1.708rem);
    --qthh-copy-radius: clamp(0.5625rem, calc(-0.0277rem + 0.9519vw), 0.68625rem);

    --qthh-h1-fz: clamp(2.5rem, calc(-0.1231rem + 4.2308vw), 3.05rem);
    --qthh-h1-lh: clamp(3.125rem, calc(-0.1538rem + 5.2885vw), 3.8125rem);

    --qthh-p-fz: clamp(1rem, calc(-0.0492rem + 1.6923vw), 1.22rem);
    --qthh-p-lh: clamp(1.5625rem, calc(-0.0769rem + 2.6442vw), 1.90625rem);

    --qthh-h2-fz: clamp(1.188183rem, calc(-0.0585rem + 2.0108vw), 1.449583rem);
    --qthh-h2-lh: clamp(1.5rem, calc(-0.0738rem + 2.5385vw), 1.83rem);
  }
}

/* =========================================================
   Bootstrap MD breakpoint
   992px -> 768px fluid scaling
   ========================================================= */
@media (max-width: 991.98px){
  .sp-page-builder .page-content .qt-home-hero-section{
    --qthh-col-pad-top: clamp(0.96875rem, calc(0.004464rem + 2.008929vw), 1.25rem);
    --qthh-col-pad-inline: clamp(0.3875rem, calc(0.001786rem + 0.803571vw), 0.5rem);
    --qthh-col-pad-bottom-extra: clamp(0.465rem, calc(0.002143rem + 0.964286vw), 0.6rem);
    --qthh-col-gap: clamp(1.1625rem, calc(0.005357rem + 2.410714vw), 1.5rem);

    --qthh-copy-gap: clamp(0.11625rem, calc(0.000536rem + 0.241071vw), 0.15rem);
    --qthh-copy-pad-y: clamp(0.6975rem, calc(0.003214rem + 1.446429vw), 0.9rem);
    --qthh-copy-pad-x: clamp(1.085rem, calc(0.005rem + 2.25vw), 1.4rem);
    --qthh-copy-radius: clamp(0.4359375rem, calc(0.002009rem + 0.904018vw), 0.5625rem);

    --qthh-h1-fz: clamp(1.9375rem, calc(0.008929rem + 4.017857vw), 2.5rem);
    --qthh-h1-lh: clamp(2.421875rem, calc(0.011161rem + 5.022321vw), 3.125rem);

    --qthh-p-fz: clamp(0.775rem, calc(0.003571rem + 1.607143vw), 1rem);
    --qthh-p-lh: clamp(1.2109375rem, calc(0.00558rem + 2.511161vw), 1.5625rem);

    --qthh-h2-fz: clamp(0.920841825rem, calc(0.004244rem + 1.90958vw), 1.188183rem);
    --qthh-h2-lh: clamp(1.1625rem, calc(0.005357rem + 2.410714vw), 1.5rem);
  }
}

/* =========================================================
   Bootstrap SM breakpoint
   Freeze values at the equivalent 768px size
   ========================================================= */
@media (max-width: 767.98px){
  .sp-page-builder .page-content .qt-home-hero-section{
    --qthh-col-pad-top: 0.96875rem;
    --qthh-col-pad-inline: 0.3875rem;
    --qthh-col-pad-bottom-extra: 0.465rem;
    --qthh-col-gap: 1.1625rem;

    --qthh-copy-gap: 0.11625rem;
    --qthh-copy-pad-y: 0.6975rem;
    --qthh-copy-pad-x: 1.085rem;
    --qthh-copy-radius: 0.4359375rem;

    --qthh-h1-fz: 1.9375rem;
    --qthh-h1-lh: 2.421875rem;

    --qthh-p-fz: 0.775rem;
    --qthh-p-lh: 1.2109375rem;

    --qthh-h2-fz: 0.920841825rem;
    --qthh-h2-lh: 1.1625rem;
  }
}

/* =========================================================
   Vertical viewport mode
   - Switch to mobile image
   - Switch hero ratio to 3:4
   - Mobile wave height
   - Shared 1.5rem side breathing room for text blocks
   - Mobile text/layout scaling from 1000px to 320px
   ========================================================= */
@media (max-aspect-ratio: 2/3){
  .sp-page-builder .page-content .qt-home-hero-section{
    --qthh-image-ratio: 3 / 4;
    --qthh-wave-height: 15.75vw;
    --qthh-mobile-side-space: 1.5rem;

    /* Mobile vertical scaling: 1000px -> 320px */
    --qthh-col-pad-top: clamp(0.65625rem, calc(-0.2702rem + 4.6324vw), 2.625rem);
    --qthh-col-pad-inline: clamp(0.2625rem, calc(-0.1081rem + 1.8529vw), 1.05rem);
    --qthh-col-pad-bottom-extra: clamp(0.315rem, calc(-0.1297rem + 2.2235vw), 1.26rem);
    --qthh-col-gap: clamp(0.7875rem, calc(-0.3243rem + 5.5588vw), 3.15rem);

    --qthh-copy-gap: clamp(0.25rem, calc(-0.6912rem + 4.7059vw), 2.25rem);
    --qthh-copy-pad-y: clamp(1.25rem, calc(0.3676rem + 4.4118vw), 3.125rem);
    --qthh-copy-pad-x: 1rem;
    --qthh-copy-radius: clamp(1.25rem, calc(0.3676rem + 4.4118vw), 3.125rem);

    --qthh-h1-fz: clamp(1.4375rem, calc(-0.3566rem + 8.9706vw), 5.25rem);
    --qthh-h1-lh: clamp(1.75rem, calc(-0.3676rem + 10.5882vw), 6.25rem);

    --qthh-p-fz: clamp(0.84375rem, calc(-0.2298rem + 5.3676vw), 3.125rem);
    --qthh-p-lh: clamp(1.375rem, calc(0.2574rem + 5.5882vw), 3.75rem);

    --qthh-h2-fz: clamp(0.875rem, calc(-0.125rem + 5vw), 3rem);
    --qthh-h2-lh: clamp(1.25rem, calc(0.1324rem + 5.5882vw), 3.625rem);

    background-position: center top !important;
    background-size: 100% auto !important;

    /* Fallback */
    background-image: url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home-mobile/scottish-thistle-edinburgh-castle-view-home-mobile-1080.jpg");

    /* Preferred formats */
    background-image: -webkit-image-set(
      url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home-mobile/scottish-thistle-edinburgh-castle-view-home-mobile-1080.avif") type("image/avif") 1x,
      url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home-mobile/scottish-thistle-edinburgh-castle-view-home-mobile-1080.webp") type("image/webp") 1x,
      url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home-mobile/scottish-thistle-edinburgh-castle-view-home-mobile-1080.jpg") type("image/jpeg") 1x
    );
    background-image: image-set(
      url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home-mobile/scottish-thistle-edinburgh-castle-view-home-mobile-1080.avif") type("image/avif") 1x,
      url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home-mobile/scottish-thistle-edinburgh-castle-view-home-mobile-1080.webp") type("image/webp") 1x,
      url("/images/hero/edinburgh/scottish-thistle-edinburgh-castle-view-home-mobile/scottish-thistle-edinburgh-castle-view-home-mobile-1080.jpg") type("image/jpeg") 1x
    );
  }

  .sp-page-builder .qt-home-hero-copybox{
    max-width: calc(100% - (var(--qthh-mobile-side-space) * 2));
  }

  .sp-page-builder .qt-home-hero-claim .sppb-addon-title,
  .sp-page-builder .qt-home-hero-claim h2{
    max-width: calc(100% - (var(--qthh-mobile-side-space) * 2));
    margin-left: auto !important;
    margin-right: auto !important;
  }
}



/* Temporal */
.tmp-social-section {
    background: rgba(255, 255, 255, 0.95);
    padding: 25px;
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
    width: min(92vw, 460px);
    margin: 30px auto 0;
}

.tmp-social-title {
    font-size: 1.1rem;
    color: #2d3748;
    margin-bottom: 20px;
    font-weight: 600;
}

.tmp-social-icons {
	margin-top: 1.5rem;
    display: flex;
    justify-content: center;
    gap: 25px;
    flex-wrap: wrap;
}

.tmp-social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-decoration: none;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.tmp-social-icon:hover {
    transform: translateY(-5px) scale(1.1);
    box-shadow: 0 8px 25px rgba(0,0,0,0.3);
}

.tmp-social-icon svg {
    width: 32px;
    height: 32px;
    fill: white;
}

.instagram {
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}

.facebook {
    background: #1877f2;
}

.youtube {
    background: #ff0000;
}

@media (max-width: 768px) {
    .tmp-social-icon {
        width: 50px;
        height: 50px;
    }
    
    .tmp-social-icon svg {
        width: 26px;
        height: 26px;
    }
}
