/* RGMS quote builder (enquiry.js). v7 system: square corners, Roboto Condensed headings,
   #4d900e field, small green text in --rgms-green-dark. */
.rq{
  --g:var(--rgms-green,#4d900e);--gd:var(--rgms-green-dark,#336507);--gb:var(--rgms-green-bright,#75bb19);
  --ink:var(--rgms-ink,#092a14);--muted:var(--rgms-muted,#3d5244);--soft:var(--rgms-soft,#f0f5eb);--line:#d7e3cc;
  --hd:var(--rgms-heading,'Roboto Condensed',Arial,sans-serif);
  container-type:inline-size;position:relative;color:var(--ink);text-align:left;font-family:var(--rgms-body,inherit)
}
.rq-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.rq [hidden],.rq-hp{display:none!important}
.rq-stage{min-width:0;order:2}
.rq-ticket{order:1}
.rq-inline{padding:clamp(20px,3vw,36px);background:#fff;border:1px solid var(--line);border-top:6px solid var(--g)}

/* Progress: one segment per question */
.rq-top{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.rq-steps{display:flex;gap:5px;flex:1;margin:0;padding:0;list-style:none}
.rq-steps li{flex:1;height:5px;background:#e3ebdb;position:relative;overflow:hidden}
.rq-steps li::after{content:"";position:absolute;inset:0;background:var(--g);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.rq-steps li.done::after,.rq-steps li.now::after{transform:scaleX(1)}
.rq-steps li.now::after{background:var(--gb)}
.rq-count{font:800 14px/1 var(--hd);letter-spacing:.06em;color:var(--gd)}

.rq-panel{animation:rq-in .28s cubic-bezier(.2,.7,.2,1) both}
.rq-panel.back{animation-name:rq-in-back}
@keyframes rq-in{from{opacity:0;transform:translateX(18px)}}
@keyframes rq-in-back{from{opacity:0;transform:translateX(-18px)}}
.rq .rq-q{margin:0;font:800 clamp(28px,4.4cqi,40px)/1 var(--hd);text-transform:uppercase;letter-spacing:-.01em;color:var(--ink);outline:0}
.rq .rq-sub{margin:10px 0 0;color:var(--muted);font-size:16px;line-height:1.5;max-width:52ch}
.rq-body{margin-top:22px}

/* Answer cards */
.rq-cards{display:grid;gap:10px}
.rq-card{position:relative;display:flex;align-items:center;gap:14px;width:100%;padding:14px;border:2px solid var(--line);background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .18s ease,background-color .18s ease,transform .18s ease,box-shadow .18s ease}
.rq-card:hover{border-color:var(--g);transform:translateY(-2px);box-shadow:0 10px 24px -14px rgb(9 42 20 / .45)}
.rq-card.on{border-color:var(--g);background:var(--soft);box-shadow:inset 0 0 0 1px var(--g)}
.rq-card.on::after{content:"";position:absolute;top:10px;right:10px;width:24px;height:24px;background:var(--g) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M6 12l4 4 8-9'/%3E%3C/svg%3E") center/16px no-repeat}
.rq-card-text{display:grid;gap:3px;min-width:0}
.rq-card strong{font:800 18px/1.1 var(--hd);text-transform:uppercase}
.rq-card small{font-size:14px;line-height:1.35;color:var(--muted)}

.rq-services{grid-template-columns:repeat(2,minmax(0,1fr))}
.rq-service{flex-direction:column;align-items:stretch;padding:0;gap:0;overflow:hidden}
.rq-service img,.rq-else{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.rq-service:hover img{transform:scale(1.05)}
.rq-else{display:grid;place-items:center;background:var(--g) repeating-linear-gradient(135deg,transparent 0 14px,rgb(255 255 255 / .07) 14px 28px);color:#fff}
.rq-else svg{width:42px;height:42px}
.rq-service .rq-card-text{padding:11px 12px 13px;position:relative;z-index:1;background:inherit}
.rq-service strong{font-size:16px}
.rq-service small{font-size:13px}

.rq-sizes,.rq-times{grid-template-columns:repeat(2,minmax(0,1fr))}
.rq-size{flex-direction:column;align-items:flex-start;padding:16px}
.rq-sketch svg{display:block;width:84px;height:63px;color:var(--g);transition:transform .25s ease}
.rq-size:hover .rq-sketch svg{transform:scale(1.08)}
.rq-icon{display:grid;place-items:center;flex:none;width:48px;height:48px;background:var(--soft);color:var(--gd)}
.rq-icon svg{width:24px;height:24px}
.rq-time.on .rq-icon{background:var(--g);color:#fff}

/* Text steps */
.rq-field{display:grid;gap:7px;margin-bottom:14px}
.rq-field>span{font:700 15px/1.2 var(--hd);text-transform:uppercase;letter-spacing:.03em}
.rq-input{width:100%;min-height:56px;padding:14px 16px;border:2px solid var(--line);border-radius:0;background:#fff;font:inherit;font-size:17px;color:var(--ink)}
textarea.rq-input{min-height:96px;resize:none;overflow:hidden;line-height:1.5}
.rq-input:focus{outline:0;border-color:var(--g);box-shadow:0 0 0 3px rgb(77 144 14 / .2)}
.rq-postcode .rq-input{font:800 30px/1 var(--hd);letter-spacing:.06em;text-transform:uppercase;max-width:300px}
.rq-patch{display:none;margin:0;padding:12px 14px 12px 44px;font-weight:600;font-size:15px;position:relative;animation:rq-in .25s ease both}
.rq-patch.ok,.rq-patch.maybe{display:block}
.rq-patch.ok{background:var(--soft);color:var(--gd)}
.rq-patch.ok::before{content:"";position:absolute;left:14px;top:12px;width:20px;height:20px;background:var(--g) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M6 12l4 4 8-9'/%3E%3C/svg%3E") center/14px no-repeat}
.rq-patch.maybe{background:#f6f3e8;color:#5a4a12}
.rq-patch.maybe::before{content:"?";position:absolute;left:14px;top:12px;width:20px;height:20px;display:grid;place-items:center;background:#8a6d10;color:#fff;font:800 14px/1 var(--hd)}
.rq-pair{display:grid;grid-template-columns:1fr;gap:0 14px}

.rq-tags{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:18px}
.rq-tags .rq-tag{text-align:left}
.rq-tag{padding:10px 14px;border:2px solid var(--line);background:#fff;color:var(--ink);font:700 15px/1.1 var(--hd);cursor:pointer;transition:border-color .15s ease,background-color .15s ease}
.rq-tag::before{content:"+ ";color:var(--gd)}
.rq-tag:hover{border-color:var(--g)}
.rq-tag.on{background:var(--ink);border-color:var(--ink);color:#fff}
.rq-tag.on::before{content:"✓ ";color:var(--gb)}
.rq-photo-row{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch}
.rq-photos{display:contents}
.rq-thumb{position:relative;width:86px;height:86px;overflow:hidden;background:#e3ebdb;animation:rq-pop .25s ease both}
@keyframes rq-pop{from{opacity:0;transform:scale(.85)}}
.rq-thumb img{width:100%;height:100%;object-fit:cover}
.rq-thumb button{position:absolute;top:4px;right:4px;width:26px;height:26px;border:0;background:rgb(9 42 20 / .8);color:#fff;font-size:17px;line-height:1;cursor:pointer}
.rq-drop{display:flex;align-items:center;gap:12px;flex:1;min-width:220px;min-height:86px;padding:12px 16px;border:2px dashed #a9c98c;background:var(--soft);color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color .15s ease,background-color .15s ease}
.rq-drop:hover,.rq-drop.over{border-color:var(--g);background:#e6f0dc}
.rq-drop svg{width:30px;height:30px;color:var(--gd)}
.rq-drop>span:last-child{display:grid;gap:2px}
.rq-drop strong{font:800 17px/1.1 var(--hd);text-transform:uppercase}
.rq-drop small{font-size:14px;color:var(--muted)}

.rq-err{margin:10px 0 0;color:#b3261e;font-size:15px;font-weight:600}
.rq-err:empty{display:none}

.rq-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:24px}
.rq-next,.rq-back{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 24px;border-radius:0;font:800 18px/1 var(--hd);text-decoration:none;cursor:pointer;transition:background-color .18s ease,border-color .18s ease,transform .18s ease}
.rq-next{border:0;background:var(--gb);color:#0a2005}
.rq-next:hover{background:#8ed437;transform:translateY(-2px)}
.rq-back{border:2px solid var(--line);background:#fff;color:var(--ink)}
.rq-back:hover{border-color:var(--ink)}
.rq-hint{font:700 15px/1 var(--hd);text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.rq :is(button,a,input,textarea):focus-visible{outline:3px solid #153a7b;outline-offset:2px}

/* The job ticket */
.rq-ticket{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;padding:10px;background:var(--soft);border:1px solid var(--line)}
.rq-ticket-photo{position:relative;aspect-ratio:1;overflow:hidden;background:var(--g);color:#fff}
.rq-ticket-photo img{display:block;width:100%;height:100%;object-fit:cover;animation:rq-fade .4s ease both}
.rq-ticket-photo img.kept{animation:none}
@keyframes rq-fade{from{opacity:0;transform:scale(1.06)}}
.rq-ticket-photo.empty{display:grid;place-items:center}
.rq-ticket-photo.empty svg{width:30px;height:30px}
.rq-ticket-stamp{display:none}
.rq-ticket-kicker{margin:0;font:800 12px/1 var(--hd);letter-spacing:.08em;text-transform:uppercase;color:var(--gd)}
.rq .rq-ticket-title{margin:4px 0 0;font:800 17px/1.1 var(--hd);text-transform:uppercase}
.rq-ticket dl,.rq-ticket-foot{display:none}
.rq-change{padding:0;margin-top:4px;border:0;background:none;color:var(--gd);font:700 14px/1.2 var(--hd);text-transform:uppercase;letter-spacing:.04em;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* Wide: question on the left, the ticket fills in on the right */
@container (min-width:720px){
  .rq-grid{grid-template-columns:minmax(0,1fr) 280px;gap:36px}
  .rq-stage{order:1}
  .rq-ticket{order:2;align-self:start;position:sticky;top:0;display:block;padding:0;background:#fff;border:2px solid var(--ink)}
  .rq-ticket-photo{aspect-ratio:4/3}
  .rq-ticket-photo.empty svg{width:48px;height:48px}
  .rq-ticket-stamp{display:block;position:absolute;left:0;bottom:0;padding:7px 10px;background:var(--ink);color:#fff;font:800 13px/1 var(--hd);letter-spacing:.06em;text-transform:uppercase}
  .rq-ticket-body{padding:16px 18px 18px}
  .rq .rq-ticket-title{font-size:22px}
  .rq-ticket dl{display:grid;margin:14px 0 0;border-top:1px dashed #9db58a}
  .rq-line{display:grid;grid-template-columns:62px minmax(0,1fr);gap:8px;padding:9px 0;border-bottom:1px dashed #9db58a;font-size:14px}
  .rq-line dt{font:700 13px/1.4 var(--hd);text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
  .rq-line dd{margin:0;color:#8a9a8d;overflow-wrap:anywhere}
  .rq-line.on dd{color:var(--ink);font-weight:600}
  .rq-line.new dd{animation:rq-in .3s ease both}
  .rq-line dd button{padding:0;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px}
  .rq-line dd button:hover{color:var(--gd)}
  .rq .rq-ticket-foot{display:block;margin:14px 0 0;font-size:13.5px;line-height:1.45;color:var(--muted)}
  .rq-ticket-foot a{color:var(--gd);font-weight:700;white-space:nowrap}
  .rq-pair{grid-template-columns:1fr 1fr}
  .rq-pair .rq-field:last-child{grid-column:1/-1}
}

/* Nine services sit as 3 x 3; on a narrow form it is 2 per row with "Something else" as a full-width row. */
@container (min-width:560px){.rq-services{grid-template-columns:repeat(3,minmax(0,1fr))}.rq-tags{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container (max-width:559px){
  .rq-services>:last-child:nth-child(odd){grid-column:1/-1;flex-direction:row;align-items:center}
  .rq-services>:last-child:nth-child(odd) .rq-else{width:84px;flex:none;aspect-ratio:1}
}

/* Finished */
.rq-tick svg{width:64px;height:64px;margin-bottom:14px}
.rq-tick circle{fill:var(--g);transform-origin:center;animation:rq-pop .35s ease both}
.rq-tick path{fill:none;stroke:#fff;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40;animation:rq-draw .45s .25s ease forwards}
@keyframes rq-draw{to{stroke-dashoffset:0}}
.rq-next-steps{display:grid;gap:0;margin:22px 0 0;padding:0;list-style:none;counter-reset:s}
.rq-next-steps li{display:grid;grid-template-columns:40px 1fr;column-gap:12px;padding:12px 0;border-top:1px solid var(--line);counter-increment:s;animation:rq-in .35s ease both}
.rq-next-steps li:nth-child(2){animation-delay:.1s}.rq-next-steps li:nth-child(3){animation-delay:.2s}
.rq-next-steps li::before{content:counter(s);grid-row:span 2;display:grid;place-items:center;width:40px;height:40px;background:var(--soft);color:var(--gd);font:800 20px/1 var(--hd)}
.rq-next-steps strong{font:800 18px/1.2 var(--hd);text-transform:uppercase}
.rq-next-steps span{color:var(--muted);font-size:15px}
.rq-fallback{display:grid;gap:10px}
.rq-spin{width:38px;height:38px;margin:18px 0;border:4px solid #e3ebdb;border-top-color:var(--g);border-radius:50%;animation:rq-spin .8s linear infinite}
@keyframes rq-spin{to{transform:rotate(360deg)}}

/* Dialog from the quote buttons */
.rq-dialog{width:min(1040px,calc(100vw - 48px));max-height:calc(100dvh - 48px);padding:clamp(22px,3.5vw,40px);border:0;border-top:6px solid var(--rgms-green,#4d900e);background:#fff;box-shadow:0 30px 80px -20px rgb(9 42 20 / .5);overflow:auto}
.rq-dialog[open]{animation:rq-rise .3s cubic-bezier(.2,.7,.2,1) both}
@keyframes rq-rise{from{opacity:0;transform:translateY(24px)}}
.rq-dialog::backdrop{background:rgb(9 42 20 / .62)}
.rq-dialog .rq{padding-top:8px}
.rq-x{position:absolute;z-index:2;top:-22px;right:-18px;width:44px;height:44px;border:0;background:var(--soft);color:var(--ink);font-size:26px;line-height:1;cursor:pointer}
.rq-x:hover{background:var(--line)}
.rq-dialog .rq-top{padding-right:40px}
html.rq-lock{overflow:hidden}

@media (max-width:640px){
  .rq-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:18px 16px calc(16px + env(safe-area-inset-bottom));border-top-width:5px}
  .rq-x{top:-12px;right:-8px}
  .rq-dialog .rq-ticket{margin-right:38px}
  .rq-services{gap:8px}
  .rq-service .rq-card-text{padding:9px 10px 11px}
  .rq-service strong{font-size:14.5px}
  .rq-service small{display:none}
  .rq-time{padding:12px}
  .rq-icon{width:40px;height:40px}
  .rq-nav{position:sticky;bottom:-16px;margin-inline:-16px;padding:12px 16px;background:#fff;border-top:1px solid var(--line)}
  .rq-inline .rq-nav{position:static;margin-inline:0;padding:0;border:0}
  .rq-next{flex:1}
}
@media (prefers-reduced-motion:reduce){
  .rq *,.rq-dialog[open]{animation:none!important;transition:none!important}
  .rq-tick path{stroke-dashoffset:0}
}

.rq-card[aria-disabled="true"]{cursor:wait}
.rq button:disabled{opacity:.55;cursor:default;transform:none}
.rq-q{scroll-margin-top:24px}
.rq-fallback input[type="checkbox"]{width:24px;height:24px;accent-color:var(--gd)}
.rq :is(button,a,input,textarea,select):focus-visible{outline:3px solid #153a7b;outline-offset:2px}

@container (min-width:720px){.rq-pair .rq-field:nth-last-child(-n+2){grid-column:1/-1}}