/* radiocontent.co.uk — light, modern 2025 aesthetic (no frameworks) */
:root{
  --rc-bg:#ffffff;
  --rc-ink:#0f172a;        /* slate-900 */
  --rc-ink-soft:#334155;   /* slate-700 */
  --rc-border:#e2e8f0;     /* slate-200 */
  --rc-muted:#64748b;      /* slate-500 */
  --rc-white:#ffffff;
  --rc-grad-from:#e0f2fe;  /* sky-100 */
  --rc-grad-to:#eef2ff;    /* indigo-100 */
  --rc-accent-1:#0ea5e9;   /* sky-500/600 */
  --rc-accent-2:#6366f1;   /* indigo-500/600 */
  --rc-shadow:0 1px 2px rgba(0,0,0,.06), 0 10px 20px rgba(2,6,23,.06);
  --rc-radius:22px;
  --rc-radius-sm:14px;
  --rc-radius-lg:28px;
}

*{box-sizing:border-box}
html,body{height:100%}
body.rc-body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  color:var(--rc-ink);
  background: linear-gradient(to bottom, var(--rc-bg), #f8fbff 30%, var(--rc-bg) 75%);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

/* Layout helpers */
.rc-container{max-width:1120px;margin:0 auto;padding:0 16px}
.rc-section{padding:64px 0}
.rc-mt-sm{margin-top:.5rem}

/* Header / Nav */
.rc-header{
  position:sticky; top:0; z-index:40;
  background:rgba(255,255,255,.75);
  backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid rgba(226,232,240,.6);
}
.rc-nav{display:flex; align-items:center; justify-content:space-between; padding:14px 0;}
.rc-brand{display:flex; align-items:center; gap:10px; font-weight:600; letter-spacing:.2px}
.rc-brand-icon{display:inline-flex; align-items:center; justify-content:center}
.rc-menu{display:none; list-style:none; padding:0; margin:0; gap:22px}
.rc-menu a{font-size:.95rem; color:#0b3c5c}
.rc-menu a:hover{color:#075985}
.rc-menu.is-open{display:flex; position:absolute; top:56px; right:16px; flex-direction:column; background:var(--rc-white); border:1px solid var(--rc-border); border-radius:12px; padding:10px; box-shadow:var(--rc-shadow);}

.rc-menu-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:10px; border:1px solid var(--rc-border);
  background:var(--rc-white); color:var(--rc-ink); cursor:pointer;
}
@media (min-width: 820px){
  .rc-menu{display:flex}
  .rc-menu-btn{display:none}
}

/* Buttons */
.rc-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  padding:12px 18px; border-radius:999px; font-weight:600; border:1px solid transparent;
  transition:transform .05s ease, background-color .2s ease, border-color .2s ease;
  box-shadow:0 1px 1px rgba(0,0,0,.04);
}
.rc-btn:active{transform:translateY(1px)}
.rc-btn--primary{color:#fff; background:linear-gradient(90deg, var(--rc-accent-1), var(--rc-accent-2))}
.rc-btn--primary:hover{filter:saturate(110%) brightness(1.02)}
.rc-btn--dark{color:#fff; background:#0f172a}
.rc-btn--dark:hover{background:#0b1220}
.rc-btn--ghost{background:#fff; border-color:var(--rc-border); color:var(--rc-ink)}
.rc-btn--ghost:hover{border-color:#cbd5e1}
.rc-btn--full{width:100%}

/* Hero */
.rc-ornaments{position:fixed; inset:0; pointer-events:none; overflow:hidden}
.rc-blob{position:absolute; border-radius:999px; filter:blur(48px); opacity:.55}
.rc-blob--a{top:-120px; left:-120px; width:380px; height:380px; background:rgba(56,189,248,.45)}
.rc-blob--b{top:160px; right:-90px; width:480px; height:480px; background:rgba(165,180,252,.45)}
.rc-waves{position:absolute; left:50%; top:160px; transform:translateX(-50%); opacity:.28}
.rc-wave{fill:none; stroke-width:2; animation:rc-wave 6s ease-in-out infinite}
.rc-wave.rc-wave--d2{animation-duration:7s}
.rc-wave.rc-wave--d3{animation-duration:8s}
.rc-wave.rc-wave--d4{animation-duration:9s}
@keyframes rc-wave { 0%,100%{opacity:.18} 50%{opacity:.38} }

.rc-hero{padding:72px 0 20px}
.rc-hero__grid{display:grid; gap:32px}
@media (min-width: 960px){ .rc-hero__grid{grid-template-columns:1fr 1fr; align-items:center} }

.rc-h1{font-size:2.2rem; line-height:1.1; margin:0; font-weight:800}
@media (min-width: 600px){ .rc-h1{font-size:2.8rem} }
.rc-grad{background:linear-gradient(90deg, var(--rc-accent-1), var(--rc-accent-2)); -webkit-background-clip:text; background-clip:text; color:transparent}
.rc-lead{margin:.9rem 0 0; font-size:1.1rem; color:var(--rc-ink-soft)}
.rc-actions{display:flex; gap:.6rem; flex-wrap:wrap; margin-top:1rem}

.rc-trust{display:flex; align-items:center; gap:12px; margin-top:28px; color:#64748b; font-size:.9rem}
.rc-line{flex:1; height:1px; background:var(--rc-border)}
.rc-trust__text{white-space:nowrap}

.rc-device{display:flex; justify-content:center}
.rc-device__card{
  width:100%; max-width:420px; border:1px solid var(--rc-border); border-radius:28px;
  background:rgba(255,255,255,.85); box-shadow:var(--rc-shadow); padding:18px; backdrop-filter:blur(8px);
}
.rc-device__top{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; color:var(--rc-muted); font-size:.8rem}
.rc-led{display:flex; align-items:center; gap:8px}
.rc-led__dot{display:inline-block; width:8px; height:8px; border-radius:999px; background:#10b981; box-shadow:0 0 0 0 rgba(16,185,129,.7); animation:rc-pulse 1.6s infinite}
@keyframes rc-pulse { 0%{box-shadow:0 0 0 0 rgba(16,185,129,.7)} 70%{box-shadow:0 0 0 10px rgba(16,185,129,0)} 100%{box-shadow:0 0 0 0 rgba(16,185,129,0)} }
.rc-device__panel{border-radius:20px; background:linear-gradient(135deg, #e0f2fe, #e9e7ff); padding:18px}
.rc-device__title{display:flex; align-items:center; gap:12px}
.rc-badge{display:inline-flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:16px; background:#fff; box-shadow:var(--rc-shadow); color:#0ea5e9}
.rc-device__name{font-weight:600}
.rc-device__sub{font-size:.85rem; color:#5b6472}

.rc-bars{display:flex; align-items:flex-end; gap:3px; height:80px; margin-top:12px; overflow:hidden}
.rc-bar{display:inline-block; width:3px; height:10px; border-radius:6px; background:rgba(14,165,233,.75); animation:rc-eq 1.6s ease-in-out infinite}
@keyframes rc-eq { 0%{height:8px} 50%{height:36px} 100%{height:10px} }

/* Typography */
.rc-h2{font-size:1.65rem; font-weight:800; margin:0 0 18px}
.rc-h3{font-size:1.15rem; font-weight:700; margin:0}

/* Grid of feature cards */
.rc-grid{display:grid; gap:16px}
@media (min-width: 680px){ .rc-grid{grid-template-columns:repeat(2,1fr)} }
@media (min-width: 1024px){ .rc-grid{grid-template-columns:repeat(3,1fr)} }

.rc-card{
  position:relative; overflow:hidden; border:1px solid var(--rc-border);
  background:rgba(255,255,255,.9); border-radius:var(--rc-radius); padding:18px;
  box-shadow:0 1px 1px rgba(0,0,0,.03);
  transition:box-shadow .2s ease, transform .06s ease;
}
.rc-card:hover{box-shadow:var(--rc-shadow); transform:translateY(-1px)}
.rc-card__icon{display:inline-flex; align-items:center; justify-content:center; padding:10px; border-radius:16px; color:#1166bb; background:linear-gradient(135deg, #e0f2fe, #eef2ff)}
.rc-card__body{margin-top:10px; color:var(--rc-ink-soft); font-size:.98rem}
.rc-card__body p{margin:.4rem 0 0}
.rc-card__cta{margin-top:12px; font-weight:600; color:#075985}

/* CTA strip */
.rc-cta{padding:24px 0 64px}
.rc-cta__grid{
  display:grid; gap:18px; align-items:center;
  border:1px solid var(--rc-border); border-radius:var(--rc-radius-lg);
  padding:24px; background:linear-gradient(135deg, #f0f9ff, #eef2ff);
}
@media (min-width: 900px){ .rc-cta__grid{grid-template-columns:1fr auto} }
.rc-cta__actions{display:flex; gap:10px; justify-content:flex-end; flex-wrap:wrap}

/* Contact */
.rc-contact{padding:24px 0 92px}
.rc-contact__grid{display:grid; gap:20px}
@media (min-width: 900px){ .rc-contact__grid{grid-template-columns:1fr 1fr} }
.rc-list{list-style:none; padding-left:0; margin-top:14px}
.rc-list li{margin:.35rem 0}

.rc-form{
  border:1px solid var(--rc-border); border-radius:var(--rc-radius); background:#fff; padding:18px; box-shadow:0 1px 1px rgba(0,0,0,.03);
}
.rc-field{display:flex; flex-direction:column; gap:6px; margin-bottom:12px}
.rc-field--full{grid-column:1 / -1}
.rc-form label{font-size:.92rem; font-weight:600}
.rc-form input,.rc-form select,.rc-form textarea{
  width:100%; padding:10px 12px; border-radius:12px; border:1px solid var(--rc-border); outline:none;
  font:inherit; color:var(--rc-ink); background:#fff;
}
.rc-form input:focus,.rc-form select:focus,.rc-form textarea:focus{border-color:#7dd3fc; box-shadow:0 0 0 3px rgba(125,211,252,.25)}
.rc-form-note{margin:.5rem 0 0; text-align:center; font-size:.78rem; color:#6b7280}

/* Footer */
.rc-footer{border-top:1px solid rgba(226,232,240,.7); background:rgba(255,255,255,.8)}
.rc-footer__inner{display:flex; flex-direction:column; gap:12px; padding:22px 0}
@media (min-width: 820px){ .rc-footer__inner{flex-direction:row; align-items:center; justify-content:space-between} }
.rc-foot-brand{display:flex; align-items:center; gap:8px; color:#475569; font-size:.95rem}
.rc-foot-links{display:flex; gap:12px; flex-wrap:wrap; font-size:.95rem}
.rc-foot-links a:hover{color:#075985}

/* Section card images */
.rc-card__image{
  margin:-18px -18px 16px;
  aspect-ratio:16 / 9;
  overflow:hidden;
  border-bottom:1px solid var(--rc-border);
  background:#f1f5f9;
}

.rc-card__image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.rc-card--with-image .rc-card__body{
  margin-top:0;
}

/* Reduce spacing between section body copy and child page cards */
.rc-section--body-content{
  padding-bottom:24px;
}

.rc-section--children-grid{
  padding-top:12px;
}

.rc-section--body-content + .rc-section--children-grid{
  margin-top:0;
}

/* Branded demo audio player */
.rc-audio-player{
  width:100%;
  max-width:520px;
  margin:28px auto;
  padding:22px;
  box-sizing:border-box;
  border:1px solid var(--rc-border, #dbe4ef);
  border-radius:22px;
  background:
    radial-gradient(circle at top left, rgba(14, 116, 144, 0.08), transparent 34%),
    linear-gradient(180deg, #ffffff, #f8fafc);
  box-shadow:0 18px 45px rgba(15, 23, 42, 0.08);
}

.rc-audio-player__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}

.rc-audio-player__label{
  color:var(--rc-accent, #0369a1);
  font-size:0.86rem;
  font-weight:700;
  letter-spacing:0.04em;
  text-transform:uppercase;
  margin-bottom:4px;
}

.rc-audio-player__title{
  color:var(--rc-ink, #0f172a);
  font-size:1.22rem;
  font-weight:800;
  line-height:1.25;
}

.rc-audio-player__meter{
  display:flex;
  align-items:flex-end;
  gap:4px;
  height:34px;
  min-width:54px;
  padding:7px 8px;
  border-radius:999px;
  background:#eaf3ff;
}

.rc-audio-player__meter span{
  display:block;
  width:5px;
  height:10px;
  border-radius:999px;
  background:var(--rc-accent, #0369a1);
  opacity:0.42;
  transform-origin:bottom;
}

.rc-audio-player.is-playing .rc-audio-player__meter span{
  animation:rc-audio-bars 0.78s ease-in-out infinite;
  opacity:0.95;
}

.rc-audio-player.is-playing .rc-audio-player__meter span:nth-child(2){
  animation-delay:0.12s;
}

.rc-audio-player.is-playing .rc-audio-player__meter span:nth-child(3){
  animation-delay:0.24s;
}

.rc-audio-player.is-playing .rc-audio-player__meter span:nth-child(4){
  animation-delay:0.36s;
}

.rc-audio-player.is-playing .rc-audio-player__meter span:nth-child(5){
  animation-delay:0.48s;
}

@keyframes rc-audio-bars{
  0%, 100%{
    height:9px;
  }

  50%{
    height:25px;
  }
}

.rc-audio-player__progress{
  position:relative;
  height:8px;
  overflow:hidden;
  border-radius:999px;
  background:#e2e8f0;
  margin-bottom:18px;
}

.rc-audio-player__progress-fill{
  display:block;
  width:0%;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, var(--rc-accent, #0369a1), #38bdf8);
  transition:width 0.18s linear;
}

.rc-audio-player__controls{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
}

.rc-audio-player__controls .rc-btn{
  cursor:pointer;
}

.rc-audio-player__controls .rc-btn:disabled{
  cursor:not-allowed;
  opacity:0.48;
}

.rc-audio-player__status{
  color:#64748b;
  font-size:0.95rem;
}

@media (max-width:640px){
  .rc-audio-player{
    padding:18px;
  }

  .rc-audio-player__header{
    align-items:flex-start;
  }

  .rc-audio-player__title{
    font-size:1.08rem;
  }
}

/* Homepage featured-product panel */
.rc-featured{
  width:100%;
  max-width:500px;
  justify-self:center;
  border:1px solid var(--rc-border);
  border-radius:28px;
  background:rgba(255,255,255,.9);
  box-shadow:var(--rc-shadow);
  padding:24px;
  backdrop-filter:blur(8px);
}

.rc-featured__eyebrow{
  color:#075985;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.rc-featured__title{
  margin:8px 0 0;
  font-size:1.5rem;
  line-height:1.2;
}

.rc-featured__intro{
  margin:8px 0 0;
  color:var(--rc-ink-soft);
}

.rc-featured__list{
  display:grid;
  gap:10px;
  margin-top:18px;
}

.rc-featured__item{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:16px;
  align-items:center;
  padding:14px;
  border:1px solid var(--rc-border);
  border-radius:16px;
  background:#fff;
  transition:border-color .2s ease, box-shadow .2s ease, transform .06s ease;
}

.rc-featured__item:hover{
  border-color:#bae6fd;
  box-shadow:0 8px 20px rgba(2,6,23,.06);
  transform:translateY(-1px);
}

.rc-featured__copy{
  display:grid;
  gap:4px;
  min-width:0;
}

.rc-featured__copy strong{
  color:var(--rc-ink);
  font-size:.98rem;
}

.rc-featured__copy small{
  color:var(--rc-muted);
  font-size:.82rem;
  line-height:1.35;
}

.rc-featured__price{
  display:grid;
  justify-items:end;
  color:#075985;
  font-size:1.05rem;
  font-weight:800;
  white-space:nowrap;
}

.rc-featured__price small{
  color:var(--rc-muted);
  font-size:.68rem;
  font-weight:600;
}

.rc-featured__link{
  display:inline-flex;
  margin-top:16px;
  color:#075985;
  font-weight:700;
}

/* Company disclosure beneath the common footer */
.rc-foot-legal{
  padding:0 16px 22px;
  color:#64748b;
  font-size:.78rem;
  line-height:1.55;
}

.rc-foot-legal p{
  max-width:920px;
  margin:0;
}

@media (max-width:600px){
  .rc-featured{
    padding:18px;
  }

  .rc-featured__item{
    grid-template-columns:1fr;
    gap:8px;
  }

  .rc-featured__price{
    justify-items:start;
  }
}

/* Mobile page-edge breathing room */
@media (max-width: 760px) {
  main .rc-container {
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right: max(16px, env(safe-area-inset-right));
    box-sizing: border-box;
  }
}