/* ===========================================================
   /travel/ guides (travel.php). On top of style.css + coimbatore.css.
   Everything prefixed .tv-
   =========================================================== */

.tv-hero { padding: 52px 0 46px; }
.tv-hero h1 { max-width: 900px; }
.tv-meta { color: rgba(255,255,255,0.55); font-size: 13.5px; margin-top: 6px; }

.tv-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 44px; align-items: start; }
.tv-sticky { position: sticky; top: calc(var(--navbar-h) + 16px); }

/* Article typography */
.tv-article h2 { font-size: 1.5rem; margin: 38px 0 14px; scroll-margin-top: calc(var(--navbar-h) + 20px); }
.tv-article p, .tv-article li { font-size: 16.5px; line-height: 1.85; color: #2b2b2b; }
.tv-article p { margin: 0 0 14px; }
.tv-article ul, .tv-article ol { padding-left: 22px; margin: 0 0 18px; }
.tv-article ul { list-style: disc; }
.tv-article ol { list-style: decimal; }
.tv-article li { margin-bottom: 8px; }
.tv-article li::marker { color: var(--yellow-dark); font-weight: 800; }
.tv-article a { color: var(--black); text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 2px; }
.tv-article .cbe-area-links a, .tv-article .tv-card { text-decoration: none; }

/* Quick answer */
.tv-answer {
    background: var(--off-white); border: 1px solid #e6e6e6; border-left: 5px solid var(--yellow);
    border-radius: var(--radius-lg); padding: 22px 24px; margin-bottom: 22px;
}
.tv-answer p { margin: 0; font-size: 16.5px; line-height: 1.75; color: var(--black); }
.tv-answer-tag {
    display: inline-flex; align-items: center; gap: 6px; background: var(--black); color: var(--yellow);
    font-size: 12px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase;
    padding: 5px 11px; border-radius: 99px; margin-bottom: 10px;
}

/* Table of contents */
.tv-toc { border: 1px solid #ececec; border-radius: 14px; padding: 16px 20px; background: var(--white); }
.tv-toc strong { display: block; margin-bottom: 6px; }
.tv-toc ol { margin: 0; columns: 2; column-gap: 28px; }
.tv-toc li { font-size: 14.5px; margin-bottom: 4px; break-inside: avoid; }
.tv-toc a { text-decoration: none !important; }
.tv-toc a:hover { text-decoration: underline !important; }

/* Tables */
.tv-table-wrap { overflow-x: auto; margin: 6px 0 20px; border-radius: 14px; border: 1px solid #ececec; }
.tv-table { width: 100%; border-collapse: collapse; min-width: 460px; background: var(--white); }
.tv-table th, .tv-table td { padding: 11px 14px; text-align: left; border-bottom: 1px solid #f1f1f1; font-size: 15px; vertical-align: top; }
.tv-table th { background: var(--black); color: var(--white); font-size: 12.5px; text-transform: uppercase; letter-spacing: .4px; }
.tv-table tbody tr:nth-child(even) td { background: #fafafa; }

/* Tip callout */
.tv-tip { display: flex; gap: 12px; background: rgba(197,245,0,0.12); border: 1px solid rgba(168,212,0,0.45); border-radius: 14px; padding: 14px 16px; margin: 6px 0 20px; font-size: 15.5px; line-height: 1.65; }
.tv-tip i { color: var(--yellow-dark); font-size: 18px; margin-top: 3px; }

/* Fare box inside the article */
.tv-farebox { background: var(--black); color: var(--white); border-radius: var(--radius-lg); padding: 20px 22px; margin: 26px 0; scroll-margin-top: calc(var(--navbar-h) + 20px); }
.tv-farebox-head { display: flex; gap: 14px; align-items: center; margin-bottom: 14px; }
.tv-farebox-head i { width: 44px; height: 44px; border-radius: 12px; background: var(--yellow); color: var(--black); display: inline-flex; align-items: center; justify-content: center; font-size: 19px; flex: none; }
.tv-farebox-head strong { display: block; font-size: 17px; }
.tv-farebox-head span { color: rgba(255,255,255,0.6); font-size: 13px; }
.tv-farebox-rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.tv-farebox-rows div { display: flex; justify-content: space-between; align-items: center; background: var(--black-soft); border: 1px solid rgba(255,255,255,0.08); border-radius: 10px; padding: 10px 12px; }
.tv-farebox-rows small { color: rgba(255,255,255,0.5); }
.tv-farebox-rows strong { color: var(--yellow); font-size: 16px; }
.tv-farebox .btn-block { display: flex; justify-content: center; width: 100%; text-decoration: none !important; color: var(--black); }
.tv-farebox-note { display: block; color: rgba(255,255,255,0.5); font-size: 12px; margin-top: 8px; text-align: center; }

.tv-faq { margin-bottom: 10px; }

/* Cards (hub + related) */
.tv-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-bottom: 36px; }
.tv-cards--small { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tv-card { display: flex; flex-direction: column; background: var(--white); border: 1px solid #ececec; border-radius: var(--radius-lg); padding: 20px 22px; color: var(--black); text-decoration: none; transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition); }
.tv-card:hover { transform: translateY(-3px); border-color: var(--yellow-dark); box-shadow: var(--shadow); }
.tv-card-cat { font-size: 12px; font-weight: 700; color: var(--gray-mid); text-transform: uppercase; letter-spacing: .4px; margin-bottom: 8px; }
.tv-card-cat i { color: var(--yellow-dark); }
.tv-card h3 { font-size: 17px; line-height: 1.35; margin: 0 0 8px; }
.tv-card p { font-size: 14.5px; line-height: 1.6; color: #555; margin: 0 0 12px; flex: 1; }
.tv-card-more { font-weight: 800; font-size: 14px; }

@media (max-width: 1000px) {
    .tv-grid { grid-template-columns: 1fr; }
    .tv-sticky { position: static; }
    .tv-cards, .tv-cards--small { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .tv-cards, .tv-cards--small { grid-template-columns: 1fr; }
    .tv-toc ol { columns: 1; }
    .tv-farebox-rows { grid-template-columns: 1fr; }
}