/* Universal Credit Planner practical help */
.uc-help-signpost,.uc-info-link{padding:clamp(80px,10vw,130px) 7vw;display:flex;justify-content:space-between;gap:8vw;align-items:end}.uc-help-signpost{background:var(--blue-pale)}.uc-help-signpost h2,.uc-info-link h2{font-size:clamp(38px,4vw,58px)}.uc-help-signpost p:not(.eyebrow),.uc-info-link p:not(.eyebrow){max-width:720px;color:#526073}.uc-help-signpost .button,.uc-info-link .button{flex:0 0 auto}.app-help-link{margin:-20px 0 50px;padding:20px 22px;border-left:3px solid var(--blue);background:var(--blue-pale);color:#405367}.app-help-link a{font-weight:650;text-underline-offset:3px}
.uc-help-page{background:var(--white)}.help-hero{padding:clamp(75px,10vw,140px) 7vw;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(250px,.7fr);gap:9vw;align-items:end;background:var(--paper)}.help-hero h1{font-size:clamp(48px,5.8vw,84px)}.help-hero-note{padding:34px;border-left:4px solid #9fc4df;background:var(--blue-deep);color:#e4eef4}.help-hero-note strong{display:block;margin-bottom:12px;color:#fff;font-family:Georgia,serif;font-size:27px;font-weight:400;line-height:1.25}.help-hero-note p{margin:0}
.help-topic-index{display:block!important;padding:clamp(75px,9vw,120px) 7vw;background:var(--ink);color:#fff}.help-topic-index .eyebrow{color:#9fc4df}.help-topic-index h2{max-width:760px}.help-topic-index ol{display:grid;grid-template-columns:1fr 1fr;gap:0 38px;margin:50px 0 0;padding:0;list-style:none;border-top:1px solid rgba(255,255,255,.2)}.help-topic-index li{border-bottom:1px solid rgba(255,255,255,.2)}.help-topic-index a{display:flex;align-items:center;gap:18px;min-height:64px;padding:13px 0;color:#e4eaf0;text-decoration:none;font-size:15px;line-height:1.35}.help-topic-index a:hover{color:#fff}.help-topic-index a:focus-visible,.uc-help-page main a:focus-visible{outline:3px solid #9fc4df;outline-offset:4px}.help-topic-index a span{flex:0 0 30px;color:#9fc4df;font-size:11px;letter-spacing:.12em}
.help-articles{background:var(--white)}.help-article{padding:clamp(80px,10vw,135px) 7vw;scroll-margin-top:96px;border-bottom:1px solid var(--line)}.help-article:nth-child(even){background:var(--paper)}.help-article>header{display:grid;grid-template-columns:60px minmax(0,1fr);gap:24px;max-width:1100px}.help-number{margin:13px 0 0;color:var(--blue);font-size:12px;letter-spacing:.13em}.help-label{margin:0;color:var(--blue);font-size:11px;font-weight:650;letter-spacing:.14em;text-transform:uppercase}.help-article h2{margin:16px 0 22px;font-size:clamp(39px,4.8vw,67px)}.help-answer{max-width:900px;margin:0;color:#3f4e61;font-family:Georgia,serif;font-size:clamp(21px,2vw,28px);line-height:1.45}.help-body{max-width:940px;margin:56px 0 0 84px}.help-body>section{padding-top:34px;border-top:1px solid var(--line)}.help-body h3{margin:35px 0 12px;font-family:Georgia,serif;font-size:clamp(24px,2.5vw,32px);font-weight:400;line-height:1.25}.help-body p,.help-body li{color:#526073}.help-body ul{padding-left:22px}.help-body li{margin:9px 0}.help-body code{padding:2px 6px;background:#e4edf3;color:var(--ink);font-size:.9em}.help-caution{margin:34px 0;padding:24px 26px;border-left:4px solid var(--blue);background:var(--blue-pale)}.help-caution strong{color:var(--ink)}.help-sources{margin-top:34px;padding-top:22px;border-top:1px solid var(--line);font-size:14px}.help-sources a{text-decoration:underline;text-underline-offset:3px}.help-article>footer{display:flex;flex-wrap:wrap;gap:8px 28px;margin:48px 0 0 84px;padding-top:18px;border-top:1px solid var(--line);color:#6b7787;font-size:12px}
.fictional-payslip{margin:42px 0;padding:clamp(22px,4vw,40px);background:#fff;border:1px solid #aeb8c1;box-shadow:12px 12px 0 #d7e3eb}.payslip-title{display:flex;justify-content:space-between;gap:20px;padding-bottom:18px;border-bottom:2px solid var(--ink)}.payslip-title strong{font-family:Georgia,serif;font-size:23px}.payslip-title span{color:#657184;font-size:13px}.payslip-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:22px;background:var(--line);border:1px solid var(--line)}.payslip-grid>div{display:flex;flex-direction:column;gap:5px;padding:22px;background:var(--paper)}.payslip-grid small{color:#657184;text-transform:uppercase;letter-spacing:.12em}.payslip-grid b{font-size:17px}.payslip-grid span{color:#526073;font-size:14px}.payslip-net{background:var(--blue-pale)!important}.fictional-payslip figcaption{margin-top:22px;color:#657184;font-size:13px}.help-flow{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:28px 0}.help-flow span{padding:10px 13px;background:var(--blue-pale);color:var(--ink)}.help-flow b{color:var(--blue)}.help-related{padding:clamp(80px,10vw,125px) 7vw;background:var(--blue-pale)}.help-related h2{font-size:clamp(38px,4.5vw,60px)}.help-related-links{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:42px;background:#aebfca;border:1px solid #aebfca}.help-related-links a{padding:30px;background:var(--white);text-decoration:none}.help-related-links strong,.help-related-links span{display:block}.help-related-links strong{font-family:Georgia,serif;font-size:25px;font-weight:400}.help-related-links span{margin-top:8px;color:#526073;font-size:14px}
@media(max-width:900px){.uc-help-signpost,.uc-info-link{display:block}.uc-help-signpost .button,.uc-info-link .button{margin-top:28px}.help-hero{grid-template-columns:1fr}.help-hero-note{max-width:680px}.help-topic-index ol{grid-template-columns:1fr}.help-article>header{grid-template-columns:42px 1fr}.help-body,.help-article>footer{margin-left:66px}.app-info-header nav{flex-wrap:wrap}}
@media(max-width:600px){.uc-help-signpost,.uc-info-link,.help-hero,.help-topic-index,.help-article,.help-related{padding-left:24px;padding-right:24px}.help-hero-note{padding:25px}.help-topic-index ol{margin-top:36px}.help-article>header{grid-template-columns:30px 1fr;gap:12px}.help-body,.help-article>footer{margin-left:42px}.help-body{margin-top:40px}.help-caution{padding:20px}.payslip-title{display:block}.payslip-title span{display:block;margin-top:5px}.payslip-grid{grid-template-columns:1fr}.fictional-payslip{box-shadow:8px 8px 0 #d7e3eb}.help-related-links{grid-template-columns:1fr}.app-info-header nav{gap:8px 14px}.app-info-header nav a{font-size:11px}}
