/* DCM Switchboard component styles. Ported verbatim from the approved design.
   Colour/spacing tokens are defined in :root below and mirrored in theme.json
   (theme.json drives the editor pickers + site-wide defaults). To make colours
   single-source, change each token below to e.g.
   --ink: var(--wp--preset--color--ink, #0E1722);  */

:root{
      --ink:#0E1722;
      --ink-2:#14202D;
      --ink-3:#1B2937;
      --paper:#F1F2EE;
      --paper-2:#FBFBF9;
      --brass:#C18B43;
      --brass-2:#D8A65C;
      --slate:#5C7180;
      --on-ink:#ECEDE7;
      --on-ink-dim:#9FABB6;
      --on-paper:#16212C;
      --on-paper-dim:#51616E;
      --line-dark:rgba(255,255,255,.10);
      --line-light:rgba(14,23,34,.13);
      --wrap:1140px;
      --pad-y:clamp(64px,9vw,120px);
    }

    *,*::before,*::after{box-sizing:border-box}
    html{-webkit-text-size-adjust:100%}
    body{
      margin:0;
      background:var(--ink);
      color:var(--on-paper);
      font-family:"IBM Plex Sans",system-ui,sans-serif;
      font-size:clamp(1rem,.97rem + .15vw,1.0625rem);
      line-height:1.62;
      -webkit-font-smoothing:antialiased;
    }
    h1,h2,h3{font-family:"Fraunces",Georgia,serif;font-optical-sizing:auto;font-weight:560;margin:0;letter-spacing:-.015em;line-height:1.06}
    p{margin:0}
    a{color:inherit}
    img,svg{display:block;max-width:100%}

    .wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(20px,5vw,40px)}

    /* ---------- shared section frame ---------- */
    .band{padding-block:var(--pad-y)}
    .band--paper{background:var(--paper);color:var(--on-paper)}
    .band--paper2{background:var(--paper-2);color:var(--on-paper)}
    .band--ink{background:var(--ink);color:var(--on-ink)}
    .band--ink h2{color:var(--on-ink)}
    .band--ink p{color:var(--on-ink-dim)}
    .band--ink h3{color:var(--on-ink)}

    .eyebrow{
      font-family:"IBM Plex Mono",monospace;
      font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
      color:var(--brass);margin:0 0 1.1rem;font-weight:500;
    }
    .band-title{font-size:clamp(1.7rem,1.2rem + 2.2vw,2.7rem);max-width:18ch}
    .lede{max-width:60ch;color:var(--on-paper-dim);font-size:1.075rem}
    .band--ink .lede{color:var(--on-ink-dim)}

    /* ---------- buttons ---------- */
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
      font-family:"IBM Plex Sans",sans-serif;font-weight:600;font-size:.95rem;
      letter-spacing:.01em;text-decoration:none;cursor:pointer;
      padding:.85rem 1.5rem;border-radius:7px;border:1px solid transparent;
      transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
    }
    .btn--brass{background:var(--brass);color:#1A130A;border-color:var(--brass)}
    .btn--brass:hover{background:var(--brass-2);border-color:var(--brass-2);transform:translateY(-1px)}
    .btn--ghost{background:transparent;color:var(--on-ink);border-color:var(--line-dark)}
    .btn--ghost:hover{border-color:var(--brass);color:var(--brass-2)}
    .btn--block{width:100%}
    a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
      outline:2px solid var(--brass-2);outline-offset:3px;border-radius:4px;
    }

    /* ---------- header ---------- */
    .nav{
      position:sticky;top:0;z-index:50;
      background:rgba(14,23,34,.82);backdrop-filter:blur(10px);
      border-bottom:1px solid var(--line-dark);
    }
    .nav__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:64px}
    .brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--on-ink)}
    .brand__mark{width:11px;height:11px;background:var(--brass);border-radius:2px;flex:none}
    .brand__name{font-weight:700;letter-spacing:.02em;font-size:.98rem}
    .brand__div{width:1px;height:18px;background:var(--line-dark)}
    .brand__sub{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--on-ink-dim)}
    .nav__links{display:flex;gap:1.6rem;align-items:center}
    .nav__links a{
      text-decoration:none;color:var(--on-ink-dim);font-size:.9rem;font-weight:500;
      padding:.3rem 0;position:relative;transition:color .18s ease;
    }
    .nav__links a:hover{color:var(--on-ink)}
    .nav__links a[aria-current="page"]{color:var(--on-ink)}
    .nav__links a[aria-current="page"]::after{
      content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--brass);
    }
    .brand__sub{display:none}
    @media(min-width:560px){.brand__div,.brand__sub{display:block}}

    /* ---------- hero ---------- */
    .hero{background:var(--ink);color:var(--on-ink);padding-block:clamp(56px,8vw,104px);overflow:hidden}
    .hero__inner{display:grid;grid-template-columns:1fr;gap:clamp(40px,6vw,64px);align-items:center}
    @media(min-width:920px){.hero__inner{grid-template-columns:1.05fr .95fr}}
    .hero__title{font-size:clamp(2.5rem,1.6rem + 4.2vw,4.3rem);font-weight:560;max-width:13ch;margin-bottom:1.4rem}
    .hero__title em{font-style:normal;color:var(--brass)}
    .hero__sub{color:var(--on-ink-dim);font-size:clamp(1.05rem,1rem + .4vw,1.2rem);max-width:48ch;margin-bottom:2.2rem}
    .hero__cta{display:flex;flex-wrap:wrap;gap:.85rem;margin-bottom:1.8rem}
    .hero__meta{
      font-family:"IBM Plex Mono",monospace;font-size:.78rem;letter-spacing:.14em;
      text-transform:uppercase;color:var(--on-ink-dim);display:flex;flex-wrap:wrap;gap:.4rem .9rem;
    }
    .hero__meta span{white-space:nowrap}
    .hero__meta span+span::before{content:"·";margin-right:.9rem;color:var(--brass)}

    /* ---------- patch-panel art ---------- */
    .hero__art{justify-self:center;width:100%;max-width:520px}
    .board{width:100%;height:auto}
    .board .socket{fill:none;stroke:var(--slate);stroke-width:1.4;opacity:.32}
    .cable{fill:none;stroke:var(--brass);stroke-width:3.4;stroke-linecap:round;
      stroke-dasharray:1100;stroke-dashoffset:1100;
      animation:draw 1.15s cubic-bezier(.22,.61,.36,1) .3s forwards;}
    .plug{opacity:0;transform:scale(.55);transform-box:fill-box;transform-origin:center;
      animation:plug .55s cubic-bezier(.34,1.4,.64,1) 1s forwards;}
    .plug__halo{fill:var(--brass);opacity:.16}
    .plug__disc{fill:var(--brass)}
    .plug__core{fill:var(--ink)}
    .pin{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.14em;
      fill:var(--brass-2);text-transform:uppercase;opacity:0;animation:fade .6s ease 1.2s forwards;}
    @keyframes draw{to{stroke-dashoffset:0}}
    @keyframes plug{to{opacity:1;transform:scale(1)}}
    @keyframes fade{to{opacity:1}}

    /* ---------- reach ---------- */
    .reach__grid{display:grid;grid-template-columns:1fr;gap:2.2rem;margin-top:2.4rem}
    @media(min-width:720px){.reach__grid{grid-template-columns:repeat(3,1fr);gap:2.6rem}}
    .reach__item{border-top:2px solid var(--brass);padding-top:1.1rem}
    .reach__item h3{font-size:1.3rem;margin-bottom:.5rem}
    .reach__item p{color:var(--on-paper-dim);font-size:1rem}

    /* ---------- how it works ---------- */
    .how__title{margin-bottom:.9rem}
    .steps{list-style:none;margin:3rem 0 0;padding:0;display:grid;grid-template-columns:1fr;gap:1.4rem;counter-reset:none}
    @media(min-width:820px){.steps{grid-template-columns:repeat(3,1fr);gap:1.6rem}}
    .step{
      background:var(--paper-2);border:1px solid var(--line-light);border-radius:12px;
      padding:1.7rem 1.6rem;position:relative;
    }
    .step__no{
      font-family:"IBM Plex Mono",monospace;font-size:.85rem;letter-spacing:.1em;
      color:var(--brass);font-weight:500;display:block;margin-bottom:1rem;
    }
    .step h3{font-size:1.22rem;margin-bottom:.55rem}
    .step p{color:var(--on-paper-dim);font-size:1rem}
    .step--key{border-color:var(--brass);box-shadow:inset 3px 0 0 var(--brass)}
    .step__note{
      margin-top:.85rem;font-family:"IBM Plex Mono",monospace;font-size:.74rem;
      letter-spacing:.08em;text-transform:uppercase;color:var(--brass)!important;
    }
    .how__time{
      margin-top:1.9rem;font-family:"IBM Plex Mono",monospace;font-size:.82rem;
      letter-spacing:.12em;text-transform:uppercase;color:var(--on-paper-dim);
    }
    .how__time b{color:var(--on-paper);font-weight:500}

    /* ---------- confidentiality ---------- */
    .conf__head{max-width:60ch;margin-bottom:2.8rem}
    .conf__head .band-title{margin-top:.2rem}
    .conf__grid{display:grid;grid-template-columns:1fr;gap:1.8rem}
    @media(min-width:820px){.conf__grid{grid-template-columns:repeat(3,1fr);gap:2.4rem}}
    .conf__pt{padding-left:1.2rem;border-left:2px solid var(--brass)}
    .conf__pt h3{font-size:1.18rem;margin-bottom:.55rem;color:var(--on-ink)}
    .conf__pt p{color:var(--on-ink-dim);font-size:1rem}

    /* ---------- why free ---------- */
    .why__inner{max-width:64ch}
    .why p{margin-top:1.1rem;color:var(--on-paper-dim)}
    .why__prov{
      margin-top:1.8rem!important;font-family:"IBM Plex Mono",monospace;font-size:.8rem;
      letter-spacing:.1em;text-transform:uppercase;color:var(--on-paper)!important;
    }

    /* ---------- enquire ---------- */
    .enquire__inner{display:grid;grid-template-columns:1fr;gap:clamp(36px,5vw,64px)}
    @media(min-width:880px){.enquire__inner{grid-template-columns:.85fr 1.15fr;align-items:start}}
    .enquire__intro .lede{margin-top:1rem}
    .enquire__alt{margin-top:1.5rem;font-size:.95rem;color:var(--on-ink-dim)!important}
    .enquire__alt a{color:var(--brass-2);text-decoration:underline;text-underline-offset:3px}

    .form{background:var(--ink-2);border:1px solid var(--line-dark);border-radius:14px;padding:clamp(1.5rem,3vw,2.2rem)}
    .form__fields{display:grid;grid-template-columns:1fr;gap:1.15rem}
    @media(min-width:560px){.form__fields{grid-template-columns:1fr 1fr}}
    .field{display:flex;flex-direction:column;gap:.4rem}
    .field--full{grid-column:1/-1}
    .field label{
      font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.12em;
      text-transform:uppercase;color:var(--on-ink-dim);
    }
    .field .opt{color:var(--slate);text-transform:none;letter-spacing:.02em}
    .field input,.field textarea{
      background:var(--ink-3);border:1px solid var(--line-dark);border-radius:7px;
      color:var(--on-ink);font-family:inherit;font-size:1rem;padding:.78rem .9rem;width:100%;
      transition:border-color .18s ease;
    }
    .field textarea{resize:vertical;min-height:96px;line-height:1.55}
    .field input::placeholder,.field textarea::placeholder{color:#6A7884}
    .field input:focus,.field textarea:focus{border-color:var(--brass);outline:none}
    .field input:focus-visible,.field textarea:focus-visible{outline:2px solid var(--brass-2);outline-offset:2px}
    .field.is-error input{border-color:#D98A6A}
    .form__foot{margin-top:1.5rem}
    .form__consent{margin-top:1rem;font-size:.82rem;color:var(--on-ink-dim);line-height:1.5}
    .form__consent a{color:var(--brass-2);text-decoration:underline;text-underline-offset:3px}
    .form__done{
      display:none;border-left:2px solid var(--brass);padding:.4rem 0 .4rem 1.1rem;
      color:var(--on-ink);font-size:1.05rem;
    }
    .form.is-sent .form__fields,.form.is-sent .form__foot{display:none}
    .form.is-sent .form__done{display:block}

    /* ---------- shortlist preview ---------- */
    .preview__head{max-width:62ch}
    .preview__head h2{max-width:20ch}
    .preview__head .lede{margin-top:1rem}
    .serp{
      max-width:780px;margin:2.8rem auto 0;background:var(--paper-2);color:var(--on-paper);
      border:1px solid rgba(0,0,0,.06);border-radius:16px;overflow:hidden;
      box-shadow:0 26px 54px -30px rgba(0,0,0,.6);
    }
    .serp__bar{padding:1rem 1.05rem;border-bottom:1px solid var(--line-light);display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
    .serp__query{
      flex:1 1 240px;display:flex;align-items:center;gap:.6rem;
      background:#fff;border:1px solid var(--line-light);border-radius:9px;padding:.62rem .8rem;
      font-size:.92rem;color:var(--on-paper);
    }
    .serp__jack{width:14px;height:14px;flex:none}
    .jack-ring{fill:none;stroke:var(--brass);stroke-width:2.5}
    .jack-dot{fill:var(--brass)}
    .serp__count{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--on-paper-dim);white-space:nowrap}
    .result{display:flex;gap:1rem;align-items:flex-start;flex-wrap:wrap;padding:1.05rem}
    .result+.result{border-top:1px solid var(--line-light)}
    .result__logo{
      width:42px;height:42px;border-radius:9px;background:var(--ink-2);color:var(--paper);
      display:flex;align-items:center;justify-content:center;flex:none;
      font-family:"IBM Plex Mono",monospace;font-size:.8rem;letter-spacing:.02em;
    }
    .result__body{flex:1 1 60%;min-width:0}
    .result__top{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap}
    .result__name{font-weight:600;font-size:1.02rem;color:var(--on-paper)}
    .badge{
      font-family:"IBM Plex Mono",monospace;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;
      color:var(--brass);border:1px solid var(--brass);background:rgba(193,139,67,.10);
      border-radius:4px;padding:.16rem .42rem;line-height:1;
    }
    .result__desc{color:var(--on-paper-dim);font-size:.92rem;margin-top:.25rem}
    .result__tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.6rem}
    .tag{
      font-family:"IBM Plex Mono",monospace;font-size:.67rem;letter-spacing:.04em;color:var(--on-paper-dim);
      border:1px solid var(--line-light);background:#fff;border-radius:5px;padding:.2rem .46rem;line-height:1.1;
    }
    .result__action{margin-left:auto;align-self:center;display:flex;align-items:center}
    .result__btn{
      display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap;cursor:default;
      font-family:"IBM Plex Sans",sans-serif;font-size:.82rem;font-weight:600;color:var(--brass);
      border:1px solid var(--brass);border-radius:7px;padding:.5rem .8rem;background:#fff;
    }
    .result__btn svg{width:13px;height:13px;flex:none}
    .arr{fill:none;stroke:var(--brass);stroke-width:2.4}
    .arr path{stroke-linecap:round;stroke-linejoin:round}
    .serp__cap{
      max-width:780px;margin:1.05rem auto 0;text-align:center;
      font-family:"IBM Plex Mono",monospace;font-size:.71rem;letter-spacing:.05em;line-height:1.5;
      color:var(--on-ink-dim);
    }
    @media(max-width:560px){
      .result__action{margin-left:0;width:100%;padding-left:54px}
      .result__btn{width:100%;justify-content:center}
    }

    /* ---------- who it's for (A) ---------- */
    .whofor{padding-block:clamp(46px,6vw,80px)}
    .whofor__title{font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem);max-width:24ch;margin:.2rem 0 0}
    .axis{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;margin-top:1.4rem}
    .axis__label{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--on-ink-dim);min-width:92px;flex:none}
    .chips{display:flex;flex-wrap:wrap;gap:.55rem}
    .chip{display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--line-dark);border-radius:999px;padding:.5rem .95rem;font-size:.94rem;font-weight:500;color:var(--on-ink)}
    .chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brass);flex:none}

    /* ---------- persona selector (D) ---------- */
    .persona__head{max-width:60ch}
    .persona__head .lede{margin-top:1rem}
    .persona__tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem}
    .ptab{font-family:"IBM Plex Sans",sans-serif;font-weight:600;font-size:.9rem;color:var(--on-ink-dim);background:transparent;border:1px solid var(--line-dark);border-radius:999px;padding:.55rem 1.05rem;cursor:pointer;transition:background .16s,color .16s,border-color .16s}
    .ptab:hover{color:var(--on-ink);border-color:var(--slate)}
    .ptab[aria-selected="true"]{background:var(--brass);color:#1A130A;border-color:var(--brass)}
    .persona__panel{display:grid;grid-template-columns:1fr;gap:clamp(28px,4vw,48px);align-items:center;margin-top:2.4rem}
    @media(min-width:860px){.persona__panel{grid-template-columns:1fr 1fr}}
    .persona__h{font-size:clamp(1.5rem,1.2rem + 1.4vw,2.1rem);max-width:16ch}
    .persona__h em{font-style:normal;color:var(--brass)}
    .persona__sub{color:var(--on-ink-dim);margin-top:.9rem;max-width:44ch}
    .dcard__label{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.7rem}
    .dcard{background:var(--paper-2);color:var(--on-paper);border:1px solid rgba(0,0,0,.06);border-radius:13px;overflow:hidden;box-shadow:0 24px 50px -28px rgba(0,0,0,.6)}
    .dcard__head{display:flex;align-items:center;gap:.55rem;padding:.75rem .9rem;border-bottom:1px solid var(--line-light);font-size:.86rem;color:var(--on-paper)}
    .dres{display:flex;gap:.8rem;align-items:flex-start;padding:.85rem .9rem}
    .dres+.dres{border-top:1px solid var(--line-light)}
    .dres__logo{width:36px;height:36px;border-radius:8px;background:var(--ink-2);color:var(--paper);display:flex;align-items:center;justify-content:center;flex:none;font-family:"IBM Plex Mono",monospace;font-size:.72rem}
    .dres__name{font-weight:600;font-size:.95rem;color:var(--on-paper)}
    .dres__desc{color:var(--on-paper-dim);font-size:.84rem;margin-top:.15rem}
    .dres__tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.45rem}
    .dtag{font-family:"IBM Plex Mono",monospace;font-size:.63rem;letter-spacing:.03em;color:var(--on-paper-dim);border:1px solid var(--line-light);background:#fff;border-radius:5px;padding:.16rem .4rem;line-height:1.1}

    /* ---------- what it is (positioning) ---------- */
    .whatis__title{max-width:20ch}
    .whatis__lead{max-width:64ch;margin-top:1.2rem;display:grid;gap:1rem}
    .whatis__lead p{color:var(--on-paper-dim)}
    .contrast{display:grid;grid-template-columns:1fr;gap:1.4rem;margin-top:2.6rem}
    @media(min-width:760px){.contrast{grid-template-columns:1fr 1fr;gap:1.6rem}}
    .col{background:var(--paper-2);border:1px solid var(--line-light);border-radius:12px;padding:1.5rem}
    .col--is{border-left:3px solid var(--brass)}
    .col__head{font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;margin:0 0 1.1rem}
    .col__head--is{color:var(--brass)}
    .col__head--isnt{color:var(--slate)}
    .col ul{list-style:none;margin:0;padding:0;display:grid;gap:.75rem}
    .col li{position:relative;padding-left:1.7rem;font-size:1rem;color:var(--on-paper);line-height:1.45}
    .col li::before{position:absolute;left:0;top:.02em;font-weight:700;font-size:.95rem}
    .col--is li::before{content:"✓";color:var(--brass)}
    .col--isnt li::before{content:"✕";color:var(--slate)}

    /* ---------- hand-off line (How it works) ---------- */
    .handoff{margin-top:1.7rem;padding-left:1.1rem;border-left:3px solid var(--brass);font-size:clamp(1.05rem,1rem + .4vw,1.25rem);color:var(--on-paper);max-width:62ch;line-height:1.5}

    /* ---------- deal-lifecycle timeline ---------- */
    .timeline .lede{margin-top:1rem}
    .tl{margin-top:2.8rem}
    .tl__bar{position:relative;display:flex;height:14px;border-radius:999px;overflow:hidden;background:#D9DCD6}
    .tl__seg{display:block;height:100%}
    .tl__seg--ours{flex:0 0 28%;background:var(--brass)}
    .tl__seg--yours{flex:1 1 auto;background:#D9DCD6}
    .tl__mark{position:absolute;left:28%;top:-6px;bottom:-6px;width:0;border-left:2px dashed rgba(14,23,34,.5)}
    .tl__mark-label{position:absolute;left:9px;top:calc(100% + 7px);font-family:"IBM Plex Mono",monospace;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--on-paper-dim);white-space:nowrap}
    .tl__ends{display:flex;justify-content:space-between;gap:1rem;margin-bottom:.8rem}
    .tl__end{font-family:"IBM Plex Mono",monospace;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--on-paper-dim);max-width:48%}
    .tl__end:last-child{text-align:right}
    .tl__cols{display:grid;grid-template-columns:1fr;gap:1.3rem;margin-top:2.6rem}
    @media(min-width:760px){.tl__cols{grid-template-columns:.85fr 1.3fr;gap:1.8rem}}
    .tl__col{padding:1.3rem 1.4rem;border-radius:12px;background:var(--paper-2);border:1px solid var(--line-light)}
    .tl__col--ours{border-left:3px solid var(--brass)}
    .tl__tag{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;margin:0 0 .6rem}
    .tl__tag--ours{color:var(--brass)}
    .tl__tag--yours{color:var(--slate)}
    .tl__stages{font-weight:600;font-size:1.02rem;color:var(--on-paper);margin:0 0 .5rem}
    .tl__col--yours .tl__stages{color:var(--on-paper-dim);font-weight:500}
    .tl__desc{color:var(--on-paper-dim);font-size:.95rem;margin:0}
    .tl__cap{margin-top:1.7rem;font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--brass)}

    /* ---------- emphasis band ---------- */
    .emphasis__inner{text-align:center}
    .emphasis__line{font-size:clamp(2rem,1.5rem + 2.6vw,3.2rem);color:var(--on-ink);max-width:20ch;margin:0 auto}
    .emphasis__line em{font-style:normal;color:var(--brass)}
    .emphasis__sub{margin:1.4rem auto 0;max-width:54ch;color:var(--on-ink-dim);font-size:clamp(1rem,.96rem + .4vw,1.15rem)}

    /* ---------- plain-words Q&A ---------- */
    .faq .band-title{max-width:22ch}
    .qa{margin-top:2.4rem;display:grid;gap:1.4rem;max-width:780px}
    .qa__item{padding-bottom:1.4rem;border-bottom:1px solid var(--line-light)}
    .qa__item:last-child{padding-bottom:0;border-bottom:0}
    .qa dt{font-weight:600;font-size:1.12rem;color:var(--on-paper);margin-bottom:.45rem}
    .qa dd{margin:0;color:var(--on-paper-dim);font-size:1rem;max-width:66ch;line-height:1.55}

    /* ---------- footer ---------- */
    .foot{background:var(--ink);color:var(--on-ink-dim);border-top:1px solid var(--line-dark);padding-block:clamp(48px,6vw,72px)}
    .foot__top{display:flex;flex-wrap:wrap;gap:2.5rem;justify-content:space-between}
    .foot__brand{display:flex;align-items:center;gap:.7rem;color:var(--on-ink)}
    .foot__cols{display:flex;flex-wrap:wrap;gap:3rem}
    .foot__cols ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
    .foot__cols a{text-decoration:none;color:var(--on-ink-dim);font-size:.92rem;transition:color .18s ease}
    .foot__cols a:hover{color:var(--on-ink)}
    .foot__disclaimer{
      margin-top:2.6rem;padding-top:1.8rem;border-top:1px solid var(--line-dark);
      font-size:.82rem;line-height:1.6;color:var(--slate);max-width:80ch;
    }
    .foot__legal{
      margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center;
      font-size:.85rem;color:var(--slate);
    }
    .foot__legal a{color:var(--on-ink-dim);text-decoration:none}
    .foot__legal a:hover{color:var(--on-ink)}
    .foot__legal .sep{color:var(--line-dark)}

    /* ---------- reveal (progressive enhancement) ---------- */
    .js .reveal{opacity:0;transform:translateY(12px)}
    .js .reveal.is-in{opacity:1;transform:none;transition:opacity .6s ease,transform .6s ease}

    @media(prefers-reduced-motion:reduce){
      *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
      .cable{stroke-dashoffset:0}
      .plug,.pin{opacity:1;transform:none}
      .js .reveal{opacity:1;transform:none}
    }


/* =======================================================================
   Homepage, post feed, single article and newsletter — added for the
   content templates (front-page / home / single / archive / search).
   ======================================================================= */

/* ---- homepage hero (typographic) ---- */
.home-hero{padding-block:clamp(64px,9vw,120px)}
.home-hero__title{font-size:clamp(2.4rem,1.6rem + 3.4vw,4rem);line-height:1.04;max-width:20ch;margin:0 0 1.2rem;color:var(--on-ink)}
.home-hero__sub{color:var(--on-ink-dim);font-size:clamp(1.05rem,1rem + .4vw,1.22rem);max-width:54ch;margin:0 0 2rem}

/* ---- feed (front page + indexes) ---- */
.feed{padding-block:clamp(56px,7vw,96px)}
.feed__eyebrow{margin-bottom:2rem}
.feed__title{font-size:clamp(1.8rem,1.4rem + 1.6vw,2.6rem);margin:0 0 1.8rem;max-width:24ch}

.feed-lead{margin:0 0 2.8rem}
.feed-lead .wp-block-post-template{list-style:none;margin:0;padding:0}
.feed-lead .wp-block-post{margin:0}
.feed-lead .wp-block-post-featured-image{margin:0 0 1.4rem}
.feed-lead .wp-block-post-featured-image img{width:100%;height:auto;border-radius:0px;display:block}
.feed-lead .wp-block-post-title{font-size:clamp(1.8rem,1.3rem + 2vw,2.6rem);line-height:1.1;margin:0 0 .6rem}
.feed-lead .wp-block-post-title a{text-decoration:none;color:var(--on-paper)}
.feed-lead .wp-block-post-title a:hover{color:var(--brass)}
.feed-lead .wp-block-post-excerpt{color:var(--on-paper-dim);max-width:64ch;margin:0 0 .7rem}
.feed-lead .wp-block-post-date{font-family:"IBM Plex Mono",monospace;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--slate)}

.feed-grid .wp-block-post-template{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:1.6rem}
@media(min-width:620px){.feed-grid .wp-block-post-template{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.feed-grid .wp-block-post-template{grid-template-columns:1fr 1fr 1fr}}
.feed-grid .wp-block-post{margin:0;display:flex;flex-direction:column;background:var(--paper-2);border:1px solid var(--line-light);border-radius:0px;overflow:hidden}
.feed-grid .wp-block-post-featured-image{margin:0}
.feed-grid .wp-block-post-featured-image img{width:100%;height:auto;display:block}
.feed-grid .wp-block-post-title{font-size:1.2rem;line-height:1.2;margin:1.1rem 1.1rem .5rem}
.feed-grid .wp-block-post-title a{text-decoration:none;color:var(--on-paper)}
.feed-grid .wp-block-post-title a:hover{color:var(--brass)}
.feed-grid .wp-block-post-excerpt{color:var(--on-paper-dim);font-size:.95rem;margin:0 1.1rem .8rem}
.feed-grid .wp-block-post-date{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--slate);margin:auto 1.1rem 1.1rem}

.wp-block-query-pagination{margin-top:2.6rem;gap:.4rem 1.1rem;font-family:"IBM Plex Mono",monospace;font-size:.8rem;letter-spacing:.06em}
.wp-block-query-pagination a{color:var(--brass);text-decoration:none}
.wp-block-query-pagination .current{color:var(--on-paper)}

/* ---- single article ---- */
.article__title{font-size:clamp(2rem,1.5rem + 2.3vw,3rem);line-height:1.08;max-width:22ch;margin:0 0 1rem}
.article__meta{font-family:"IBM Plex Mono",monospace;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--slate);margin:0 0 2.4rem}
.article__body > *{margin-top:0}
.article__body p{margin:0 0 1.2rem;line-height:1.7}
.article__body h2{font-family:"Fraunces",Georgia,serif;font-weight:560;font-size:clamp(1.45rem,1.2rem + 1vw,1.9rem);line-height:1.15;letter-spacing:-.01em;margin:2.4rem 0 .7rem}
.article__body h3{font-family:"Fraunces",Georgia,serif;font-weight:560;font-size:1.25rem;line-height:1.2;margin:2rem 0 .5rem}
.article__body h2:first-child,.article__body h3:first-child{margin-top:0}
.article__body a{color:var(--brass);text-decoration:underline;text-underline-offset:3px}
.article__body ul,.article__body ol{margin:0 0 1.2rem;padding-left:1.3rem;line-height:1.7}
.article__body li{margin:.3rem 0}
.article__body img{height:auto;border-radius:10px}
.article__body figure{margin:1.8rem 0}
.article__body figcaption{font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.04em;color:var(--slate);text-align:center;margin-top:.5rem}
.article__body blockquote{margin:1.8rem 0;padding:.2rem 0 .2rem 1.2rem;border-left:3px solid var(--brass);font-size:1.1rem;color:var(--on-paper)}
.article__back{margin-top:2.8rem;font-family:"IBM Plex Mono",monospace;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase}
.article__back a{color:var(--brass);text-decoration:none}

/* ---- newsletter band ---- */
.newsletter{padding-block:clamp(56px,7vw,90px)}
.newsletter .lede{margin:1rem 0 1.6rem;max-width:56ch}
.newsletter__formnote{font-family:"IBM Plex Mono",monospace;font-size:.8rem;color:var(--on-ink-dim);border:1px dashed var(--line-dark);border-radius:8px;padding:.9rem 1rem;max-width:46ch}

/* ---- Contact Form 7: newsletter form on the dark band ---- */
.newsletter .wpcf7{margin-top:1.5rem;max-width:540px}
.newsletter .wpcf7-form{display:flex;flex-wrap:wrap;gap:.6rem;align-items:stretch}
.newsletter .wpcf7-form p{margin:0;display:contents}
.newsletter .wpcf7-form br{display:none}
.newsletter .wpcf7-form-control-wrap{flex:1 1 240px}
.newsletter input.wpcf7-form-control:not(.wpcf7-submit){
  width:100%;background:var(--ink-3);border:1px solid var(--line-dark);border-radius:8px;
  color:var(--on-ink);font-family:inherit;font-size:1rem;padding:.85rem .95rem;
}
.newsletter input.wpcf7-form-control:not(.wpcf7-submit)::placeholder{color:#6A7884}
.newsletter input.wpcf7-form-control:not(.wpcf7-submit):focus{outline:2px solid var(--brass-2);outline-offset:2px;border-color:var(--brass)}
.newsletter input.wpcf7-submit{
  flex:0 0 auto;width:auto;background:var(--brass);color:#1A130A;
  border:1px solid var(--brass);border-radius:8px;font-family:inherit;font-weight:600;font-size:.95rem;
  padding:.85rem 1.5rem;cursor:pointer;transition:background .18s,border-color .18s,transform .18s;
}
.newsletter input.wpcf7-submit:hover{background:var(--brass-2);border-color:var(--brass-2);transform:translateY(-1px)}
.newsletter .wpcf7-spinner{margin:.5rem 0 0 .4rem}
.newsletter .wpcf7-response-output{
  flex-basis:100%;width:100%;margin:1rem 0 0 !important;border:0 !important;padding:.4rem 0 0 !important;
  font-family:"IBM Plex Mono",monospace;font-size:.82rem;letter-spacing:.02em;color:var(--on-ink-dim);
}
.newsletter .wpcf7-not-valid-tip{color:#E7B27A;font-size:.8rem;margin-top:.35rem}
.newsletter .wpcf7-form.sent .wpcf7-response-output{color:var(--brass-2)}
.newsletter .wpcf7-form.invalid .wpcf7-response-output,
.newsletter .wpcf7-form.unaccepted .wpcf7-response-output,
.newsletter .wpcf7-form.spam .wpcf7-response-output{color:#E7B27A}
@media(max-width:480px){
  .newsletter .wpcf7-form-control-wrap{flex-basis:100%}
  .newsletter input.wpcf7-submit{width:100%}
}

/* Mobile header: stack the nav under the brand so the links aren't crushed */
@media (max-width:600px){
  .nav__inner{flex-direction:column;align-items:flex-start;height:auto;gap:.6rem;padding-block:.7rem}
  .nav__links{gap:1.4rem}
}

/* If you kept the long tagline: only reveal it once there's room on one line */
@media (max-width:1023px){
  .brand__sub,.brand__div{display:none}
}

/* Homepage lead story: place the title-card beside the headline
   instead of one oversized full-width image */
@media (min-width:760px){
  .feed-lead .wp-block-post{
    display:grid;
    grid-template-columns:.92fr 1.08fr;
    column-gap:2.4rem;
    align-items:center;
  }
  .feed-lead .wp-block-post-featured-image{
    grid-column:1;
    grid-row:1 / span 3;
    margin:0;
  }
  .feed-lead .wp-block-post-title,
  .feed-lead .wp-block-post-excerpt,
  .feed-lead .wp-block-post-date{
    grid-column:2;
  }
  .feed-lead .wp-block-post-title{margin-top:0}
}

/* ---- Contact Form 7 wired into the Switchboard enquiry form ---- */
/* Dissolve CF7's auto-inserted <p>/<br> so the .field grid lays out as designed
   (same technique already used on the newsletter form) */
.enquire .wpcf7-form p:not([class]){margin:0;display:contents}
.enquire .wpcf7-form br{display:none}

/* Submit: let the brass .btn styling win over native input chrome */
.enquire .wpcf7-submit{appearance:none;-webkit-appearance:none}
.enquire .wpcf7-spinner{margin:.5rem 0 0 .4rem}

/* Validation + response messages in the Switchboard palette */
.enquire .field .wpcf7-not-valid{border-color:#D98A6A}
.enquire .wpcf7-not-valid-tip{
  display:block;margin-top:.4rem;
  font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.04em;color:#E7B27A;
}
.enquire .wpcf7-response-output{
  margin:1.2rem 0 0;padding:.5rem 0 .5rem 1.1rem;
  border:0;border-left:2px solid var(--brass);
  color:var(--on-ink);font-size:.95rem;line-height:1.5;
}
.enquire .wpcf7-form.sent .wpcf7-response-output{border-left-color:var(--brass-2);color:var(--brass-2)}
.enquire .wpcf7-form.invalid .wpcf7-response-output,
.enquire .wpcf7-form.unaccepted .wpcf7-response-output,
.enquire .wpcf7-form.spam .wpcf7-response-output{border-left-color:#D98A6A;color:#E7B27A}


