/* =====================================================================
   Theme 2 — home page cards, matched to the mockup.
   Loaded after theme2.css.
   ===================================================================== */

/* ---------- Popular destinations: tall cards with a slanted, rounded top ---------- */
.t2-dest-rail { grid-auto-columns: calc((100% - 5 * 16px) / 6); padding-top: 18px; }
.t2-dest { height: 250px; overflow: visible; box-shadow: none; border-radius: 0; }
.t2-dest::after { display: none; }
.t2-dest-shape {
  position: absolute;
  inset: 0;
  overflow: hidden;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130' preserveAspectRatio='none'%3E%3Cpath d='M0 26 Q0 15 11 13.5 L88 1.2 Q100 -0.6 100 11 L100 118 Q100 130 88 130 L12 130 Q0 130 0 118 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130' preserveAspectRatio='none'%3E%3Cpath d='M0 26 Q0 15 11 13.5 L88 1.2 Q100 -0.6 100 11 L100 118 Q100 130 88 130 L12 130 Q0 130 0 118 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
.t2-dest-shape::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6, 22, 56, 0) 45%, rgba(6, 22, 56, 0.82) 100%); }
.t2-dest { filter: drop-shadow(0 10px 16px rgba(11, 30, 67, 0.18)); }
.t2-dest img { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s ease; }
.t2-dest:hover .t2-dest-shape img { transform: scale(1.08); }
.t2-dest-text { z-index: 2; left: 16px; right: 54px; bottom: 16px; }
.t2-dest-text strong { font-size: 1.3rem; font-weight: 700; letter-spacing: -0.01em; text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3); }
.t2-dest-text small { display: block; margin-top: 1px; font-size: 12.5px; opacity: 0.92; }
.t2-dest-go {
  z-index: 2;
  right: 14px;
  bottom: 16px;
  width: 34px;
  height: 34px;
  border: 1.5px solid rgba(255, 255, 255, 0.85);
  background: rgba(11, 30, 67, 0.55);
  color: #fff;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.t2-dest:hover .t2-dest-go { background: var(--t2-orange); border-color: var(--t2-orange); }

/* ---------- Holiday package cards: padded card, inset rounded photo, solid arrow ---------- */
.t2-pkg { padding: 10px; border-radius: 20px; }
.t2-pkg .t2-card-img { height: 170px; border-radius: 14px; }
.t2-pkg .t2-heart { top: 20px; right: 20px; }
.t2-pkg .t2-badge { top: 20px; left: 20px; }
.t2-pkg .t2-card-body { padding: 12px 6px 4px; }
.t2-pkg .t2-card-body h3 { font-size: 1.05rem; font-weight: 600; }
.t2-pkg .t2-sub { margin-bottom: 10px; }
.t2-pkg .t2-incl { gap: 6px 14px; margin: 0 0 14px; padding-bottom: 12px; border-bottom: 1px solid var(--t2-line); font-size: 12px; color: var(--t2-muted); }
.t2-pkg .t2-incl svg { width: 15px; height: 15px; }
.t2-pkg .t2-price strong { font-size: 1.45rem; }
.t2-pkg .t2-go { width: 40px; height: 40px; background: var(--t2-orange); color: #fff; box-shadow: 0 8px 16px rgba(255, 106, 19, 0.3); }
.t2-pkg-grid .t2-pkg:nth-child(4n+3) .t2-go { background: #f43f5e; box-shadow: 0 8px 16px rgba(244, 63, 94, 0.3); }
.t2-pkg-grid .t2-pkg:nth-child(4n) .t2-go { background: #5aa9c9; box-shadow: 0 8px 16px rgba(90, 169, 201, 0.3); }
.t2-pkg:hover .t2-go { transform: translateX(3px); }

/* ---------- Why travel band: title | one white card with 4 features | review carousel ---------- */
.t2-why2 {
  display: grid;
  grid-template-columns: 0.9fr 1.55fr 1.05fr;
  gap: 22px;
  align-items: center;
  padding: 30px 28px;
  border-radius: 28px;
  background:
    linear-gradient(90deg, rgba(6, 22, 56, 0.82) 0%, rgba(6, 22, 56, 0.45) 45%, rgba(6, 22, 56, 0.2) 100%),
    var(--t2-why-img) center / cover no-repeat;
  color: #fff;
  box-shadow: var(--t2-shadow-lg);
}
.t2-why2-title h2 { margin: 0 0 8px; color: #fff; font-size: clamp(1.6rem, 2.6vw, 2.2rem); font-weight: 700; line-height: 1.15; }
.t2-why2-title p { margin: 0; color: rgba(255, 255, 255, 0.88); font-size: 14px; }
.t2-why2-feats { display: grid; grid-template-columns: repeat(4, 1fr); padding: 20px 8px; border-radius: 20px; background: #fff; box-shadow: var(--t2-shadow-lg); }
.t2-why2-feats > div { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 4px 10px; text-align: center; }
.t2-why2-feats > div + div { border-left: 1px solid var(--t2-line); }
.t2-why2-ico { display: inline-flex; width: 50px; height: 50px; margin-bottom: 4px; align-items: center; justify-content: center; border-radius: 50%; background: var(--ico-bg); color: var(--ico-fg); }
.t2-why2-ico svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; }
.t2-why2-feats strong { color: var(--t2-navy); font-size: 14px; font-weight: 600; line-height: 1.2; }
.t2-why2-feats small { color: var(--t2-muted); font-size: 11.5px; line-height: 1.35; }

.t2-reviews { position: relative; }
.t2-review { margin: 0; padding: 22px 22px 18px; border-radius: 20px; background: #fff; color: var(--t2-text); box-shadow: var(--t2-shadow-lg); animation: t2-fade 0.4s ease; }
.t2-review[hidden] { display: none; }
@keyframes t2-fade { from { opacity: 0; transform: translateY(6px); } }
.t2-review blockquote { margin: 0 0 16px; font-size: 13.5px; line-height: 1.65; }
.t2-review figcaption { display: flex; align-items: center; gap: 10px; }
.t2-review figcaption img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.t2-review-who { flex: 1; min-width: 0; }
.t2-review-who strong { display: block; color: var(--t2-navy); font-size: 14px; }
.t2-review-who small { color: var(--t2-muted); font-size: 12px; }
.t2-review-stars { color: #f5a623; font-size: 14px; letter-spacing: 1px; white-space: nowrap; }
.t2-reviews-nav { position: absolute; top: 50%; z-index: 2; display: inline-flex; width: 34px; height: 34px; margin-top: -17px; align-items: center; justify-content: center; border: 0; border-radius: 50%; background: #fff; color: var(--t2-navy); box-shadow: var(--t2-shadow); cursor: pointer; }
.t2-reviews-nav:hover { background: var(--t2-blue); color: #fff; }
.t2-reviews-nav svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.6; }
.t2-reviews-prev { left: -17px; }
.t2-reviews-next { right: -17px; }

/* ---------- Travel inspiration: heading block on the left, card rail on the right ---------- */
.t2-inspo { position: relative; display: grid; grid-template-columns: 250px 1fr; gap: 24px; align-items: start; padding: 24px; border: 1px solid var(--t2-line); border-radius: 24px; background: #fff; box-shadow: var(--t2-shadow); }
.t2-inspo-head h2 { margin: 0 0 6px; color: var(--t2-navy); font-size: 1.6rem; font-weight: 700; }
.t2-inspo-head p { margin: 0; color: var(--t2-muted); font-size: 13.5px; }
.t2-inspo-rail { grid-auto-columns: calc((100% - 4 * 16px) / 5); }
.t2-inspo-rail .t2-blog[hidden] { display: none; }
.t2-inspo-rail .t2-blog-img { height: 100px; }
.t2-inspo-all { position: absolute; right: 24px; top: 24px; }

@media (max-width: 1199.98px) {
  .t2-dest-rail { grid-auto-columns: calc((100% - 3 * 16px) / 4); }
  .t2-why2 { grid-template-columns: 1fr; }
  .t2-inspo { grid-template-columns: 1fr; }
  .t2-inspo-rail { grid-auto-columns: calc((100% - 3 * 16px) / 4); }
}
@media (max-width: 767.98px) {
  .t2-dest-rail { grid-auto-columns: 46%; }
  .t2-why2-feats { grid-template-columns: repeat(2, 1fr); row-gap: 16px; }
  .t2-why2-feats > div:nth-child(3) { border-left: 0; }
  .t2-inspo-rail { grid-auto-columns: 60%; }
  .t2-inspo-all { position: static; }
  .t2-reviews-prev { left: -8px; }
  .t2-reviews-next { right: -8px; }
}

/* ---------- Card typography + arrow buttons (fixes) ---------- */
.t2-page { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.t2-page .t2-card-body h3 { font-family: var(--t2-font); font-size: 1rem; font-weight: 600; line-height: 1.4; letter-spacing: 0; color: var(--t2-navy); }
.t2-page .t2-sub { font-size: 13px; font-weight: 400; color: var(--t2-muted); }
.t2-page .t2-incl { font-weight: 400; }

/* Prices: one weight that Poppins actually ships (600), sized like the mockup. */
.t2-page .t2-price strong { font-family: var(--t2-font); font-size: 1.3rem; font-weight: 600; letter-spacing: -0.01em; color: var(--t2-navy); }
.t2-page .t2-price small { font-size: 12px; font-weight: 400; }
.t2-page .t2-price .t2-price-ask { font-size: 1rem; font-weight: 600; color: var(--t2-blue); }

/* Arrow buttons: solid colour, white arrow, on every card position and on hover. */
.t2-pkg-grid .t2-pkg .t2-go,
.t2-pkg-grid .t2-pkg:hover .t2-go { color: #fff; }
.t2-pkg-grid .t2-pkg:nth-child(4n+1) .t2-go,
.t2-pkg-grid .t2-pkg:nth-child(4n+2) .t2-go { background: var(--t2-orange); box-shadow: 0 8px 16px rgba(255, 106, 19, 0.3); }
.t2-pkg-grid .t2-pkg:nth-child(4n+3) .t2-go { background: #f43f5e; box-shadow: 0 8px 16px rgba(244, 63, 94, 0.3); }
.t2-pkg-grid .t2-pkg:nth-child(4n) .t2-go { background: #3b9ec4; box-shadow: 0 8px 16px rgba(59, 158, 196, 0.3); }
.t2-pkg .t2-go svg { stroke: #fff; stroke-width: 2.8; }
.t2-pkg .t2-go:hover { filter: brightness(1.08); }
