/* Mobile Mechanic 247 · the service work order. Paper, ink, one red. */
:root{
  --paper:#F3F0E8; --paper-2:#E8E3D7; --sheet:#FBFAF6; --ink:#1B1E26; --ink-2:#2A2E39; --red:#B4180C; --red-2:#8E1209;
  --muted:#575B66; --hair:rgba(27,30,38,.2); --gut:clamp(1rem,4vw,3rem); --max:90rem;
  --display:Archivo,system-ui,sans-serif; --mono:'IBM Plex Mono',ui-monospace,monospace;
  --ease:cubic-bezier(.2,.7,.1,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--display);font-size:1.0625rem;line-height:1.6;font-stretch:100%;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
.wp-site-blocks>*,.mm-main>*,.mm-main.page>*{margin-block-start:0!important;margin-block-end:0!important}
.mm-main{display:block}
a{color:inherit}
::selection{background:var(--red);color:#fff}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.skip a{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:100}
.skip a:focus{left:0}
.mono,.card__top,dt,.mono b{font-family:var(--mono);font-size:.78rem;font-weight:500;letter-spacing:.04em}
.ph,.price--ph{display:none}
.is-staging .ph{display:inline;background:repeating-linear-gradient(45deg,#ffd84a 0 8px,#ffe680 8px 16px);color:#1B1E26;padding:.05rem .4rem;font:500 .72rem/1.5 var(--mono)}
.is-staging li.ph,.is-staging span.ph{display:inline-block}
.is-staging .price--ph{display:inline;background:repeating-linear-gradient(45deg,#ffd84a 0 8px,#ffe680 8px 16px);color:#1B1E26;padding:.05rem .4rem;font:500 .8rem var(--mono)}
.is-staging .price--live{display:none}
.price{font-family:var(--mono);font-weight:500;font-size:.95rem}
.h2{font-family:var(--display);font-stretch:112%;font-weight:800;font-size:clamp(2rem,1.2rem + 3.4vw,4rem);line-height:1;letter-spacing:-.015em;margin:0;text-wrap:balance}
.red{color:var(--red)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 1.25rem;border:2px solid var(--ink);border-radius:2px;background:transparent;color:var(--ink);font:700 1rem/1.1 var(--display);text-decoration:none;cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .2s;min-height:3rem}
.btn:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink)}
.btn:active{transform:translate(0,0);box-shadow:none}
.btn--red{background:var(--red);border-color:var(--red);color:#fff}
.btn--red:hover{box-shadow:4px 4px 0 var(--ink)}
.btn--paper{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn--paper:hover{box-shadow:4px 4px 0 var(--red)}
.btn--ghost{border-color:var(--paper);color:var(--paper)}
.btn--ghost:hover{box-shadow:4px 4px 0 var(--paper)}
.btn--block{display:flex;width:100%}
.textlink{font-weight:700;text-underline-offset:.25em;text-decoration-thickness:2px}
.linkbtn{background:none;border:0;padding:.4rem 0;font:700 1rem var(--display);text-decoration:underline;text-underline-offset:.25em;cursor:pointer;color:var(--ink)}

/* header */
.head{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:1.25rem;max-width:var(--max);margin:0 auto;padding:1rem var(--gut);border-bottom:2px solid var(--ink)}
.logo{display:inline-flex;align-items:center;gap:.4rem;text-decoration:none;font-stretch:118%;font-weight:800;font-size:1.15rem;letter-spacing:-.01em;text-transform:uppercase;line-height:1}
.logo__mark{width:2.1rem;height:2.1rem;margin-right:.2rem}
.logo__n{background:var(--red);color:#fff;padding:.2rem .4rem .15rem;font-stretch:80%}
.nav{display:none;gap:1.75rem;justify-content:center}
.nav a{white-space:nowrap;text-decoration:none;font-weight:600;font-size:.98rem;padding:.3rem 0;background:linear-gradient(var(--red),var(--red)) 0 100%/0 2px no-repeat;transition:background-size .3s var(--ease)}
.nav a:hover{background-size:100% 2px}
.head__call{justify-self:end;white-space:nowrap}
.menu{position:relative}
.menu summary{list-style:none;cursor:pointer;width:3rem;height:3rem;border:2px solid var(--ink);display:grid;place-content:center;gap:6px}
.menu summary::-webkit-details-marker{display:none}
.menu summary span{display:block;width:22px;height:2px;background:var(--ink);transition:transform .25s var(--ease)}
.menu[open] summary span:first-child{transform:translateY(4px) rotate(45deg)}
.menu[open] summary span:last-child{transform:translateY(-4px) rotate(-45deg)}
.menu__panel{position:absolute;right:0;top:calc(100% + .6rem);width:min(78vw,18rem);background:var(--sheet);border:2px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:.5rem;z-index:30;display:grid}
.menu__panel a{padding:.8rem 1rem;text-decoration:none;font-weight:700;border-bottom:1px solid var(--hair)}
.menu__panel a:last-child{border:0}
@media (max-width:520px){.head__callword{display:none}.head{gap:.5rem}.logo{font-size:.8rem;gap:.3rem}.logo__mark{width:1.7rem;height:1.7rem}.head__call{padding:.65rem .6rem;font-size:.85rem;min-height:2.7rem}.menu summary{width:2.7rem;height:2.7rem}}
@media (max-width:360px){.logo__n{display:none}}
@media (min-width:75rem){.nav{display:flex}.menu{display:none}.head{grid-template-columns:auto 1fr auto}}
@media (min-width:48rem) and (max-width:74.99rem){.head{grid-template-columns:1fr auto auto}}

/* hero */
.hero{max-width:var(--max);margin:0 auto;padding:clamp(2rem,5vw,4.5rem) var(--gut) clamp(3rem,6vw,6rem);display:grid;gap:2rem}
.display{font-family:var(--display);font-stretch:125%;font-weight:800;font-size:clamp(2.7rem,1.2rem + 5.3vw,6.6rem);line-height:.92;letter-spacing:-.025em;margin:0;text-wrap:balance}
.lede{font-size:clamp(1.15rem,1rem + .6vw,1.5rem);max-width:34rem;margin:1.5rem 0 0;line-height:1.4}
.hero__cta{display:flex;flex-wrap:wrap;gap:.8rem;margin:2rem 0 0}
.hero__photo{position:relative;margin:0}
.hero__photo img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:grayscale(1) contrast(1.08) brightness(.98);border:2px solid var(--ink)}
.hero__photo::before{content:"";position:absolute;left:-.8rem;top:1.4rem;width:5.5rem;height:1.6rem;background:var(--red);transform:rotate(-38deg);z-index:2}
.hero__photo figcaption{font:500 .8rem var(--mono);color:var(--muted);margin-top:.5rem;text-align:right}
.stamp{position:absolute;right:1rem;bottom:2.6rem;border:3px solid var(--red);color:var(--red);font:500 clamp(.9rem,2vw,1.4rem)/1 var(--mono);text-transform:uppercase;letter-spacing:.14em;padding:.5rem .8rem;transform:rotate(-9deg);background:rgba(243,240,232,.86)}
.card{background:var(--sheet);border:2px solid var(--ink);padding:1.25rem;box-shadow:8px 8px 0 var(--ink)}
.card__top{display:flex;justify-content:space-between;border-bottom:1px dashed var(--ink);padding-bottom:.7rem}
.card__meta{margin:.9rem 0;display:grid;gap:.5rem}
.card__meta div{display:grid;grid-template-columns:4.5rem 1fr;gap:.5rem;align-items:baseline}
.card__meta dt{color:var(--muted)}
.card__meta dd{margin:0;font-weight:600}
.card__pick{border:0;padding:0;margin:0 0 1rem;display:grid;gap:.4rem}
.card__pick legend{font:500 .78rem var(--mono);color:var(--muted);padding:0;margin-bottom:.4rem}
.card__pick label{display:flex;align-items:center;gap:.7rem;padding:.55rem .7rem;border:1.5px solid var(--hair);cursor:pointer;font-weight:600;transition:background .2s,border-color .2s}
.card__pick label:hover{border-color:var(--ink)}
.card__pick input{appearance:none;width:1.15rem;height:1.15rem;border:2px solid var(--ink);margin:0;display:grid;place-content:center;flex:none;background:#fff}
.card__pick input::after{content:"";width:.55rem;height:.55rem;background:var(--red);transform:scale(0);transition:transform .2s var(--ease)}
.card__pick input:checked::after{transform:scale(1)}
.card__pick label:has(input:checked){border-color:var(--ink);background:var(--paper-2)}
.card__plan{border-top:1px dashed var(--ink);padding:.9rem 0 .4rem}
.card__plan p{margin:.3rem 0 0;line-height:1.45;min-height:3em}
.card__price{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;border-top:1px dashed var(--ink);padding:.8rem 0 1rem}
.card--side{position:sticky;top:1.5rem;align-self:start}
.card--side .btn{margin-top:.6rem}
.card__line{margin:.8rem 0 1rem;font-weight:600}
.fine{font-size:.85rem;color:var(--muted);margin:.8rem 0 0}
@media (min-width:62rem){
  .hero{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:2rem;row-gap:0}
  .hero__text{grid-column:1/7;grid-row:1}
  .hero__photo{grid-column:7/13;grid-row:1/3;margin-top:3rem;z-index:1}
  .hero__photo img{aspect-ratio:4/5;object-position:30% 50%}
  .card--hero{grid-column:1/7;grid-row:2;margin-top:2.5rem;transform:rotate(-.7deg);z-index:2;margin-right:-3rem}
}

/* work order ledger */
.ledger{max-width:var(--max);margin:0 auto;padding:clamp(4rem,8vw,7rem) var(--gut);display:grid;gap:2rem;border-top:2px solid var(--ink)}
.ledger__note{margin:0;color:var(--muted);max-width:26rem;align-self:end}
.ledger__rows{grid-column:1/-1}
.row{border-top:1.5px solid var(--ink)}
.row:last-of-type{border-bottom:1.5px solid var(--ink)}
.row summary{list-style:none;display:grid;grid-template-columns:3.6rem 1fr auto 2rem;align-items:center;gap:1rem;padding:1.3rem .4rem;cursor:pointer;transition:background .2s}
.row summary::-webkit-details-marker{display:none}
.row summary:hover,.row[open] summary{background:var(--paper-2)}
.row__name{font-stretch:105%;font-weight:800;font-size:clamp(1.35rem,1rem + 1.9vw,2.7rem);line-height:1.05;letter-spacing:-.01em}
.row__plus{position:relative;width:1.4rem;height:1.4rem}
.row__plus::before,.row__plus::after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:var(--ink);transition:transform .3s var(--ease)}
.row__plus::after{transform:rotate(90deg)}
.row[open] .row__plus::after{transform:rotate(0)}
.row__body{padding:.2rem .4rem 1.6rem 4.6rem;max-width:46rem}
.row__body p{margin:0 0 .8rem}
.ledger__foot{margin:1.4rem 0 0;color:var(--muted)}
@media (max-width:40rem){.row summary{grid-template-columns:1fr auto 1.6rem}.row__code{grid-column:1/-1;margin-bottom:-.6rem}.row__body{padding-left:.4rem}}
@media (min-width:62rem){.ledger{grid-template-columns:1fr 1fr}}

/* NCT */
.nct{max-width:var(--max);margin:0 auto;padding:clamp(4rem,8vw,7rem) var(--gut);display:grid;gap:2.5rem;align-items:start}
.nct__title p{max-width:34rem;font-size:1.15rem}
.nct__title .h2{margin-bottom:1.5rem}
.sheet{background:var(--sheet);border:2px solid var(--ink);padding:1.4rem;box-shadow:8px 8px 0 var(--red);font-family:var(--mono)}
.sheet__head{margin:0 0 1rem;padding-bottom:.7rem;border-bottom:1px dashed var(--ink);font-size:.78rem}
.sheet ol{list-style:none;margin:0;padding:0;display:grid}
.sheet li{display:flex;align-items:center;gap:.9rem;padding:.7rem 0;border-bottom:1px solid var(--hair);font-size:.95rem}
.tick{width:1.5rem;height:1.5rem;flex:none;color:var(--ink)}
.tick path{stroke:var(--red);stroke-dasharray:30;stroke-dashoffset:0;transition:stroke-dashoffset .5s var(--ease)}
.js .sheet:not(.in) .tick path{stroke-dashoffset:30}
.sheet li:nth-child(2) .tick path{transition-delay:.12s}.sheet li:nth-child(3) .tick path{transition-delay:.24s}.sheet li:nth-child(4) .tick path{transition-delay:.36s}
.sheet li:nth-child(5) .tick path{transition-delay:.48s}.sheet li:nth-child(6) .tick path{transition-delay:.6s}.sheet li:nth-child(7) .tick path{transition-delay:.72s}.sheet li:nth-child(8) .tick path{transition-delay:.84s}
.sheet__foot{margin:1.2rem 0 0;display:flex;gap:.6rem;align-items:flex-end;font-size:.85rem}
.sheet__line{flex:1;border-bottom:1.5px solid var(--ink);height:1px}
@media (min-width:62rem){.nct{grid-template-columns:.8fr 1.2fr;gap:4rem}.nct__title{position:sticky;top:2rem}}

/* used car: the dark band */
.used{background:var(--ink);color:var(--paper);padding:clamp(4rem,8vw,7rem) var(--gut)}
.used__inner{max-width:var(--max);margin:0 auto;display:grid;gap:2.5rem;align-items:center}
.used .h2{margin-bottom:1.5rem}
.used__text p{max-width:34rem;font-size:1.15rem}
.used__photo{margin:0;position:relative}
.used__photo img{width:100%;aspect-ratio:900/432;object-fit:cover;filter:grayscale(1) contrast(1.1);border:2px solid var(--paper);transform:rotate(1.2deg)}
.used__photo figcaption{font:500 .8rem var(--mono);color:#c9c5ba;margin-top:.7rem}
.verdict{border:1.5px solid rgba(243,240,232,.5);padding:1rem 1.2rem}
.verdict p{margin:0 0 .6rem;color:#c9c5ba}
.verdict ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:1.4rem;font-weight:700}
.verdict li{display:flex;align-items:center;gap:.5rem}
.dot{width:.9rem;height:.9rem;display:inline-block}
.dot--ok{background:#7bb87a}.dot--watch{background:#e5b73b}.dot--no{background:#e0483b}
@media (min-width:62rem){.used__inner{grid-template-columns:1fr 1fr;column-gap:5rem}.verdict{grid-column:2}.used__photo{grid-row:1}.used__text{grid-row:1/3;grid-column:1}.used__photo{grid-column:2}}

/* ruler */
.ruler{background:var(--paper-2);padding:clamp(4rem,8vw,7rem) var(--gut);border-bottom:2px solid var(--ink)}
.ruler>*{max-width:var(--max);margin-left:auto;margin-right:auto}
.tape{list-style:none;padding:3rem 0 0;margin-top:3rem;margin-bottom:0;display:grid;gap:2rem;position:relative}
.tape::before{content:"";position:absolute;left:0;right:0;top:0;height:1.6rem;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 14px) 0 100%/100% 55% no-repeat,repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 70px) 0 100%/100% 100% no-repeat;border-bottom:2px solid var(--ink);clip-path:inset(0 0 0 0);transition:clip-path 1.6s var(--ease)}
.js .tape:not(.in)::before{clip-path:inset(0 100% 0 0)}
.tape li{display:grid;gap:.4rem}
.tape b{font-stretch:62%;font-weight:900;font-size:clamp(3.4rem,2rem + 5vw,6.5rem);line-height:.9;color:var(--red);font-variant-numeric:tabular-nums}
.tape span{font-weight:600;font-size:1.15rem;max-width:16rem;line-height:1.35}
@media (min-width:62rem){.tape{grid-template-columns:repeat(4,1fr);gap:2rem}}

/* no-start */
.nostart{max-width:var(--max);margin:0 auto;padding:clamp(4rem,8vw,7rem) var(--gut);display:grid;gap:2.5rem;align-items:center}
.nostart__photo{margin:0;max-width:38rem}
.nostart__photo img{width:100%;aspect-ratio:1071/738;object-fit:cover;filter:grayscale(1) contrast(1.1);border:2px solid var(--ink);transform:rotate(-1.6deg);box-shadow:10px 10px 0 var(--red)}
.nostart__photo figcaption{font:500 .8rem var(--mono);color:var(--muted);margin-top:1rem}
.nostart__text p{font-size:1.15rem;max-width:36rem}
.nostart__text .h2{margin-bottom:1.5rem}
@media (min-width:62rem){.nostart{grid-template-columns:1.1fr .9fr;gap:5rem}}

/* faq */
.faq{max-width:var(--max);margin:0 auto;padding:clamp(3rem,6vw,5rem) var(--gut) clamp(4rem,8vw,7rem);display:grid;gap:2rem;border-top:2px solid var(--ink)}
.faqlist details{border-top:1.5px solid var(--ink)}
.faqlist details:last-child{border-bottom:1.5px solid var(--ink)}
.faqlist summary{list-style:none;cursor:pointer;padding:1.1rem 2.5rem 1.1rem 0;font-weight:700;font-size:1.15rem;position:relative}
.faqlist summary::-webkit-details-marker{display:none}
.faqlist summary::after{content:"+";position:absolute;right:.2rem;top:.9rem;font:500 1.6rem var(--mono);transition:transform .3s var(--ease)}
.faqlist details[open] summary::after{transform:rotate(45deg)}
.faqlist p{margin:0 0 1.2rem;max-width:40rem;color:var(--ink-2)}
@media (min-width:62rem){.faq{grid-template-columns:1fr 1.4fr;gap:5rem}.faq>p{grid-column:2}}

/* call band */
.callband{background:var(--red);color:#fff;text-align:left;padding:clamp(3.5rem,7vw,6rem) var(--gut)}
.callband>*{max-width:var(--max);margin-left:auto;margin-right:auto}
.callband__lead{font-weight:700;font-size:clamp(1.2rem,1rem + 1vw,1.8rem);margin-top:0;margin-bottom:.2rem}
.callband__num{display:block;color:#fff;text-decoration:none;font-stretch:125%;font-weight:800;font-size:clamp(2.6rem,1rem + 9.5vw,9.5rem);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin-bottom:1.2rem}
.callband__num:hover{text-decoration:underline;text-decoration-thickness:.06em;text-underline-offset:.12em}
.callband__btns{margin-top:0;margin-bottom:0;display:flex;flex-wrap:wrap;gap:.8rem}
.callband .btn--ghost:hover{box-shadow:4px 4px 0 var(--ink)}

/* footer */
.foot{background:var(--ink);color:var(--paper);padding:clamp(3rem,6vw,5rem) var(--gut) 2rem}
.foot a{text-decoration:none}.foot a:hover{text-decoration:underline}
.foot__grid{max-width:var(--max);margin:0 auto;display:grid;gap:2rem}
.foot__logo{margin:0 0 .8rem;display:inline-flex;gap:.4rem;align-items:center;font-stretch:118%;font-weight:800;text-transform:uppercase;font-size:1.2rem}
.foot__blurb{max-width:22rem;color:#d4d0c6;margin:0}
.foot .mono{color:#c9c5ba;margin:0 0 .8rem}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.foot__legal{max-width:var(--max);margin:3rem auto 0;padding-top:1.2rem;border-top:1px solid rgba(243,240,232,.25);display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;font-size:.9rem;color:#c9c5ba}
/* 23/10: phone, social icons (only when set) and the three newest posts */
.foot__call{margin:1rem 0 0;font:800 1.5rem/1 var(--display);font-stretch:112%}
.foot__call a{color:#fff;display:inline-block;padding:.35rem 0}
.foot__social{display:flex;gap:.6rem;margin:1rem 0 0}
.foot__social a{display:grid;place-items:center;width:2.75rem;height:2.75rem;border:2px solid rgba(243,240,232,.45);color:var(--paper)}
.foot__social a:hover{border-color:var(--paper);background:var(--red)}
.foot ul a{display:inline-block;padding:.2rem 0}
.foot__posts li{line-height:1.35}
@media (min-width:48rem){.foot__grid{grid-template-columns:repeat(2,1fr)}.foot__grid>:first-child{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:.4rem 3rem;align-items:start}.foot__grid>:first-child>.foot__logo{grid-row:span 3}.foot__blurb{max-width:34rem}}
@media (min-width:64rem){.foot__grid{grid-template-columns:repeat(4,1fr)}}

/* inner pages */
.pagehead{max-width:var(--max);margin:0 auto;padding:clamp(2.5rem,6vw,5rem) var(--gut) clamp(1.5rem,3vw,2.5rem)}
.pagehead__title,.pagehead h1{font-stretch:122%;font-weight:800;font-size:clamp(2.2rem,1rem + 5.5vw,5.8rem);line-height:.95;letter-spacing:-.02em;margin:0;text-wrap:balance}
.pagehead__meta{font:500 .85rem var(--mono);color:var(--muted);margin:0 0 .8rem}
.pagebody{max-width:var(--max);margin:0 auto;padding:1rem var(--gut) clamp(4rem,8vw,7rem);display:grid;gap:2.5rem;border-top:2px solid var(--ink)}
.prose{max-width:44rem;padding-top:1.5rem}
.prose h2{font-stretch:108%;font-weight:800;font-size:clamp(1.5rem,1.2rem + 1.2vw,2.2rem);line-height:1.1;margin:2.4rem 0 .8rem}
.prose h3{font-weight:800;font-size:1.25rem;margin:1.8rem 0 .5rem}
.prose p,.prose li{font-size:1.1rem}
.prose ul,.prose ol{padding-left:1.3rem}
.prose li{margin:.3rem 0}
.prose table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:.92rem;margin:1.4rem 0}
.prose th,.prose td{text-align:left;padding:.8rem .6rem;border-bottom:1.5px solid var(--hair);vertical-align:top}
.prose thead th{border-bottom:2px solid var(--ink);font-weight:500;color:var(--muted)}
.prose figure.wp-block-table{margin:0}
@media (min-width:62rem){.pagebody{grid-template-columns:minmax(0,44rem) 22rem;justify-content:space-between;gap:4rem}}

/* forms */
.jobform{display:grid;gap:1rem;max-width:36rem;margin-top:1.5rem}
.jobform label{display:grid;gap:.35rem;font-weight:600}
.jobform label span{font:500 .78rem var(--mono);color:var(--muted)}
.jobform input,.jobform select,.jobform textarea{font:inherit;padding:.8rem .9rem;border:2px solid var(--ink);border-radius:2px;background:var(--sheet);color:var(--ink);width:100%}
.jobform input[type=file]{padding:.6rem}
.jobform__row{display:grid;gap:1rem}
@media (min-width:36rem){.jobform__row{grid-template-columns:1fr 1fr}}
.hp{position:absolute;left:-9999px}
.notice{padding:1rem 1.2rem;border:2px solid var(--ink);font-weight:700;margin:1rem 0}
.notice--ok{background:#dfeedb}.notice--bad{background:#f6dbd7}
.geo-state{font:500 .85rem var(--mono);color:var(--muted)}

/* blog list */
.postlist{max-width:var(--max);margin:0 auto;padding:0 var(--gut) 6rem;border-top:2px solid var(--ink)}
.postlist__items{list-style:none;margin:0;padding:0;display:grid;gap:0}
.postlist__items>li{border-bottom:1.5px solid var(--hair)}
.postcard{padding:1.6rem 0;display:grid;gap:.4rem}
.postcard__date{font:500 .8rem var(--mono);color:var(--muted);margin:0}
.postcard__title{font-stretch:105%;font-weight:800;font-size:clamp(1.4rem,1rem + 1.6vw,2.3rem);line-height:1.08;margin:0}
.postcard__title a{text-decoration:none}.postcard__title a:hover{color:var(--red)}
.postcard__excerpt{margin:0;max-width:44rem;color:var(--ink-2)}

/* 404 */
.notfound{max-width:46rem;margin:0 auto;padding:clamp(3rem,8vw,7rem) var(--gut)}
.notfound__code{font-stretch:125%;font-weight:900;font-size:clamp(5rem,20vw,11rem);line-height:.9;color:var(--red);margin:.6rem 0}
.notfound__line{font-size:1.3rem;font-weight:600}
.card--tilt{transform:rotate(-1deg)}

/* consent + mobile bar */
.consent{position:fixed;left:1rem;right:1rem;bottom:1rem;max-width:34rem;background:var(--sheet);border:2px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:1rem 1.1rem;z-index:60;font-size:.95rem}
.consent[hidden]{display:none}
.consent p{margin:0 0 .8rem}
.consent .btn{min-height:2.6rem;padding:.55rem .9rem;font-size:.95rem}
.callbar{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:2fr 1fr;z-index:50;border-top:2px solid var(--ink)}
.callbar a{display:flex;align-items:center;justify-content:center;min-height:3.4rem;font-weight:800;text-decoration:none;font-size:1.05rem}
.callbar__call{background:var(--red);color:#fff}
.callbar__wa{background:var(--paper);color:var(--ink);border-left:2px solid var(--ink)}
@media (max-width:47.99rem){body{padding-bottom:3.5rem}.consent{bottom:4.6rem}}
@media (max-width:47.99rem){body.v-b{padding-bottom:calc(3.5rem + 24px)}}
@media (min-width:48rem){.callbar{display:none}}

/* motion: one quiet entrance for the hero, nothing else loops */
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.js .hero__text>*{animation:rise .7s var(--ease) both}
.js .hero__text .lede{animation-delay:.08s}.js .hero__text .hero__cta{animation-delay:.16s}
@keyframes stampin{from{opacity:0;transform:rotate(-9deg) scale(1.5)}to{opacity:1;transform:rotate(-9deg) scale(1)}}
.js .stamp{animation:stampin .35s var(--ease) .6s both}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .sheet:not(.in) .tick path{stroke-dashoffset:0}
  .js .tape:not(.in)::before{clip-path:inset(0)}
}

/* screenshot mode: show the wording that will be live, not the staging markers */
.is-clean .ph,.is-clean .price--ph{display:none!important}
.is-clean .price--live{display:inline!important}
.is-clean .consent{display:none}

.nct__photo{margin:2.2rem 0 0;max-width:34rem}
.nct__photo img{width:100%;aspect-ratio:960/660;object-fit:cover;filter:grayscale(1) contrast(1.1);border:2px solid var(--ink)}
.nct__photo figcaption{font:500 .8rem var(--mono);color:var(--muted);margin-top:.6rem}
.pfig{margin:0 0 2rem}
.pfig img{width:100%;aspect-ratio:16/9;object-fit:cover;filter:grayscale(1) contrast(1.1);border:2px solid var(--ink);box-shadow:8px 8px 0 var(--red)}
.pfig figcaption{font:500 .8rem var(--mono);color:var(--muted);margin-top:1rem}
/* phone: the fixed call bar is at the bottom, so the header only needs the logo and the menu */
@media (max-width:47.99rem){.head__call{display:none!important}.head{grid-template-columns:1fr auto}.logo{font-size:.95rem}.logo__mark{width:2rem;height:2rem}}

/* ---- drawings, glance strip, related, guides, areas (option A; B overrides in variant-b.css) ---- */
.ico{width:1.6rem;height:1.6rem;flex:none}
.nctpair{display:grid;gap:1.4rem;align-items:center}
.nctpair__fig{max-width:19rem;margin:0 auto;color:var(--ink)}
.nctdiag{width:100%;height:auto;display:block;overflow:visible}
.nctdiag .part{transition:opacity .25s}
.nctdiag.has-on .part:not(.is-on){opacity:.18}
.nctdiag .dg{cursor:pointer;outline:none}
.nctdiag .dg circle{fill:var(--red);transition:fill .2s,transform .2s;transform-box:fill-box;transform-origin:center}
.nctdiag .dg text{fill:#fff;font:500 13px var(--mono)}
.nctdiag .dg.is-on circle,.nctdiag .dg:focus-visible circle{fill:var(--ink);transform:scale(1.25)}
.nctlist{list-style:none;margin:0;padding:0;display:grid}
.nctlist li{display:grid;grid-template-columns:1.9rem 1fr;gap:.8rem;align-items:start;padding:.6rem .5rem;border-bottom:1px solid var(--hair);font-family:var(--display);transition:background .2s}
.nctlist li.is-on{background:var(--paper-2)}
.nctlist b{display:grid;place-content:center;width:1.7rem;height:1.7rem;background:var(--red);color:#fff;font:500 .8rem var(--mono)}
.nctlist span{display:grid;font-size:.95rem;line-height:1.35;color:var(--ink-2)}
.nctlist strong{font-size:1.02rem;color:var(--ink)}
.sheet .nctlist li{display:grid}
@media (min-width:48rem){.nctpair{grid-template-columns:minmax(12rem,19rem) 1fr;gap:1.6rem}}
.glance{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));margin:0 0 2rem;border:2px solid var(--ink);background:var(--sheet)}
.glance div{padding:.8rem 1rem;border-right:1px dashed var(--ink);border-bottom:1px dashed var(--ink)}
.glance dt{font:500 .72rem var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.glance dd{margin:.2rem 0 0;font-weight:700;line-height:1.3}
.related{margin-top:3rem;padding-top:1.2rem;border-top:2px solid var(--ink)}
.related h2{font-size:1.2rem!important;margin:0 0 .8rem!important}
.related ul{list-style:none;padding:0;margin:0;display:grid;gap:0}
.related li{margin:0}
.related a{display:flex;align-items:center;gap:.8rem;padding:.9rem .2rem;border-bottom:1px solid var(--hair);text-decoration:none;font-weight:700;font-size:1.08rem}
.related a:hover{color:var(--red)}
.prose .faqlist{margin-top:.8rem}
.guides{max-width:var(--max);margin:0 auto;padding:clamp(3rem,6vw,5rem) var(--gut);border-top:2px solid var(--ink);display:grid;gap:2rem}
.guides__list{list-style:none;margin:0;padding:0;display:grid;gap:0}
.guides__list a{display:grid;gap:.3rem;padding:1.3rem 0;border-top:1.5px solid var(--ink);text-decoration:none}
.guides__list li:last-child a{border-bottom:1.5px solid var(--ink)}
.guides__list a:hover strong{color:var(--red)}
.guides__list strong{font-stretch:105%;font-weight:800;font-size:clamp(1.2rem,1rem + 1vw,1.7rem);line-height:1.15}
.guides__list em{font-style:normal;color:var(--ink-2);max-width:40rem}
.guides__list .mono{color:var(--muted)}
@media (min-width:62rem){.guides{grid-template-columns:1fr 1.6fr;gap:5rem}}
.areas{max-width:var(--max);margin:0 auto;padding:clamp(3rem,6vw,5rem) var(--gut);display:grid;gap:2.5rem;align-items:center;border-top:2px solid var(--ink)}
.areas__map{max-width:34rem;color:var(--ink)}
.dublinmap{width:100%;height:auto;display:block}
.areas__text p{font-size:1.15rem;max-width:34rem}
.areas__text .h2{margin-bottom:1.2rem}
@media (min-width:62rem){.areas{grid-template-columns:1fr 1fr;gap:5rem}}
.areamap{margin:2rem 0;max-width:34rem;color:var(--ink)}
.areamap figcaption{font:500 .8rem var(--mono);color:var(--muted);margin-top:.6rem}
.prose .nctpair{margin:1.5rem 0;padding:1.2rem;background:var(--sheet);border:2px solid var(--ink);box-shadow:8px 8px 0 var(--red)}
@keyframes unveil{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
.js .hero__photo img{animation:unveil 1s var(--ease) both}
@media print{
  .head,.foot,.callbar,.consent,.card--side,.related,.skip{display:none!important}
  body{background:#fff}
  .pagehead,.pagebody{padding:0;border:0}
  .prose .nctpair{box-shadow:none}
}

.know{max-width:var(--max);margin:0 auto;padding:clamp(3rem,6vw,5rem) var(--gut);border-top:2px solid var(--ink);display:grid;gap:2rem}
.know__head p{max-width:30rem;font-size:1.1rem}
.know__list{list-style:none;margin:0;padding:0;display:grid;gap:0}
.know__list li{display:grid;gap:.3rem;padding:1.3rem 0;border-top:1.5px solid var(--ink)}
.know__list li:last-child{border-bottom:1.5px solid var(--ink)}
.know__list b{font-stretch:62%;font-weight:900;font-size:clamp(2.8rem,2rem + 3vw,4.6rem);line-height:.95;color:var(--red);font-variant-numeric:tabular-nums}
.know__list span{font-size:1.1rem;max-width:36rem}
.know__list .mono{color:var(--muted);font-style:normal}
.know__list a.mono{text-underline-offset:.2em}
@media (min-width:62rem){.know{grid-template-columns:1fr 1.5fr;gap:5rem}}