/*
Theme Name: Coded TV Under Maintenance
Theme URI: https://codedtv.com/
Author: Coded TV
Description: Temporary Coded TV maintenance landing page with direct links to the 8 Saturday AI Training and SME Website offers.
Version: 1.2.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: coded-tv-maintenance
*/
:root {
  --red: #ed1b2f;
  --ink: #101010;
  --paper: #f6f4f3;
  --line: #ded9d7;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
}
.topline {
  height: 7px;
  background: var(--red);
}
header {
  min-height: 118px;
  padding: 20px clamp(24px, 6vw, 90px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;
  border-bottom: 1px solid var(--line);
}
header img {
  display: block;
  width: 112px;
  height: auto;
  object-fit: contain;
}
.contact-link {
  color: var(--ink);
  text-decoration: none;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-bottom: 2px solid var(--red);
  padding: 12px 0;
}
.contact-link span {
  color: var(--red);
  margin-left: 8px;
}
.hero {
  min-height: 670px;
  padding: 90px clamp(24px, 7vw, 110px) 70px;
  background:
    radial-gradient(circle at 80% 25%, #382026 0, transparent 34%),
    linear-gradient(135deg, #0c0b0b 0%, #181011 62%, #300b10 100%);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.hero:after {
  content: "CTV";
  position: absolute;
  right: -35px;
  bottom: -95px;
  font-size: 330px;
  font-weight: 900;
  letter-spacing: -0.12em;
  color: rgba(255, 255, 255, 0.025);
}
.signal {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #ffffff35;
  padding: 10px 14px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.13em;
}
.signal span {
  width: 7px;
  height: 7px;
  background: var(--red);
  border-radius: 50%;
  box-shadow: 0 0 0 6px #ed1b2f25;
}
.eyebrow {
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.17em;
  color: #ff3447;
  margin: 45px 0 18px;
}
.eyebrow.dark {
  color: var(--red);
  margin-top: 0;
}
.hero h1 {
  font-size: clamp(60px, 9.3vw, 138px);
  font-weight: 900;
  line-height: 0.83;
  letter-spacing: -0.065em;
  margin: 0;
  text-transform: uppercase;
  max-width: 1050px;
}
.hero h1 em {
  font-style: normal;
  color: var(--red);
}
.intro {
  max-width: 700px;
  color: #d8cfd1;
  font-size: 18px;
  line-height: 1.75;
  margin: 36px 0 50px;
}
.status {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 230px));
  gap: 1px;
  background: #ffffff22;
  width: max-content;
  max-width: 100%;
}
.status div {
  background: #171214;
  padding: 20px 24px;
  display: flex;
  gap: 14px;
  align-items: center;
}
.status b {
  color: var(--red);
  font-size: 12px;
}
.status span {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
}
.offers {
  padding: 95px clamp(24px, 6vw, 90px);
  display: grid;
  grid-template-columns: minmax(280px, 0.88fr) repeat(2, minmax(0, 1fr));
  gap: clamp(24px, 2.3vw, 38px);
  align-items: stretch;
}
.offers-heading {
  padding: 25px 35px 30px 0;
}
.offers-heading h2,
.contact h2 {
  font-size: clamp(38px, 4.8vw, 68px);
  line-height: 0.92;
  letter-spacing: -0.04em;
  margin: 15px 0;
  text-transform: uppercase;
}
.offers-heading > p:last-child {
  color: #666;
  line-height: 1.7;
  max-width: 370px;
}
.offer-card {
  min-width: 0;
  min-height: 480px;
  padding: 34px;
  background: #fff;
  border: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  transition: 0.25s;
}
.offer-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 24px 55px #3b1b2218;
}
.offer-card:after {
  content: "";
  position: absolute;
  width: 230px;
  height: 230px;
  border-radius: 50%;
  right: -130px;
  top: -130px;
  border: 38px solid #ed1b2f10;
}
.offer-card .number {
  font-size: 13px;
  font-weight: 900;
  color: var(--red);
}
.offer-card > div {
  margin: auto 0;
}
.tag {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.14em;
  color: var(--red);
}
.offer-card h3 {
  font-size: clamp(31px, 3vw, 48px);
  line-height: 0.9;
  letter-spacing: -0.04em;
  margin: 14px 0;
  text-transform: uppercase;
  overflow-wrap: break-word;
}
.offer-card.website h3 {
  font-size: clamp(30px, 2.8vw, 45px);
}
.offer-card > div > p:last-child {
  color: #666;
  line-height: 1.65;
  font-size: 14px;
}
.offer-card a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-decoration: none;
  background: var(--ink);
  color: #fff;
  padding: 17px 19px;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.offer-card a span {
  color: var(--red);
  font-size: 18px;
}
.offer-card.website {
  background: var(--red);
  color: #fff;
  border-color: var(--red);
}
.offer-card.website .number,
.offer-card.website .tag {
  color: #fff;
}
.offer-card.website > div > p:last-child {
  color: #ffe4e8;
}
.offer-card.website a {
  background: #fff;
  color: var(--ink);
}
.contact {
  padding: 75px clamp(24px, 7vw, 110px);
  background: #151112;
  color: #fff;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 50px;
  align-items: center;
}
.contact .eyebrow {
  margin-top: 0;
}
.contact > div > p:last-child {
  color: #c9bfc1;
  line-height: 1.7;
}
.contact-actions {
  display: grid;
  gap: 12px;
}
.contact-actions a {
  border: 1px solid #ffffff30;
  padding: 17px 20px;
  color: #fff;
  text-decoration: none;
  font-size: 14px;
}
.contact-actions .primary {
  background: var(--red);
  border-color: var(--red);
  font-weight: 900;
  text-transform: uppercase;
}
footer {
  padding: 45px clamp(24px, 6vw, 90px);
  background: #fff;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  align-items: center;
  gap: 30px;
  border-top: 1px solid var(--line);
}
footer img {
  width: 92px;
}
footer p {
  font-size: 12px;
  color: #666;
}
footer p:last-child {
  text-align: right;
}
@media (max-width: 980px) {
  .offers {
    grid-template-columns: 1fr 1fr;
  }
  .offers-heading {
    grid-column: 1/-1;
  }
  .hero {
    min-height: auto;
  }
  .status {
    width: 100%;
    grid-template-columns: 1fr;
  }
  .contact {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 620px) {
  header {
    min-height: 98px;
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .hero {
    padding-top: 65px;
  }
  .hero h1 {
    font-size: clamp(53px, 18vw, 82px);
  }
  .intro {
    font-size: 16px;
  }
  .offers {
    grid-template-columns: 1fr;
    padding-top: 65px;
  }
  .offers-heading {
    grid-column: auto;
    padding-right: 0;
  }
  .offer-card {
    min-height: 430px;
  }
  .contact {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  footer {
    grid-template-columns: 1fr;
    text-align: left;
  }
  footer p:last-child {
    text-align: left;
  }
}

/* Dedicated landing pages available during maintenance */
.landing-hero{min-height:690px;background-size:cover;background-position:center;color:#fff;display:flex;align-items:center;padding:90px clamp(24px,7vw,110px)}
.landing-hero>div{max-width:900px}.landing-hero h1{font-size:clamp(55px,8vw,112px);font-weight:900;line-height:.88;letter-spacing:-.055em;margin:15px 0;text-transform:uppercase}.landing-hero h1 em{font-style:normal;color:var(--red)}.landing-hero>div>p:not(.eyebrow){max-width:710px;color:#e4dadd;font-size:18px;line-height:1.75}
.landing-btn{display:inline-block;background:var(--red);color:#fff;padding:18px 23px;text-decoration:none;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;margin-top:22px}.landing-btn.light{background:#fff;color:var(--ink)}
.landing-section{padding:90px clamp(24px,6vw,90px);background:#fff}.landing-heading{display:grid;grid-template-columns:1fr 1.4fr;gap:45px;align-items:end;margin-bottom:45px}.landing-heading h2{font-size:clamp(38px,5vw,72px);line-height:.95;letter-spacing:-.045em;text-transform:uppercase;margin:0}.landing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.landing-grid.three{grid-template-columns:repeat(3,1fr)}.landing-grid article{padding:30px;border:1px solid var(--line);background:var(--paper)}.landing-grid article>b{color:var(--red);font-size:11px;letter-spacing:.1em}.landing-grid h3{font-size:25px;line-height:1.05;text-transform:uppercase;margin:20px 0 12px}.landing-grid p{color:#666;font-size:14px;line-height:1.65}.landing-cta{padding:70px clamp(24px,7vw,110px);background:var(--red);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:35px}.landing-cta .eyebrow{color:#fff;margin:0}.landing-cta h2{font-size:clamp(35px,4vw,62px);text-transform:uppercase;line-height:.95;margin:12px 0}
@media(max-width:900px){.landing-grid,.landing-grid.three{grid-template-columns:1fr 1fr}.landing-heading{grid-template-columns:1fr}.landing-cta{display:block}.landing-cta .landing-btn{margin-top:18px}}
@media(max-width:620px){.landing-hero{min-height:580px;padding-top:65px}.landing-grid,.landing-grid.three{grid-template-columns:1fr}.landing-section{padding-top:65px;padding-bottom:65px}}