/* Coordination Tax Calculator (/coordination-tax)
   Page-scoped additions only. Colours, radii, borders, fonts, buttons and the select shell come
   from the tokens and components in styles.css. Selectors are prefixed ct- to avoid collisions.
   Loaded after styles.css. */

.ct-sr{
  position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:0;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;
}
.ct-success[hidden], [data-ct-form-view][hidden], .ct-form-error[hidden], .hp-field[hidden]{display:none !important;}

/* ---------- Hero ---------- */
.ct-hero{padding:104px 0 48px;}
.ct-hero h1{max-width:860px;}
.ct-lede{max-width:720px; font-size:1.15rem; color:rgba(26,26,26,.8); margin:0 0 22px;}
.ct-micro{margin:0; font-family:'Lato',Arial,sans-serif; font-size:.82rem; letter-spacing:.02em; color:rgba(11,21,35,.6);}
.ct-noscript{margin:0 0 24px; font-size:.95rem;}

/* ---------- Calculator ---------- */
.ct-calc{background:var(--cream); padding:24px 0 72px;}
.ct-grid{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:24px; align-items:start;}

.ct-panel{
  background:#fff; border:var(--hairline) solid var(--hairline-color); border-radius:var(--radius-xs);
  padding:32px; box-shadow:var(--card-sheen);
}
.ct-panel-head{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:28px;}
.ct-card-label{
  display:block; font-family:'Lato',Arial,sans-serif; font-weight:700; font-size:.75rem; text-transform:uppercase;
  letter-spacing:.08em; color:var(--teal);
}
.ct-card-label-dark{color:var(--teal-on-dark);}

/* Currency switch */
.ct-currency{display:inline-flex; border:var(--hairline) solid rgba(11,21,35,.2); border-radius:var(--radius-xs); overflow:hidden;}
.ct-currency button{
  font-family:'Lato',Arial,sans-serif; font-weight:700; font-size:.75rem; letter-spacing:.06em; text-transform:uppercase;
  padding:8px 16px; background:#fff; color:var(--navy); border:0; cursor:pointer; transition:background .15s ease, color .15s ease;
}
.ct-currency button[aria-checked="true"]{background:var(--navy); color:#fff;}
.ct-currency button:focus-visible{outline:2px solid var(--teal); outline-offset:-2px;}

/* Controls */
.ct-control{padding:22px 0; border-top:var(--hairline) solid rgba(11,21,35,.1);}
.ct-control:first-of-type{border-top:0; padding-top:0;}
.ct-control-top{display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:14px;}
.ct-control label, .ct-label{
  font-family:'Lato',Arial,sans-serif; font-weight:700; font-size:.8rem; text-transform:uppercase;
  letter-spacing:.04em; color:var(--navy); line-height:1.35;
}
.ct-label{display:block; margin-bottom:12px;}
.ct-control-optional{border-top:var(--hairline) solid var(--hairline-color); padding-top:22px; margin-top:6px;}
.ct-perday{margin-top:10px;}
.ct-whatif{margin-top:8px;}
/* Qualitative note: dashed hairline marks it as outside the model */
.ct-note{border:var(--hairline) dashed rgba(11,21,35,.28); border-radius:var(--radius-card); padding:24px 28px;}
.ct-note-title{font-family:'Montserrat',Arial,sans-serif; font-weight:600; font-size:1.05rem; line-height:1.4; color:var(--navy); margin:10px 0 10px;}
.ct-note p{margin:0 0 8px; font-size:.92rem; color:rgba(26,26,26,.75);}
.ct-note .ct-note-title{font-size:1.05rem; color:var(--navy); margin:10px 0 10px;}
.ct-note-link{display:inline-block; margin-top:8px; font-family:'Lato',Arial,sans-serif; font-weight:700; font-size:.9rem; color:var(--teal); text-decoration:none; border-bottom:var(--hairline) solid currentColor;}
.ct-note-link:hover{color:var(--navy);}
.ct-note-link:focus-visible{outline:2px solid var(--teal); outline-offset:3px;}
.ct-metric-primary .ct-whatif strong{color:#fff;}
.ct-chips{display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 0;}
.ct-chips button{
  font-family:'Lato',Arial,sans-serif; font-weight:700; font-size:.82rem; color:var(--navy); cursor:pointer;
  padding:7px 12px; background:#fff; border:var(--hairline) solid var(--hairline-color); border-radius:var(--radius-xs);
  transition:border-color .2s ease, background-color .2s ease;
}
.ct-chips button:hover{border-color:var(--teal); background:rgba(29,111,138,.06);}
.ct-chips button:focus-visible{outline:2px solid var(--teal); outline-offset:2px;}
.ct-chips button[aria-pressed="true"]{border-color:var(--teal); background:rgba(29,111,138,.12);}
.ct-helper{margin-top:14px; border-top:var(--hairline) solid var(--hairline-color); padding-top:12px;}
.ct-helper summary{cursor:pointer; font-family:'Lato',Arial,sans-serif; font-weight:700; font-size:.85rem; color:var(--navy);}
.ct-helper-body{display:flex; flex-direction:column; gap:10px; padding-top:12px;}
.ct-tick{display:flex; align-items:flex-start; gap:10px; cursor:pointer; font-size:.9rem; color:var(--ink);}
.ct-helper-body label.ct-tick{
  font-family:'Lato',Arial,sans-serif; font-weight:400; font-size:.9rem; text-transform:none; letter-spacing:0; color:var(--ink); margin:0;
}
.ct-tick input{width:18px; height:18px; margin:2px 0 0; accent-color:var(--navy); flex:none;}
.ct-helper-body .ct-help{margin:2px 0 0;}
.ct-helper-body .ct-btn-sm{align-self:flex-start;}
.ct-helper-body [hidden]{display:none !important;}
.ct-btn-sm{padding:9px 16px; font-size:.85rem;}
.ct-metric-primary .ct-perday strong{color:#fff;}
.ct-num{display:flex; align-items:baseline; gap:6px; flex:none;}
.ct-unit{font-family:'Lato',Arial,sans-serif; font-size:.85rem; color:rgba(11,21,35,.6);}
.ct-num input{
  width:104px; padding:9px 12px; text-align:right; border:var(--hairline) solid var(--hairline-color); border-radius:var(--radius-md);
  font-family:'Montserrat',Arial,sans-serif; font-weight:600; font-size:1.05rem; color:var(--navy); background:#fff; outline:none;
  font-variant-numeric:tabular-nums; -moz-appearance:textfield; appearance:textfield;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.ct-num input::-webkit-outer-spin-button, .ct-num input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
.ct-num input:focus{border-color:var(--navy); box-shadow:0 0 0 3px rgba(29,111,138,.16);}
.ct-help{margin:12px 0 0; font-size:.85rem; color:rgba(26,26,26,.65);}

/* Range slider: --pct is set from JS so the filled part of the track follows the thumb */
.ct-range{
  -webkit-appearance:none; appearance:none; display:block; width:100%; height:24px; margin:0; padding:0;
  background:transparent; cursor:pointer;
  --pct:0%;
}
.ct-range:focus{outline:none;}
.ct-range::-webkit-slider-runnable-track{
  height:4px; border-radius:var(--radius-pill);
  background:linear-gradient(to right, var(--teal) 0, var(--teal) var(--pct), rgba(11,21,35,.12) var(--pct), rgba(11,21,35,.12) 100%);
}
.ct-range::-moz-range-track{height:4px; border-radius:var(--radius-pill); background:rgba(11,21,35,.12);}
.ct-range::-moz-range-progress{height:4px; border-radius:var(--radius-pill); background:var(--teal);}
.ct-range::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none; width:20px; height:20px; margin-top:-8px; border-radius:50%;
  background:var(--navy); border:0; box-shadow:0 0 0 3px #fff, 0 0 0 4px var(--teal);
}
.ct-range::-moz-range-thumb{
  width:20px; height:20px; border-radius:50%; background:var(--navy); border:0; box-shadow:0 0 0 3px #fff, 0 0 0 4px var(--teal);
}
.ct-range:focus-visible::-webkit-slider-thumb{outline:2px solid var(--teal); outline-offset:5px;}
.ct-range:focus-visible::-moz-range-thumb{outline:2px solid var(--teal); outline-offset:5px;}

/* Friction presets */
.ct-presets{display:grid; grid-template-columns:repeat(3, 1fr); gap:12px;}
.ct-presets button{
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:6px; text-align:center;
  background:#fff; border:var(--hairline) solid rgba(11,21,35,.15); border-radius:var(--radius-xs);
  padding:16px 10px; cursor:pointer; color:var(--ink); transition:border-color .15s ease, background .15s ease;
}
.ct-presets button:hover{border-color:var(--teal); background:rgba(29,111,138,.06);}
.ct-presets button:focus-visible{outline:2px solid var(--teal); outline-offset:2px;}
.ct-presets button[aria-checked="true"]{border-color:var(--teal); background:rgba(29,111,138,.12);}
.ct-preset-num{font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:1.35rem; color:var(--navy); line-height:1;}
.ct-preset-cap{font-family:'Lato',Arial,sans-serif; font-size:.8rem; line-height:1.3;}

/* ---------- Readout ---------- */
.ct-readout{display:flex; flex-direction:column; gap:20px; position:sticky; top:100px;}
.ct-metric{
  background:#fff; border:var(--hairline) solid var(--hairline-color); border-radius:var(--radius-xs);
  padding:26px 28px; box-shadow:var(--card-sheen);
}
.ct-big{
  margin:12px 0 8px; font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:2.9rem; line-height:1.05;
  color:var(--navy); font-variant-numeric:tabular-nums; overflow-wrap:anywhere;
}
.ct-big-sm{font-size:2.1rem;}
.ct-big-unit{font-weight:500; font-size:1.05rem; color:rgba(11,21,35,.55);}
.ct-sub{margin:0; font-size:.93rem; color:rgba(26,26,26,.75);}
.ct-sub strong{color:var(--navy);}

.ct-metric[hidden]{display:none !important;}
.ct-metric-primary{
  background:radial-gradient(120% 85% at 50% 0%, #152740 0%, var(--navy) 100%); border-color:rgba(255,255,255,.12);
}
.ct-metric-primary .ct-card-label{color:var(--teal-on-dark);}
.ct-metric-primary .ct-big{color:#fff;}
.ct-metric-primary .ct-big-unit{color:rgba(255,255,255,.65);}
.ct-metric-primary .ct-sub{color:rgba(255,255,255,.8);}
.ct-breakdown{margin:22px 0 0; padding:0;}
.ct-breakdown div{display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-top:var(--hairline) solid rgba(255,255,255,.14); font-size:.88rem;}
.ct-breakdown dt{color:rgba(255,255,255,.7);}
.ct-breakdown dd{margin:0; color:#fff; font-weight:700; font-variant-numeric:tabular-nums; text-align:right;}

/* ---------- How it is calculated ---------- */
.ct-maths{margin-top:24px; background:#fff; border:var(--hairline) solid var(--hairline-color); border-radius:var(--radius-xs);}
.ct-maths summary{
  cursor:pointer; padding:16px 22px; font-family:'Lato',Arial,sans-serif; font-weight:700; font-size:.8rem;
  text-transform:uppercase; letter-spacing:.06em; color:var(--navy); list-style:none;
}
.ct-maths summary::-webkit-details-marker{display:none;}
.ct-maths summary::after{content:"+"; float:right; color:var(--teal); font-size:1.1rem; line-height:1;}
.ct-maths[open] summary::after{content:"\2212";}
.ct-maths summary:focus-visible{outline:2px solid var(--teal); outline-offset:-2px;}
.ct-maths-body{padding:0 22px 20px; font-size:.93rem; color:rgba(26,26,26,.78);}
.ct-maths-body p{margin:0 0 12px; max-width:760px;}
.ct-maths-body ul{margin:0 0 12px; padding-left:20px;}
.ct-maths-body li{margin-bottom:4px;}

/* ---------- Lead capture ---------- */
.ct-capture{background:var(--cream); padding:0 0 88px;}
.ct-capture-card{
  background:#fff; border:var(--hairline) solid var(--hairline-color); border-radius:var(--radius-xs);
  padding:40px; box-shadow:var(--card-sheen); max-width:880px; margin:0 auto;
}
.ct-capture-card h2{font-size:1.7rem; margin:0 0 10px;}
.ct-capture-sub{color:rgba(26,26,26,.75); margin:0 0 26px; max-width:640px;}
.ct-form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px 18px; margin-bottom:6px;}
.ct-form .field{margin-bottom:12px;}
.ct-form label{
  display:block; font-family:'Lato',Arial,sans-serif; font-weight:700; font-size:.8rem;
  text-transform:uppercase; letter-spacing:.04em; color:var(--navy); margin-bottom:6px;
}
.ct-form input[type="email"], .ct-form input[name="name"]{
  width:100%; padding:12px 14px; border:var(--hairline) solid var(--hairline-color); border-radius:var(--radius-md);
  font-family:'Lato',Arial,sans-serif; font-size:.95rem; color:var(--navy); background:#fff; outline:none;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.suite .ct-form input[name="name"]{border-color:var(--s-line-input); border-radius:var(--s-radius-sm); background:#fff;}
.ct-form input[type="email"]:focus, .ct-form input[name="name"]:focus{border-color:var(--navy); box-shadow:0 0 0 3px rgba(29,111,138,.16);}
.ct-form .select-shell:focus-within{box-shadow:0 0 0 3px rgba(29,111,138,.16);}
.ct-form .is-invalid input, .ct-form .is-invalid .select-shell{border-color:#a3402f;}
.ct-field-error{display:none; color:#a3402f; font-size:.8rem; margin-top:6px;}
.is-invalid .ct-field-error{display:block;}
/* Contact consent: unticked by default */
.ct-form .ct-check{
  display:flex; align-items:center; gap:10px; cursor:pointer; margin:4px 0 0;
  font-family:'Lato',Arial,sans-serif; font-weight:700; font-size:.95rem; text-transform:none; letter-spacing:0; color:var(--navy);
}
.ct-form .ct-check input{width:18px; height:18px; margin:0; accent-color:var(--navy); flex:none;}
.ct-check-note{font-size:.8rem; color:rgba(11,21,35,.6); margin:4px 0 18px 28px;}
.ct-submit{width:100%; justify-content:center; margin-top:6px;}
.ct-submit:disabled{opacity:.65; cursor:not-allowed;}
.ct-form-microcopy{font-size:.78rem; color:rgba(11,21,35,.55); text-align:center; margin:14px 0 0;}
.ct-form-microcopy a{color:inherit; text-decoration:underline;}
.ct-form-error{font-size:.85rem; color:#b3261e; text-align:center; margin:14px 0 0;}
.ct-form-error a{color:inherit; text-decoration:underline;}

.ct-success{text-align:center; padding:28px 0; outline:none;}
.ct-success-icon{
  width:40px; height:40px; margin:0 auto 18px; border:var(--hairline) solid var(--hairline-color); border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:var(--teal);
}
.ct-success-icon svg{width:20px; height:20px;}
/* Unlocked state: download, book, share */
.ct-success-sub{margin:10px auto 0; max-width:520px; color:rgba(26,26,26,.75);}
.ct-actions{display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin:26px 0 0;}
.ct-share{margin:30px auto 0; padding-top:24px; border-top:var(--hairline) solid var(--hairline-color); max-width:640px; display:flex; flex-direction:column; gap:18px;}
.ct-share-group{display:flex; flex-direction:column; align-items:center; gap:10px;}
.ct-share-title{font-family:'Lato',Arial,sans-serif; font-weight:700; font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; color:var(--navy);}
.ct-share-row{display:flex; flex-wrap:wrap; gap:8px; justify-content:center;}
.ct-btn-sm{padding:9px 16px; font-size:.85rem;}
.ct-share-status{min-height:1.2em; margin:0; font-size:.82rem; color:var(--teal); overflow-wrap:anywhere;}
.ct-confirm{margin:0; font-family:'Montserrat',Arial,sans-serif; font-weight:600; font-size:1.1rem; line-height:1.5; color:var(--navy); overflow-wrap:anywhere;}

/* ---------- Bridge: navy strip, same family as #scorecard and #contact ---------- */
.ct-bridge{background:radial-gradient(120% 85% at 50% 0%, #152740 0%, var(--navy) 100%); padding:84px 0;}
.ct-bridge h2{color:#fff; max-width:760px; margin:0 0 36px;}
.ct-bridge-grid{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:24px;}
.ct-path{
  display:flex; flex-direction:column; align-items:flex-start; gap:14px;
  border:var(--hairline) solid rgba(255,255,255,.18); border-radius:var(--radius-xs); padding:30px;
  background:rgba(255,255,255,.04);
}
.ct-path p{color:rgba(255,255,255,.82); margin:0 0 10px; flex:1;}
.ct-path .btn{text-align:left; white-space:normal; line-height:1.4;}
.ct-btn-ondark{color:#fff; border-color:rgba(255,255,255,.6);}
.ct-btn-ondark:hover{background:#fff; color:var(--navy);}
.ct-path .btn:focus-visible{outline:2px solid var(--teal-on-dark); outline-offset:3px;}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .ct-grid{grid-template-columns:1fr;}
  .ct-readout{position:static;}
}
@media (max-width:860px){
  .ct-hero{padding:72px 0 32px;}
  .ct-bridge{padding:64px 0;}
  .ct-bridge-grid{grid-template-columns:1fr;}
  .ct-capture{padding-bottom:64px;}
}
@media (max-width:640px){
  .ct-panel{padding:24px 20px;}
  .ct-control-top{flex-direction:column; align-items:flex-start; gap:10px;}
  .ct-presets{grid-template-columns:1fr; gap:8px;}
  .ct-presets button{flex-direction:row; justify-content:flex-start; gap:14px; padding:12px 14px; text-align:left;}
  .ct-big{font-size:2.3rem;}
  .ct-big-sm{font-size:1.8rem;}
  .ct-metric{padding:22px 20px;}
  .ct-capture-card{padding:28px 20px;}
  .ct-form-row{grid-template-columns:1fr;}
  .ct-path{padding:24px 20px;}
}


/* ---------- PDF breakdown (browser print) ----------
   Hidden on screen. When the visitor unlocks the breakdown and chooses Download, the browser prints only this block. */
.ct-report{display:none;}

@page{size:A4; margin:12mm 14mm 14mm;}
@media print{
  * {-webkit-print-color-adjust:exact !important; print-color-adjust:exact !important;}
  header.site, footer.site, .cookie-banner, .skip-link, .ct-hero, .ct-calc, .ct-capture, .ct-bridge{display:none !important;}
  html, body{background:#fff !important; color:var(--ink) !important; font-size:10pt; line-height:1.45;}
  body.suite main{background:#fff !important; padding:0 !important; min-height:0 !important;}
  .ct-report[data-ready="true"]{display:block !important; font-family:'Lato',Arial,sans-serif;}

  .ct-report-head{display:flex; align-items:center; justify-content:space-between; padding-bottom:8px; border-bottom:2px solid var(--navy); margin-bottom:14px;}
  .ct-report-head img{height:28px; width:auto;}
  .ct-report-title{text-align:right; display:flex; flex-direction:column; gap:2px;}
  .ct-report-title strong{font-weight:800; font-size:9pt; letter-spacing:.1em; text-transform:uppercase; color:var(--navy);}
  .ct-report-title span{font-size:8.5pt; color:var(--slate);}
  .ct-report h2{font-family:'Montserrat',Arial,sans-serif; font-size:16pt; line-height:1.25; color:var(--navy); margin:0 0 6px;}
  .ct-report h3{font-family:'Montserrat',Arial,sans-serif; font-size:10.5pt; color:var(--navy); margin:14px 0 4px; break-after:avoid; page-break-after:avoid;}
  .ct-report p{margin:0 0 6px;}
  .ct-report-lede{font-size:10.5pt; color:var(--ink); margin-bottom:12px;}
  .ct-report ul{margin:0 0 6px 16px; padding:0;}
  .ct-report li{margin-bottom:3px;}

  .ct-report-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin-bottom:6px;}
  .ct-report-card{border:1px solid rgba(11,21,35,.2); border-radius:8px; padding:10px 12px; break-inside:avoid; page-break-inside:avoid;}
  .ct-report-card p{font-size:8.5pt; color:var(--slate); margin:0;}
  .ct-report-label{display:block; font-weight:800; font-size:7.5pt; letter-spacing:.08em; text-transform:uppercase; color:var(--teal); margin-bottom:4px;}
  .ct-report .ct-report-big{font-family:'Montserrat',Arial,sans-serif; font-weight:700; font-size:17pt; color:var(--navy); margin:0 0 4px;}

  .ct-report-table{width:100%; border-collapse:collapse; margin-bottom:6px; break-inside:avoid; page-break-inside:avoid;}
  .ct-report-table th, .ct-report-table td{border-bottom:1px solid rgba(11,21,35,.1); padding:5px 6px; text-align:left; font-size:9pt; font-weight:400;}
  .ct-report-table thead th{font-weight:800; font-size:8pt; letter-spacing:.05em; text-transform:uppercase; color:var(--slate); border-bottom:1px solid rgba(11,21,35,.35);}
  .ct-report-table tbody th{color:var(--ink);}
  .ct-report-table tbody td{font-weight:700; color:var(--navy); text-align:right;}
  .ct-report-scenarios tbody td:first-child{text-align:left; font-weight:400; color:var(--ink);}
  .ct-report-scenarios th:not(:first-child){text-align:right;}
  .ct-report-scenarios tr.is-current td{background:var(--cream) !important; font-weight:700; color:var(--navy);}

  .ct-report-cta{margin-top:16px; padding:12px 14px; border:1px solid rgba(11,21,35,.2); border-left:4px solid var(--teal); border-radius:8px; break-inside:avoid; page-break-inside:avoid;}
  .ct-report-cta strong{display:block; font-weight:800; font-size:8pt; letter-spacing:.08em; text-transform:uppercase; color:var(--teal); margin-bottom:4px;}
  .ct-report [hidden]{display:none !important;}
  .ct-report-delay{margin:10px 0 4px; padding:10px 14px; border:1px solid rgba(11,21,35,.2); border-radius:8px; break-inside:avoid; page-break-inside:avoid;}
  .ct-report-delay p{margin:0;}
  .ct-report ol{margin:0 0 6px 18px; padding:0;}
  .ct-report ol li{margin-bottom:4px;}
  .ct-report-link{font-weight:700; color:var(--navy); overflow-wrap:anywhere; margin-bottom:0 !important;}
  .ct-report-foot{margin-top:12px; font-size:8pt; color:var(--slate); text-align:center;}
}
