/* MedNet — Offshore Life Cover landing page
   Kirby Browne / Digital Foundry — v0.3
   Scoped to .mnlc; nothing here escapes the module. */

.mnlc{
  --mn-charcoal:#262223;
  --mn-navy:#142B4E;
  --mn-blue:#2B8FD4;
  --mn-orange:#F0812F;
  --mn-yellow:#FDC82A;
  --mn-teal:#2AA8A0;

  --mn-navy-deep:#0D1E38;
  --mn-yellow-lift:#FFD65A;
  --mn-yellow-wash:#FEF3D2;
  --mn-paper:#F4F7FA;
  --mn-mist:#DCE5EE;
  --mn-mist-soft:#EBF1F6;
  --mn-ink:#262223;
  --mn-ink-soft:#5B6672;

  --mn-shell:1140px;
  --mn-gut:clamp(20px,5vw,48px);
  --mn-bandy:clamp(56px,8vw,100px);

  --mn-display:'Nunito Sans','Segoe UI',Tahoma,sans-serif;
  --mn-body:'Lato','Segoe UI',Tahoma,sans-serif;

  --mn-r:6px;
  --mn-shadow:0 1px 2px rgba(20,43,78,.06), 0 10px 30px rgba(20,43,78,.09);

  font-family:var(--mn-body);
  font-size:clamp(16.5px,1.02vw,18px);
  line-height:1.62;
  color:var(--mn-ink-soft);
  background:#fff;
  -webkit-font-smoothing:antialiased;
}
.mnlc,.mnlc *,.mnlc *::before,.mnlc *::after{box-sizing:border-box}
.mnlc img{max-width:100%; display:block}
.mnlc a{color:var(--mn-blue); text-underline-offset:3px}
.mnlc [id]{scroll-margin-top:100px}
.mnlc :focus-visible{outline:3px solid var(--mn-orange); outline-offset:2px; border-radius:2px}

.mnlc h1,.mnlc h2,.mnlc h3,.mnlc h4{
  font-family:var(--mn-display); font-weight:800; color:var(--mn-navy);
  letter-spacing:-.02em; line-height:1.1; margin:0; padding:0; text-transform:none;
}
.mnlc h1{font-size:clamp(36px,5.3vw,62px); font-weight:900; letter-spacing:-.028em}
.mnlc h2{font-size:clamp(27px,3.3vw,40px)}
.mnlc h3{font-size:clamp(19px,1.5vw,22px); letter-spacing:-.01em; line-height:1.26}
.mnlc p{margin:0 0 1.1em}
.mnlc p:last-child{margin-bottom:0}
.mnlc strong{color:var(--mn-ink); font-weight:700}
.mnlc ul{margin:0; padding:0}

.mn-eyebrow{font-family:var(--mn-display); font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--mn-teal); margin:0 0 16px}
.mn-eyebrow--light{color:var(--mn-yellow)}
.mn-subhead{font-family:var(--mn-display); font-size:clamp(18px,1.5vw,21px); font-weight:800; color:var(--mn-orange); margin:0 0 14px; letter-spacing:-.012em}

.mn-shell{max-width:var(--mn-shell); margin:0 auto; padding-left:var(--mn-gut); padding-right:var(--mn-gut)}
.mn-band{padding-top:var(--mn-bandy); padding-bottom:var(--mn-bandy)}
.mn-band--paper{background:var(--mn-paper)}
.mn-band--navy{background:var(--mn-navy); color:#C9D7E8}
.mn-band--navy h2,.mn-band--navy h3,.mn-band--navy h4{color:#fff}
.mn-lede{font-size:clamp(18.5px,1.45vw,21px); line-height:1.52; color:var(--mn-ink-soft)}
.mn-measure{max-width:62ch}
.mn-dot{width:7px; height:7px; border-radius:50%; background:var(--mn-orange); flex:none}

/* buttons */
.mnlc .mn-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--mn-display); font-size:16px; font-weight:800; letter-spacing:-.005em;
  padding:15px 27px; border-radius:var(--mn-r); border:2px solid transparent;
  cursor:pointer; text-decoration:none; line-height:1.2; text-transform:none;
  transition:background .15s, color .15s, border-color .15s, transform .1s;
}
.mnlc .mn-btn:active{transform:translateY(1px)}
.mnlc .mn-btn--primary{background:var(--mn-yellow); color:var(--mn-navy); border-color:var(--mn-yellow)}
.mnlc .mn-btn--primary:hover{background:var(--mn-yellow-lift); border-color:var(--mn-yellow-lift); color:var(--mn-navy)}
.mnlc .mn-btn--ghost{background:#fff; color:var(--mn-navy); border-color:var(--mn-mist)}
.mnlc .mn-btn--ghost:hover{border-color:var(--mn-navy); color:var(--mn-navy)}
.mnlc .mn-btn--onDark{background:transparent; color:#fff; border-color:rgba(255,255,255,.4)}
.mnlc .mn-btn--onDark:hover{border-color:#fff; background:rgba(255,255,255,.1); color:#fff}

/* hero */
.mn-hero{background:linear-gradient(180deg,#fff 0%,var(--mn-paper) 100%); border-bottom:1px solid var(--mn-mist); padding:clamp(44px,6vw,80px) 0}
.mn-hero__grid{display:grid; grid-template-columns:1.12fr .88fr; gap:clamp(32px,5vw,68px); align-items:center}
.mn-hero__sub{font-size:clamp(18.5px,1.5vw,22px); line-height:1.5; max-width:46ch; margin:20px 0 30px}
.mn-hero__cta{display:flex; flex-wrap:wrap; gap:13px; align-items:center}
.mn-hero__note{font-family:var(--mn-display); font-size:13.5px; font-weight:700; color:var(--mn-ink-soft); margin:20px 0 0; display:flex; align-items:center; gap:9px}
@media(max-width:900px){.mn-hero__grid{grid-template-columns:1fr; gap:38px}}

/* gap meter */
.mn-meter{background:#fff; border:1px solid var(--mn-mist); border-radius:var(--mn-r); padding:24px 24px 20px; box-shadow:var(--mn-shadow)}
.mn-meter--dark{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.18); box-shadow:none}
.mn-meter__head{font-family:var(--mn-display); font-size:11.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--mn-teal); margin:0 0 18px}
.mn-meter--dark .mn-meter__head{color:var(--mn-yellow)}
.mn-meter__plot{display:grid; grid-template-columns:1fr 1fr; gap:18px; height:224px; align-items:end}
.mn-col{position:relative; height:100%}
.mn-col__track{position:relative; width:100%; height:100%}
.mn-col__fill{position:absolute; left:0; right:0; bottom:0; background:var(--mn-navy); border-radius:3px 3px 0 0; transition:height .45s cubic-bezier(.22,.68,.35,1)}
.mn-col__fill--res{background:var(--mn-blue)}
.mn-col__gap{
  position:absolute; left:0; right:0; border:2px dashed var(--mn-orange); border-bottom:none; border-radius:3px 3px 0 0;
  background:repeating-linear-gradient(-45deg, rgba(253,200,42,.42) 0 6px, transparent 6px 12px);
  transition:height .45s cubic-bezier(.22,.68,.35,1), bottom .45s cubic-bezier(.22,.68,.35,1);
  display:flex; align-items:center; justify-content:center;
}
.mn-col__gapLabel{font-family:var(--mn-display); font-size:11.5px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; color:var(--mn-navy); background:var(--mn-yellow); padding:4px 10px; border-radius:3px; white-space:nowrap}
.mn-meter__foot{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:14px; padding-top:14px; border-top:1px solid var(--mn-mist)}
.mn-meter--dark .mn-meter__foot{border-top-color:rgba(255,255,255,.16)}
.mn-meter__label{font-family:var(--mn-display); font-size:12.5px; font-weight:700; color:var(--mn-ink-soft); line-height:1.3; margin:0}
.mn-meter--dark .mn-meter__label{color:rgba(255,255,255,.66)}
.mn-meter__val{font-family:var(--mn-display); font-size:20px; font-weight:900; letter-spacing:-.025em; color:var(--mn-navy); margin:3px 0 0; font-variant-numeric:tabular-nums}
.mn-meter--dark .mn-meter__val{color:#fff}
.mn-meter__caption{font-size:14.5px; color:var(--mn-ink-soft); margin:15px 0 0; line-height:1.45}

/* blue call-out */
.mn-callout{background:var(--mn-blue); color:#fff; padding:clamp(26px,3.4vw,40px); border-radius:var(--mn-r)}
.mn-callout p{font-family:var(--mn-body); font-style:italic; font-weight:700; font-size:clamp(19px,1.8vw,25px); line-height:1.38; color:#fff}
.mn-callout .mn-callout__label{font-family:var(--mn-display); font-style:normal; font-weight:800; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--mn-yellow); margin:0 0 14px}
.mn-imgph{border-radius:var(--mn-r); min-height:260px; background:linear-gradient(140deg,var(--mn-mist-soft),var(--mn-mist)); border:1px dashed #B7C7D8; display:grid; place-items:center; text-align:center; padding:24px}
.mn-imgph p{font-family:var(--mn-display); font-size:13px; font-weight:700; color:#7A8B9C; max-width:26ch; line-height:1.5; margin:0}

/* card grids */
.mn-grid4{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--mn-mist); border:1px solid var(--mn-mist); border-radius:var(--mn-r); overflow:hidden}
.mn-card{background:#fff; padding:clamp(22px,2.4vw,28px)}
.mn-card h3{margin-bottom:9px}
.mn-card p{font-size:16px; line-height:1.55}
@media(max-width:900px){.mn-grid4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.mn-grid4{grid-template-columns:1fr}}

.mn-reasons{display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(26px,3.4vw,48px)}
.mn-reason{display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:start}
.mn-reason__n{font-family:var(--mn-display); font-size:14px; font-weight:900; color:var(--mn-navy); background:var(--mn-yellow); border-radius:50%; width:40px; height:40px; display:grid; place-items:center; flex:none; margin-top:1px}
.mn-reason h3{margin-bottom:7px}
.mn-reason p{font-size:16px; line-height:1.55}
@media(max-width:820px){.mn-reasons{grid-template-columns:1fr}}

/* calculator */
.mn-calc{display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,54px); align-items:start}
@media(max-width:940px){.mn-calc{grid-template-columns:1fr}}
.mn-calc__set{margin-bottom:28px}
.mn-calc__setHead{font-family:var(--mn-display); font-size:11.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--mn-yellow); margin:0 0 14px; padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.16)}
.mn-field{display:grid; grid-template-columns:1fr 148px; gap:14px; align-items:center; margin-bottom:11px}
.mn-field label{font-size:15.5px; line-height:1.35; color:#D3E0EE; font-weight:400; display:block}
.mn-field small{display:block; font-family:var(--mn-display); font-size:12.5px; font-weight:600; color:rgba(255,255,255,.48); margin-top:2px}
.mn-money{position:relative}
.mn-money span{position:absolute; left:12px; top:50%; transform:translateY(-50%); font-family:var(--mn-display); font-size:14px; font-weight:700; color:rgba(255,255,255,.55)}
.mnlc .mn-money input,.mnlc .mn-plain input{
  width:100%; background:rgba(255,255,255,.09); border:1.5px solid rgba(255,255,255,.24);
  border-radius:var(--mn-r); color:#fff; font-family:var(--mn-display); font-size:16px; font-weight:800;
  padding:12px 12px 12px 26px; text-align:right; font-variant-numeric:tabular-nums; height:auto; box-shadow:none;
}
.mnlc .mn-plain input{padding-left:12px}
.mnlc .mn-money input:focus,.mnlc .mn-plain input:focus{background:rgba(255,255,255,.16); border-color:var(--mn-yellow); outline:none}
.mnlc .mn-money input::-webkit-outer-spin-button,.mnlc .mn-money input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}
.mnlc .mn-money input[type=number]{-moz-appearance:textfield}

.mn-result{background:rgba(255,255,255,.07); border:1.5px solid rgba(255,255,255,.2); border-radius:var(--mn-r); padding:clamp(24px,3vw,32px)}
.mn-result__label{font-family:var(--mn-display); font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.68); margin:0}
.mn-result__fig{font-family:var(--mn-display); font-size:clamp(44px,6.4vw,74px); font-weight:900; letter-spacing:-.04em; color:var(--mn-yellow); line-height:1; margin:10px 0 14px; font-variant-numeric:tabular-nums}
.mn-result__note{font-size:15.5px; line-height:1.5; color:rgba(255,255,255,.7); margin-bottom:20px}
.mn-result__cta{display:flex; flex-wrap:wrap; gap:12px}
.mn-privacy{font-family:var(--mn-display); font-size:13px; font-weight:600; color:rgba(255,255,255,.55); margin:18px 0 0; display:flex; gap:9px; align-items:flex-start}

/* split + panels */
.mn-split{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,4.5vw,66px); align-items:start}
@media(max-width:880px){.mn-split{grid-template-columns:1fr}}
.mn-panel{background:#fff; border:1px solid var(--mn-mist); border-radius:var(--mn-r); padding:clamp(24px,3vw,32px); box-shadow:var(--mn-shadow)}
.mn-tick{list-style:none; margin:0; padding:0}
.mn-tick li{position:relative; padding-left:26px; margin-bottom:10px; font-size:16px; line-height:1.5; list-style:none}
.mn-tick li::before{content:""; position:absolute; left:0; top:.58em; width:10px; height:10px; background:var(--mn-yellow); border-radius:50%}
.mn-tick li:last-child{margin-bottom:0}

.mn-why{display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(22px,3vw,36px)}
@media(max-width:820px){.mn-why{grid-template-columns:1fr}}
.mn-why__item{border-top:3px solid var(--mn-yellow); padding-top:16px}
.mn-why__item h3{font-size:19px; margin-bottom:7px}
.mn-why__item p{font-size:15.5px; line-height:1.52}

/* form */
.mn-formwrap{max-width:790px; margin:0 auto}
.mn-steps{display:flex; gap:10px; margin-bottom:26px; align-items:center}
.mn-step{font-family:var(--mn-display); font-size:12.5px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:var(--mn-ink-soft); display:flex; align-items:center; gap:9px}
.mn-step__n{width:27px; height:27px; border-radius:50%; border:2px solid var(--mn-mist); display:grid; place-items:center; font-size:12px; background:#fff}
.mn-step.is-on{color:var(--mn-navy)}
.mn-step.is-on .mn-step__n{background:var(--mn-navy); border-color:var(--mn-navy); color:#fff}
.mn-step.is-done .mn-step__n{background:var(--mn-yellow); border-color:var(--mn-yellow); color:var(--mn-navy)}
.mn-step__bar{flex:1; height:2px; background:var(--mn-mist)}

.mn-q{margin-bottom:22px}
.mnlc .mn-q > label,.mnlc .mn-q__legend{display:block; font-family:var(--mn-display); font-size:15.5px; font-weight:800; color:var(--mn-navy); margin-bottom:10px; text-transform:none; letter-spacing:0}
.mn-q__hint{font-family:var(--mn-body); font-weight:400; font-size:14px; color:var(--mn-ink-soft); display:block; margin-top:3px}
.mn-opts{display:flex; flex-wrap:wrap; gap:9px; border:0; padding:0; margin:0}
.mn-opt{position:relative; margin:0}
.mnlc .mn-opt input{position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer}
.mn-opt span{display:block; font-family:var(--mn-display); font-size:15px; font-weight:700; padding:11px 17px; border:2px solid var(--mn-mist); border-radius:var(--mn-r); background:#fff; color:var(--mn-ink-soft); cursor:pointer; transition:border-color .12s, background .12s, color .12s}
.mnlc .mn-opt input:checked + span{border-color:var(--mn-navy); background:var(--mn-navy); color:#fff}
.mnlc .mn-opt input:focus-visible + span{outline:3px solid var(--mn-orange); outline-offset:2px}
.mn-opt:hover span{border-color:var(--mn-blue)}

.mn-row2{display:grid; grid-template-columns:1fr 1fr; gap:18px}
@media(max-width:640px){.mn-row2{grid-template-columns:1fr}}
.mnlc .mn-inp{
  width:100%; font-family:var(--mn-display); font-size:16px; font-weight:600; padding:13px 14px;
  border:2px solid var(--mn-mist); border-radius:var(--mn-r); background:#fff; color:var(--mn-ink);
  height:auto; box-shadow:none; margin:0;
}
.mnlc .mn-inp:focus{border-color:var(--mn-blue); outline:none}
.mnlc .mn-inp--err{border-color:#C0392B; background:#FDF4F3}
.mnlc select.mn-inp{appearance:none; -webkit-appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--mn-navy) 50%),linear-gradient(135deg,var(--mn-navy) 50%,transparent 50%); background-position:calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size:6px 6px,6px 6px; background-repeat:no-repeat; padding-right:42px}
.mnlc textarea.mn-inp{min-height:94px; resize:vertical; font-family:var(--mn-body); font-weight:400; font-size:16.5px}
.mn-err{color:#C0392B; font-family:var(--mn-display); font-size:13.5px; font-weight:700; margin:6px 0 0; display:none}
.mn-err.is-on{display:block}
.mn-consent{display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:start; font-size:16px; margin-bottom:20px}
.mnlc .mn-consent input{width:20px; height:20px; margin:3px 0 0; accent-color:var(--mn-navy)}
.mn-formnav{display:flex; gap:12px; align-items:center; flex-wrap:wrap; padding-top:8px; border-top:1px solid var(--mn-mist); margin-top:24px}
.mn-spacer{flex:1}
.mn-prefill{display:none; background:var(--mn-yellow-wash); border-left:4px solid var(--mn-yellow); padding:13px 16px; font-family:var(--mn-display); font-size:14.5px; font-weight:700; color:var(--mn-navy); margin-bottom:22px; border-radius:0 var(--mn-r) var(--mn-r) 0}
.mn-prefill.is-on{display:block}
.mn-done{display:none; text-align:center; padding:18px 0}
.mn-done.is-on{display:block}
.mn-done__tick{width:58px; height:58px; border-radius:50%; background:var(--mn-yellow); color:var(--mn-navy); display:grid; place-items:center; margin:0 auto 20px; font-family:var(--mn-display); font-size:29px; font-weight:900}
.mn-payload{text-align:left; background:var(--mn-paper); border:1px solid var(--mn-mist); border-radius:var(--mn-r); padding:18px 20px; margin-top:22px; font-family:var(--mn-display); font-size:13.5px; font-weight:600; color:var(--mn-ink-soft); line-height:1.7}
.mn-payload b{color:var(--mn-navy); font-weight:800}

/* faq */
.mn-faq{max-width:820px; margin:0 auto; border-top:1px solid var(--mn-mist)}
.mn-faq details{border-bottom:1px solid var(--mn-mist)}
.mn-faq summary{cursor:pointer; list-style:none; padding:20px 44px 20px 0; position:relative; font-family:var(--mn-display); font-size:17.5px; font-weight:800; color:var(--mn-navy)}
.mn-faq summary::-webkit-details-marker{display:none}
.mn-faq summary::after{content:"+"; position:absolute; right:8px; top:50%; transform:translateY(-50%); font-size:24px; font-weight:700; color:var(--mn-orange)}
.mn-faq details[open] summary::after{content:"\2013"}
.mn-faq summary:hover{color:var(--mn-blue)}
.mn-faq__body{padding:0 44px 24px 0; font-size:16.5px}

/* final */
.mn-final{background:var(--mn-navy); color:#fff; border-radius:var(--mn-r); padding:clamp(32px,4.5vw,56px); text-align:center}
.mn-final h2{color:#fff; margin-bottom:14px}
.mn-final p{color:rgba(255,255,255,.82); max-width:56ch; margin:0 auto 26px}
.mn-contacts{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--mn-mist); border:1px solid var(--mn-mist); border-radius:var(--mn-r); overflow:hidden; margin-top:clamp(30px,4vw,48px)}
.mn-contact{background:#fff; padding:26px}
.mn-contact h4{font-family:var(--mn-display); font-size:11.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--mn-teal); margin:0 0 12px}
.mnlc .mn-contact a{display:block; font-family:var(--mn-display); font-size:17px; font-weight:800; color:var(--mn-navy); text-decoration:none; margin-bottom:4px}
.mnlc .mn-contact a:hover{color:var(--mn-blue)}
.mn-contact p{font-size:15px; margin:8px 0 0}
@media(max-width:820px){.mn-contacts{grid-template-columns:1fr}}

@media (prefers-reduced-motion: reduce){
  .mnlc *{animation:none !important; transition:none !important}
}
