@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap');

body { margin: 0; background: #FFFFFF; font-family: 'Montserrat', sans-serif; }
a { color: #0090DF; text-decoration: none; }
a:hover { color: #0B2F63; }

@keyframes marqueeScroll { 0% { transform: translate3d(0,0,0); } 100% { transform: translate3d(calc(-50% - 10px),0,0); } }
@keyframes tvSpin { to { transform: rotate(360deg); } }

.tv-reveal { opacity: 0; transform: translateY(16px); transition: opacity 0.45s ease-out, transform 0.45s ease-out; }
.tv-reveal.tv-in { opacity: 1; transform: translateY(0); }
.tv-marquee-track { animation: marqueeScroll 34s linear infinite; will-change: transform; backface-visibility: hidden; }
html, body { -webkit-text-size-adjust: 100%; overflow-x: hidden; }

.tv-track { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.tv-track::-webkit-scrollbar { display: none; }

img { max-width: 100%; }
.tv-img-frame { position: relative; overflow: hidden; background: #fff; }
.tv-img-frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tv-img-frame.tv-img-contain img { object-fit: contain; }
.tv-img-placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 12px; box-sizing: border-box; font-size: 11px; font-weight: 600; color: #0B2F63; opacity: 0.45; background: linear-gradient(135deg,#EAF4FC,#F2F9FE); }

/* Hover states (replace style-hover from the original design component) */
.tv-search-btn:hover { opacity: 1; }
.tv-cta-solid:hover { background: #2D7DD2 !important; }
.tv-link-underline:hover { opacity: 0.8; }
.tv-card:hover { transform: translateY(-12px); }
.tv-arrow-sm:hover { background: #0B2F63 !important; color: #fff !important; }
.tv-modal-order:hover { background: #2D7DD2 !important; color: #fff !important; }
.tv-modal-quotebtn:hover { background: #0B2F63 !important; color: #fff !important; }

@media (max-width: 900px) {
  .tv-nav { display: none !important; }
  .tv-nav-links, .tv-nav-actions { display: none !important; }
  .tv-nav-brand { display: flex !important; }
  .tv-burger { display: inline-flex !important; }
  .tv-banner-deco { display: none !important; }
  .tv-banner-features { font-size: 13.5px !important; gap: 4px !important; }
  .tv-burger { top: 50% !important; transform: translateY(-50%) !important; }
}
@media (min-width: 901px) {
  .tv-burger, .tv-drawer, .tv-scrim { display: none !important; }
}
@media (max-width: 620px) {
  .tv-arrow-sm { display: none !important; }
  .tv-track { gap: 10px !important; }
  .tv-card { width: auto !important; flex: 0 0 calc((100% - 20px) / 3) !important; border-radius: 14px !important; }
  .tv-arrows-top { display: none !important; }
  .tv-track { scroll-snap-type: none !important; }
  .tv-card > div { padding: 10px !important; }
  .tv-card-title { font-size: 12px !important; line-height: 1.25 !important; margin-bottom: 4px !important; }
  .tv-card-desc { font-size: 10px !important; line-height: 1.35 !important; }
}
@media (hover: none) {
  .tv-card:hover { transform: none !important; }
}

.tv-modal-scroll { scrollbar-width: thin; scrollbar-color: rgba(11,47,99,0.25) transparent; }
.tv-modal-scroll::-webkit-scrollbar { width: 6px; }
.tv-modal-scroll::-webkit-scrollbar-thumb { background: rgba(11,47,99,0.22); border-radius: 999px; }
.tv-modal-scroll::-webkit-scrollbar-track { background: transparent; }

@media (max-width: 1100px) {
  .tv-modal-panel { grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; }
  .tv-modal-pad { padding-left: 20px !important; padding-right: 20px !important; }
}
@media (max-width: 820px) {
  .tv-modal-panel { grid-template-columns: 1fr !important; grid-template-rows: minmax(0,42vh) minmax(0,1fr) !important; width: 100vw !important; height: 100vh !important; border-radius: 0 !important; }
  .tv-modal-media { order: 1 !important; border-right: none !important; border-bottom: 1px solid rgba(11,47,99,0.1) !important; }
  .tv-modal-info { order: 2 !important; min-height: 0 !important; }
}
@media (max-height: 760px) {
  .tv-modal-head { padding-top: 16px !important; padding-bottom: 10px !important; }
  .tv-modal-head-title { font-size: 20px !important; margin-bottom: 4px !important; }
  .tv-modal-head-sub { display: none !important; }
  .tv-modal-badges { margin-bottom: 8px !important; }
  .tv-modal-foot { padding-top: 10px !important; padding-bottom: 12px !important; gap: 8px !important; }
  .tv-modal-primary a, .tv-modal-primary button { padding-top: 12px !important; padding-bottom: 12px !important; }
  .tv-modal-thumbs { padding-top: 8px !important; padding-bottom: 10px !important; }
  .tv-modal-thumbs button { width: 60px !important; height: 50px !important; }
}