/* Shared UK-page accessibility and compliance layer. */
:root{
  --ink3:#596074;
  --gold2:#80661f;
  --teal:#00796b;
  --source-link:#6e5718;
}

.skip-link{
  position:fixed;
  left:16px;
  top:12px;
  z-index:10000;
  transform:translateY(-160%);
  padding:10px 16px;
  border-radius:6px;
  background:#0f1117;
  color:#fff;
  font:700 14px/1.2 'Manrope',sans-serif;
  text-decoration:none;
}
.skip-link:focus{transform:translateY(0);outline:3px solid #c8a84b;outline-offset:2px;}

a:focus-visible,button:focus-visible,[role="button"]:focus-visible,
input:focus-visible,select:focus-visible,summary:focus-visible{
  outline:3px solid #00796b!important;
  outline-offset:3px;
}

input[aria-invalid="true"],select[aria-invalid="true"]{
  border-color:#b42318!important;
  box-shadow:0 0 0 3px rgba(180,35,24,.12)!important;
}
.field-error{
  display:block;
  margin-top:5px;
  color:#9b1c1c;
  font-size:11px;
  font-weight:600;
}

.editorial-note{
  max-width:760px;
  margin:20px auto 0;
  padding:12px 16px;
  border:1px solid #dedad2;
  border-radius:8px;
  background:#fff;
  color:#596074;
  font-size:12px;
  line-height:1.55;
  text-align:center;
}
.editorial-note a{
  color:var(--source-link);
  text-decoration:underline;
  text-underline-offset:2px;
}

/* Shared calculator components. Page-specific result displays stay local. */
:where(body.uk-calculator) .explain-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:20px;
}
:where(body.uk-calculator) .explain-card{
  padding:24px;
  border:1px solid var(--rule);
  border-radius:var(--r2);
  background:var(--white);
  box-shadow:var(--shadow);
}
:where(body.uk-calculator) .ec-num{
  margin-bottom:10px;
  color:var(--gold);
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.08em;
  text-align:center;
}
:where(body.uk-calculator) .ec-title{
  margin-bottom:8px;
  color:var(--ink);
  font-family:var(--serif);
  font-size:20px;
  text-align:center;
}
:where(body.uk-calculator) .formula{
  margin:10px 0;
  padding:8px 12px;
  border-left:3px solid var(--gold);
  border-radius:0 var(--r) var(--r) 0;
  background:var(--paper);
  color:var(--teal2);
  font-family:var(--mono);
  font-size:11px;
  text-align:center;
}
:where(body.uk-calculator) .ec-body{
  color:var(--ink2);
  font-size:13px;
  line-height:1.7;
  text-align:center;
}

:where(body.uk-calculator) .faq-list{margin-top:40px;}
:where(body.uk-calculator) .faq-item{
  padding:24px 0;
  border-top:1px solid var(--rule);
}
:where(body.uk-calculator) .faq-item:last-child{border-bottom:1px solid var(--rule);}
:where(body.uk-calculator) .faq-q{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:10px;
  color:var(--ink);
  font-size:15px;
  font-weight:700;
  cursor:pointer;
}
:where(body.uk-calculator) .faq-q::after{
  content:'＋';
  flex-shrink:0;
  margin-top:-2px;
  color:var(--ink4);
  font-size:18px;
  transition:transform .2s;
}
:where(body.uk-calculator) .faq-item.open .faq-q::after{
  color:var(--gold);
  transform:rotate(45deg);
}
:where(body.uk-calculator) .faq-a{
  max-height:0;
  overflow:hidden;
  color:var(--ink2);
  font-size:13px;
  line-height:1.75;
  transition:max-height .3s ease;
}
:where(body.uk-calculator) .faq-a strong{
  color:var(--teal2);
  font-weight:600;
}

:where(body.uk-calculator) .methodology-trigger{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:14px 0;
  cursor:pointer;
  user-select:none;
  transition:opacity .2s;
}
:where(body.uk-calculator) .methodology-trigger:hover{opacity:.7;}
:where(body.uk-calculator) .methodology-trigger-label{
  color:var(--ink3);
  font-family:var(--mono);
  font-size:11px;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  transition:color .2s;
}
:where(body.uk-calculator) .methodology-trigger:hover .methodology-trigger-label,
:where(body.uk-calculator) .methodology-trigger.open .methodology-trigger-label{
  color:var(--gold);
}
:where(body.uk-calculator) .methodology-chevrons{
  color:var(--ink4);
  font-size:16px;
  line-height:1;
  transition:color .2s,transform .3s;
}
:where(body.uk-calculator) .methodology-trigger:hover .methodology-chevrons,
:where(body.uk-calculator) .methodology-trigger.open .methodology-chevrons{
  color:var(--gold);
}
:where(body.uk-calculator) .methodology-trigger.open .methodology-chevrons{
  transform:rotate(180deg);
}
:where(body.uk-calculator) .methodology-box{
  max-height:0;
  overflow:hidden;
  transition:max-height .4s cubic-bezier(.4,0,.2,1);
}
:where(body.uk-calculator) .methodology-box.open{max-height:2000px;}
:where(body.uk-calculator) .methodology-inner{
  padding:24px 4px 8px;
  text-align:center;
}
:where(body.uk-calculator) .meth-title{
  margin-bottom:20px;
  padding-bottom:10px;
  border-bottom:1px solid var(--rule);
  color:var(--gold);
  font-size:10px;
  font-weight:700;
  letter-spacing:.1em;
  text-align:center;
  text-transform:uppercase;
}
:where(body.uk-calculator) .meth-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:20px;
  margin-bottom:20px;
}
:where(body.uk-calculator) .meth-block{
  padding:0 4px;
  text-align:center;
}
:where(body.uk-calculator) .meth-block-title{
  margin-bottom:8px;
  color:var(--ink);
  font-family:var(--sans);
  font-size:12px;
  font-weight:800;
  letter-spacing:-.01em;
}
:where(body.uk-calculator) .meth-formula{
  margin:8px 0;
  color:var(--ink);
  font-family:var(--mono);
  font-size:11px;
  font-weight:500;
  line-height:1.7;
}
:where(body.uk-calculator) .meth-note{
  color:var(--ink3);
  font-size:12px;
  font-weight:500;
  line-height:1.7;
}
:where(body.uk-calculator) .meth-sources{
  margin-top:20px;
  padding:18px 20px;
  background:#faf7ef;
  border:1px solid rgba(128,102,31,.22);
  border-radius:8px;
  color:var(--ink4);
  font-family:var(--mono);
  font-size:11px;
  line-height:1.8;
  text-align:center;
}
:where(body.uk-calculator) .meth-sources strong{
  color:var(--ink3);
  font-weight:600;
}
:where(body.uk-calculator) .meth-sources a{
  color:var(--source-link);
  text-decoration:underline;
  text-underline-offset:2px;
}
:where(body.uk-calculator) .meth-sources a:hover,
.editorial-note a:hover{
  color:var(--gold2);
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important;}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}

/* Official sources trust box refinement */
.meth-sources {
  margin-top:20px;
  padding:18px 20px;
  background:#fffaf0;
  border:1px solid rgba(128,102,31,.22);
  border-radius:8px;
  color:#596074;
  font-size:12px;
  line-height:1.75;
  text-align:center;
}
.meth-sources strong {
  display:block;
  margin-bottom:6px;
  color:#111827;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.meth-sources a {
  color:var(--source-link);
  font-weight:700;
  text-decoration:underline;
}
.footer-disclaimer{
    font-size:12px;
    line-height:1.7;
    color:var(--ink3);
    text-align:center;
}

.footer-disclaimer a{
    color:var(--source-link);
}
/* Footer disclaimer consistency: applies to UK articles/glossary as well as calculators */
.footer-disc{
    font-size:12px;
    line-height:1.7;
    color:var(--ink3);
    max-width:820px;
    margin:20px auto 0;
    text-align:center;
    font-weight:500;
}
.footer-disc a{
    color:var(--source-link);
}

/* Single footer treatment for every UK page, including articles and calculators. */
footer{
  background:#0f1117;
  color:rgba(255,255,255,.5);
  padding:40px 0;
  text-align:center;
}
footer .footer-inner{
  max-width:1100px;
  margin:0 auto 24px;
  padding:0 24px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
}
footer .footer-logo{
  color:#fff;
  font-family:var(--sans, 'Manrope', sans-serif);
  font-size:18px;
  font-weight:800;
}
footer .footer-logo em{color:#c8a84b;font-style:normal;}
footer .footer-links{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;}
footer .footer-links a{
  color:rgba(255,255,255,.5);
  font-size:12px;
  font-weight:500;
  text-decoration:none;
}
footer .footer-links a:hover{color:#fff;}
footer .footer-disc,
footer .footer-disclaimer{
  max-width:820px;
  margin:0 auto;
  padding:16px 24px 0;
  border-top:1px solid rgba(255,255,255,.08);
  color:#c8a84b;
  font-family:var(--sans, 'Manrope', sans-serif);
  font-size:11px;
  font-weight:500;
  line-height:1.7;
  opacity:1;
  text-align:center;
}
footer .footer-disc a,
footer .footer-disclaimer a{color:inherit;}

/* Responsive containment for UK calculators: prevent grid/form min-content overflow. */
:where(body.uk-calculator){max-width:100%;overflow-x:clip;}
:where(body.uk-calculator) :where(.wrap,.calc-section,.calc-layout,.results-panel,.panel,.panel-body,.input-section,.field,.input-wrap,.band-table,.rates-grid,.rates-card,.explain-grid,.explain-card,.methodology-inner,.meth-grid,.meth-block){min-width:0;max-width:100%;}
:where(body.uk-calculator) .calc-layout>*{min-width:0;}
:where(body.uk-calculator) :where(input[type="number"],select,button){max-width:100%;}
:where(body.uk-calculator) :where(.band-head,.band-row)>*{min-width:0;}
:where(body.uk-calculator) :where(.band-label,.band-taxable,.band-tax,.meth-formula,.meth-note,.ec-body){overflow-wrap:anywhere;}
@media(max-width:560px){
  :where(body.uk-calculator) .band-table{overflow-x:auto;-webkit-overflow-scrolling:touch;}
}