/* Mappin website V5 - message alignment, darker text, consistent light presentation */
:root{
  --v5-ink:#061b42;
  --v5-text:#294f6d;
  --v5-muted:#3b607d;
  --v5-blue:#087be8;
  --v5-cyan:#18bff3;
  --v5-line:#b8def3;
  --v5-card:#ffffff;
}
body.mappin-commercial main,
body main.v5-main{color:var(--v5-ink)}
body.mappin-commercial main p,
body.mappin-commercial main li,
body.mappin-commercial main .muted,
body main.v5-main p,
body main.v5-main li{color:var(--v5-text)!important}
body.mappin-commercial main small,
body.mappin-commercial main .mc-chip,
body.mappin-commercial main .mc-lead,
body main.v5-main small{color:var(--v5-muted)!important}
body.mappin-commercial main h1,
body.mappin-commercial main h2,
body.mappin-commercial main h3,
body main.v5-main h1,
body main.v5-main h2,
body main.v5-main h3{color:var(--v5-ink)!important}
body.mappin-commercial .mc-quote p,
body.mappin-commercial .v5-quote p{color:#ddecfb!important}

.v5-main{background:linear-gradient(180deg,#f9fdff 0,#edf8ff 48%,#f8fcff 100%)}
.v5-hero{padding:64px 0 46px;background:
  radial-gradient(circle at 82% 12%,rgba(73,199,255,.20),transparent 30%),
  linear-gradient(180deg,#fbfeff,#eef9ff)}
.v5-hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:44px;align-items:center}
.v5-title{margin:10px 0 22px!important;font-size:clamp(3.2rem,6.5vw,6.2rem);line-height:.93;letter-spacing:-.055em;color:var(--v5-ink)!important}
.v5-title.small{font-size:clamp(3rem,5vw,5rem)}
.v5-title span{background:linear-gradient(90deg,#0674df,#12bbed);-webkit-background-clip:text;background-clip:text;color:transparent}
.v5-lead{font-size:1.2rem;line-height:1.62;max-width:760px;color:#244d6e!important}
.v5-support{font-size:1rem;font-weight:900;color:#0a75ca!important;letter-spacing:.01em}
.v5-product-visual{padding:14px;border-radius:24px;background:linear-gradient(135deg,#dff5ff,#f9fdff);border:1px solid #b7def3;box-shadow:0 28px 70px rgba(24,94,148,.15)}
.v5-product-visual img{display:block;width:100%;height:auto;border-radius:16px}
.v5-section{padding:62px 0}.v5-section.alt{background:rgba(230,246,255,.68)}
.v5-section-head{max-width:900px;margin-bottom:26px}.v5-section-head h2{font-size:clamp(2.2rem,4vw,3.8rem);line-height:1.03;margin:8px 0 13px!important}.v5-section-head p{font-size:1.02rem;line-height:1.6}
.v5-four{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.v5-card,.v5-story,.v5-panel,.v5-release{background:rgba(255,255,255,.94);border:1px solid #bddff2;border-radius:18px;box-shadow:0 16px 42px rgba(31,104,158,.09)}
.v5-card{padding:22px}.v5-card h3{margin:9px 0 8px!important;font-size:1.35rem}.v5-card p{margin:0!important;line-height:1.5}
.v5-step{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:linear-gradient(135deg,#0b8cf3,#0767d2);color:white;font-weight:900}
.v5-two{display:grid;grid-template-columns:1fr 1fr;gap:18px}.v5-story{padding:27px}.v5-story h3{font-size:1.8rem;margin:10px 0!important}.v5-story p{line-height:1.62}
.v5-flow{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.v5-flow-step{padding:18px 15px;background:white;border:1px solid #bddff2;border-radius:16px;min-height:160px}
.v5-flow-step em{display:block;color:#0a83df;font-weight:900;font-style:normal;font-size:.8rem;letter-spacing:.08em}
.v5-flow-step b{display:block;color:var(--v5-ink);font-size:1.05rem;margin:8px 0}
.v5-flow-step span{display:block;color:#345b78;font-size:.84rem;line-height:1.48}
.v5-quote{background:linear-gradient(135deg,#0b2b54,#0a67ac);padding:34px;border-radius:24px;color:white;box-shadow:0 24px 60px rgba(10,74,126,.20)}.v5-quote h3{color:white!important;font-size:2rem;margin:0 0 8px!important}
.v5-about-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:30px;align-items:start}.v5-panel{padding:32px}.v5-panel>p{font-size:1rem;line-height:1.62}.v5-panel h2{font-size:1.65rem;margin:28px 0 12px!important}
.v5-release-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.v5-release{padding:18px}.v5-release span,.v5-release small{display:block}.v5-release strong{display:block;color:var(--v5-ink);font-size:1.6rem;margin:4px 0}
.v5-dev{display:grid;gap:5px;color:#315a79;line-height:1.45}

.v5-why{padding:48px 0 66px;background:
  radial-gradient(circle at 84% 12%,rgba(60,197,255,.22),transparent 28%),
  linear-gradient(180deg,#fbfeff,#edf8ff)}
.v5-intro{display:grid;grid-template-columns:1fr .78fr;gap:36px;align-items:end;margin-bottom:26px}.v5-intro>p{font-size:1.06rem;line-height:1.62}

.v5-reader{background:rgba(255,255,255,.86);border:1px solid #b8dcf1;border-radius:23px;padding:12px;box-shadow:0 26px 74px rgba(30,101,156,.12)}
.v5-reader-top{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:4px 6px 12px}.v5-reader-top>strong{font-size:1.08rem;color:var(--v5-ink)}.v5-reader-top>div{display:flex;gap:7px;flex-wrap:wrap}
.v5-tool{min-height:38px;padding:8px 12px;border-radius:10px;border:1px solid #a7d1eb;background:#f9fdff;color:#0a69b8;font-weight:850;text-decoration:none;cursor:pointer}.v5-tool.primary{background:linear-gradient(135deg,#0b8df4,#0866d0);color:white;border-color:#0878d8}
.v5-reader-stage{position:relative;min-height:590px;border-radius:17px;overflow:hidden;background:linear-gradient(135deg,#fdfefe,#e9f8ff);border:1px solid #d0e8f6}
.v5-slide-stack{position:relative;min-height:590px}
.v5-slide{display:none;position:absolute;inset:0;padding:56px 78px 54px;background:
  radial-gradient(circle at 84% 15%,rgba(69,193,255,.22),transparent 25%),
  linear-gradient(145deg,#ffffff 0%,#eef9ff 62%,#e2f4ff 100%);}
.v5-slide:before{content:"";position:absolute;right:-7%;top:-18%;width:45%;height:72%;border-radius:50%;border:2px solid rgba(44,162,230,.16);transform:rotate(-13deg)}
.v5-slide.active{display:grid;grid-template-columns:.86fr 1.14fr;gap:44px;align-items:center}
.v5-slide-copy,.v5-slide-cards{position:relative;z-index:1}.v5-slide-kicker{display:block;color:#0a7fd7;font-size:.78rem;font-weight:900;letter-spacing:.15em;margin-bottom:12px}.v5-slide h2{font-size:clamp(2.9rem,4.8vw,5.5rem);line-height:.93;letter-spacing:-.05em;margin:0 0 20px!important}.v5-slide-copy p{font-size:1.05rem;line-height:1.6;max-width:670px}
.v5-slide-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.v5-slide-card{min-height:112px;background:rgba(255,255,255,.93);border:1px solid #b9ddf1;border-radius:15px;padding:17px;box-shadow:0 12px 32px rgba(32,103,156,.08)}.v5-slide-card b{display:block;color:var(--v5-ink);font-size:1.05rem;margin-bottom:6px}.v5-slide-card span{display:block;color:#315875;font-size:.86rem;line-height:1.43}
.v5-arrow{position:absolute;z-index:6;top:50%;translate:0 -50%;width:46px;height:72px;border-radius:14px;border:1px solid #b3d9ef;background:rgba(255,255,255,.94);color:#0a79cf;font-size:2rem;font-weight:900;cursor:pointer;box-shadow:0 9px 25px rgba(30,96,146,.12)}.v5-arrow.prev{left:12px}.v5-arrow.next{right:12px}
.v5-reader-bar{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:10px 5px 0}.v5-reader-bar>div:first-child{display:flex;align-items:center;gap:10px}.v5-reader-title{color:var(--v5-ink)}.v5-reader-count{font-size:.76rem;font-weight:900;color:#0b73c6;background:#e9f6ff;border-radius:999px;padding:5px 8px}
.v5-mini-thumbs{display:flex;gap:4px;overflow-x:auto}.v5-mini-thumbs button{width:30px;height:28px;border-radius:7px;border:1px solid #badcf0;background:white;color:#426784;font-weight:850;cursor:pointer;font-size:.72rem}.v5-mini-thumbs button.active{background:#0b83e2;color:white;border-color:#0b83e2}
.mc-eyebrow{color:#0b6fbf!important}

@media(max-width:1100px){
  .v5-four{grid-template-columns:repeat(2,1fr)}
  .v5-flow{grid-template-columns:repeat(3,1fr)}
  .v5-hero-grid,.v5-about-grid,.v5-intro{grid-template-columns:1fr}
  .v5-slide.active{grid-template-columns:1fr;padding:48px 66px;gap:20px}
  .v5-slide-cards{grid-template-columns:repeat(2,1fr)}
  .v5-reader-stage,.v5-slide-stack{min-height:720px}
}
@media(max-width:720px){
  .v5-hero{padding-top:36px}.v5-title{font-size:clamp(2.8rem,13vw,4.4rem)}
  .v5-four,.v5-two,.v5-release-grid,.v5-slide-cards{grid-template-columns:1fr}
  .v5-flow{grid-template-columns:1fr 1fr}
  .v5-reader-stage,.v5-slide-stack{min-height:980px}
  .v5-slide.active{padding:42px 46px}
  .v5-slide h2{font-size:clamp(2.4rem,10vw,4rem)}
  .v5-reader-bar{align-items:flex-start;flex-direction:column}
  .v5-reader-top{align-items:flex-start;flex-direction:column}
  .v5-arrow{width:36px;height:54px;font-size:1.5rem}.v5-arrow.prev{left:5px}.v5-arrow.next{right:5px}
  .v5-flow{grid-template-columns:1fr}
}