/* ==========================================================================
   London Radio – responsive fixes (v1.0.1)
   v1.1.0: photos fill show and podcast cards, larger small print and
   buttons on touch screens. Loaded after main.css. Fixes text and buttons that were too small on
   phones, images that didn't fill their frames on Elementor pages, and a few
   layouts that were wider than small screens.
   ========================================================================== */

/* ---------- Everywhere ---------- */
/* Media never wider than its box; long words and links wrap instead of pushing the page wider */
body iframe, body video, body embed, body object { max-width: 100%; }
.lr-prose, .lr-ncard__title, .lr-feature__title, .lr-banner__title, .lr-details dd, .lr-mt__title, .lr-cta__title { overflow-wrap: anywhere; }
.lr-prose table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; }
.lr-prose pre { overflow-x: auto; }
.lr-prose img { height: auto; }

/* Elementor sets img { height: auto }, which stopped these photos filling their frames */
body .lr-mt__media img,
body .lr-ncard__media img,
body .lr-prcard__media img,
body .lr-ecard__link img { width: 100%; height: 100% !important; object-fit: cover; }
/* Show and podcast cards: the photo always fills the card */
body .lr-scard__media img,
body .lr-pcard__img { width: 100%; height: 100% !important; object-fit: cover; }

/* Small print readable on every screen */
.lr-head__link { font-size: 12px; }
.lr-scard__desc, .lr-pcard__desc { font-size: 12.5px; }
.lr-badge, .lr-tag, .lr-tab small { font-size: 11px; }

/* Podcast cards: the minimum height forced them wider than their column on small laptops */
.lr-pcard { min-height: 0; min-width: 0; }
@media (min-width: 1025px) and (max-width: 1280px) {
	.lr-podcasts .lr-grid { grid-template-columns: minmax(0, 1fr); }
	.lr-podcasts .lr-pcard { aspect-ratio: 2.6; }
}

/* Grids can always shrink to the screen */
.lr-enquiry__grid > *, .lr-mt__grid > *, .lr-split > *, .lr-footer__top > *, .lr-cta__inner > * { min-width: 0; }
.lr-form { grid-template-columns: minmax(0, 1fr); }
.lr-form input, .lr-form select, .lr-form textarea { max-width: 100%; min-width: 0; }

/* ---------- Tablets ---------- */
@media (max-width: 1100px) {
	/* Mobile menu: bigger, easier taps */
	.lr-menu .sub-menu a { padding: 11px 6px; font-size: 15px; }
	.lr-iconbtn { width: 44px; height: 44px; }
}

@media (max-width: 1024px) {
	/* Advertise strip: keep the text readable over the photo */
	.lr-advert { min-height: 0; background-size: cover; background-position: right center; }
	.lr-advert::before { background: linear-gradient(90deg, #0b0a0a 0%, rgba(11,10,10,.92) 55%, rgba(11,10,10,.7) 100%); }
	.lr-advert__inner { padding: 26px 24px; }
	.lr-footer__right { min-width: 0; }
}

@media (max-width: 900px) {
	.lr-enquiry__grid, .lr-mt__grid { grid-template-columns: minmax(0, 1fr); }
	.lr-feature { padding: 40px 0; }
}

/* ---------- Tablets & phones, and any touch screen ---------- */
@media (max-width: 1024px), (pointer: coarse) {
	/* Readable small print */
	.lr-scard__desc, .lr-pcard__desc { font-size: 12.5px; }
	.lr-pcard__title { font-size: 14px; }
	.lr-head__link { font-size: 12px; padding: 8px 0; }
	.lr-footer__heading { font-size: 12px; }
	.lr-footer__menu { font-size: 14px; line-height: 1.5; }
	.lr-footer__menu li { margin: 0 0 6px; }
	.lr-footer__menu a { display: inline-block; padding: 4px 0; }
	.lr-footer__legal { font-size: 12.5px; }
	.lr-legal-menu { gap: 4px 18px; }
	.lr-legal-menu a { display: inline-block; padding: 6px 0; }
	.lr-badge, .lr-tag { font-size: 11px; }
	.lr-feat__more { font-size: 12.5px; padding: 6px 0; }
	.lr-tab small { font-size: 11px; }

	/* Finger-sized buttons (at least 44px to tap) */
	.lr-play { width: 42px; height: 42px; bottom: 16px; }
	.lr-play .lr-icon { width: 18px; height: 18px; }
	.lr-play--sm { width: 38px; height: 38px; }
	.lr-pcard__body { right: 56px; }
	.lr-social { gap: 6px; }
	.lr-social__link { width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255,255,255,.05); }
	.lr-chip { padding: 10px 16px; }
	.lr-tab { min-height: 48px; justify-content: center; }
	.lr-btn { min-height: 44px; }
	.lr-live__toggle { width: 48px; height: 48px; }
	.lr-vol__btn { min-width: 44px; min-height: 44px; align-items: center; justify-content: center; }
	.lr-live__title a, a.lr-live__title { display: inline-block; padding: 6px 0; }
	.lr-mini__toggle { width: 46px; height: 46px; }
	.page-numbers { min-width: 44px; height: 44px; }
	.lr-faq__item summary { padding: 16px 18px; }

}

/* ---------- Phones ---------- */
@media (max-width: 782px) {
	/* iPhone zooms into form fields with text under 16px */
	.lr-form input, .lr-form select, .lr-form textarea,
	.lr-comments input[type="text"], .lr-comments input[type="email"], .lr-comments input[type="url"], .lr-comments textarea,
	.lr-searchform input[type="search"] { font-size: 16px; }

	/* Layout */
	.lr-hero__inner { padding-top: 56px; }
	.lr-banner { padding: 44px 0 38px; }
	.lr-banner__sub { font-size: 16px; }
	.lr-content { padding-top: 32px; padding-bottom: 48px; }
	.lr-prose { font-size: 16px; }
	.lr-cta { padding: 36px 0; }
	.lr-cta__inner .lr-btn { width: 100%; }
	.lr-pkg { padding: 26px 20px 22px; }
	.lr-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.lr-stat { padding-left: 12px; }
	.lr-advert__row { flex-direction: column; align-items: flex-start; }
	.lr-listen { padding: 36px 0; }
	.lr-listen__card { padding: 22px 18px; }
	.lr-listen__controls { gap: 16px; }
	.lr-feature__img, .lr-feature__img--portrait { width: 100%; max-width: 360px; }
	.lr-postnav { flex-direction: column; }
	.lr-postnav__next { margin-left: 0; text-align: left; }
}

@media (max-width: 640px) {
	/* The big LONDON.RADIO title shrinks to always fit on one line */
	.lr-hero__title { font-size: clamp(26px, calc((100vw - 52px) / 8.4), 64px); margin-left: -2px; white-space: nowrap; }
	.lr-hero__tagline { font-size: clamp(13px, 4.2vw, 20px); letter-spacing: .18em; }
	.lr-container, .lr-inner { padding-left: 18px; padding-right: 18px; }
	.lr-shows .lr-inner, .lr-discover .lr-inner, .lr-podcasts .lr-inner { padding-left: 18px; padding-right: 18px; }
	.lr-footer__cols { grid-template-columns: 1fr 1fr; gap: 20px 16px; }
	.lr-enquiry__form { padding: 18px 16px; }
	.lr-advert { background-image: none !important; }
	.lr-advert .lr-btn { width: 100%; min-height: 44px; }
}

@media (max-width: 480px) {
	/* Buttons with long labels wrap onto two lines rather than spilling off */
	.lr-btn { white-space: normal; text-align: center; line-height: 1.2; }
	.lr-btn--lg { padding: 12px 24px; font-size: 16px; }
	.lr-actions .lr-btn, .lr-pkg .lr-btn { width: 100%; }
	.lr-hero .lr-actions .lr-btn { width: auto; }
	.lr-header__listen { white-space: nowrap; }
	.lr-stats__grid { grid-template-columns: 1fr 1fr; gap: 16px; }
	.lr-stat__num { font-size: 26px; }
	.lr-tile__label { font-size: 12px; gap: 8px; }
	.lr-tile__label .lr-icon, .lr-tile__label svg { width: 18px; height: 18px; }
	.lr-live__img { width: 72px; height: 72px; }
	.lr-feat { padding: 22px 18px 20px; }
}

@media (max-width: 360px) {
	.lr-logo__name { font-size: 19px; }
	.lr-header__actions { gap: 2px; }
	.lr-footer__cols { grid-template-columns: 1fr; }
	.lr-tab { font-size: 11px; }
	.lr-live__show { gap: 10px; }
	.lr-live__img { width: 60px; height: 60px; }
}

/* Touch screens: no hover-only lifts */
@media (hover: none) {
	.lr-scard:hover, .lr-feat:hover { transform: none; }
}