/* Page styles from the original design (page-contact). Generated by tools/seed/services.php. */
.c-hero{padding:150px 0 32px;position:relative;overflow:hidden;text-align:center}
.c-hero .wrap{position:relative;z-index:1}
.c-hero h1{font-size:clamp(2.6rem,6.2vw,5.4rem);letter-spacing:-.05em}
.c-hero h1 .plus{color:var(--lime-2)}
.c-hero p.sub{max-width:600px;margin:22px auto 0;font-size:clamp(1.05rem,1.4vw,1.2rem);color:var(--ink-2)}
.contact-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(16px,2.4vw,28px);align-items:start;position:relative;z-index:1}
.form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form .full{grid-column:1/-1}
.form label.f{display:grid;gap:6px;font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.form input[type=text],.form input[type=email],.form select,.form textarea{width:100%;background:#fff;border:0;border-radius:var(--r-sm);padding:12px 14px;box-shadow:0 0 0 1px var(--line);font:400 16px/1.4 "Geist",system-ui,sans-serif;color:var(--ink);text-transform:none;letter-spacing:0}
.form textarea{min-height:120px;resize:vertical}
.form input:focus-visible,.form select:focus-visible,.form textarea:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
.form .req{color:var(--muted)}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-2)}
.consent input{width:18px;height:18px;margin-top:2px;accent-color:#141414;flex:none}
.form .actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.form .status{font-size:14px;min-height:1.4em;color:var(--ink)}
.form h2{font-size:clamp(1.6rem,2.4vw,2.2rem)}
.next{display:grid;gap:12px}
.next .device .screen{min-height:0;padding:22px;display:flex;flex-direction:column;gap:16px}
.next ol{list-style:none;display:grid;gap:0;position:relative;z-index:1}
.next ol li{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:12px 0;position:relative}
.next ol li:not(:last-child)::after{content:"";position:absolute;left:16px;top:42px;bottom:-6px;width:2px;background:var(--dark-3)}
.next ol li .n{width:34px;height:34px;border-radius:50%;background:var(--dark-3);display:grid;place-items:center;font-family:var(--mono);font-size:12px;color:var(--lime)}
.next ol li:first-child .n{background:var(--lime);color:var(--ink)}
.next ol li b{display:block;font-weight:500;color:#fff}
.next ol li span{font-size:14px;color:var(--dark-muted)}
.next .when{font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--lime);display:block;margin-top:2px}
.mailcard{background:var(--glass-bg);border-radius:var(--r-lg);padding:22px;box-shadow:var(--glass-edge);display:flex;flex-direction:column;gap:10px}
.mailcard a.addr{font-size:clamp(1.05rem,1.6vw,1.35rem);font-weight:500;letter-spacing:-.02em;overflow-wrap:anywhere;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.mailcard p{font-size:15px;color:var(--ink-2)}
.intent{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.irow{--acc:var(--lime-2);position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-height:250px;width:100%;text-align:left;border:0;cursor:pointer;font:inherit;color:inherit;background:var(--card);border-radius:var(--r-lg);padding:22px;overflow:hidden;box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgb(0 0 0/.04),inset 0 4px 0 var(--acc);transition:transform .3s var(--ease),box-shadow .3s,background-color .3s}
.irow::after{content:"";position:absolute;right:-40px;bottom:-40px;width:140px;height:140px;border-radius:50%;background:var(--acc);opacity:.16;filter:blur(18px);transition:opacity .3s,transform .4s var(--ease)}
.irow:hover{transform:translateY(-6px);background:#fff;box-shadow:0 22px 40px -24px rgb(0 0 0/.4),0 0 0 1px rgb(0 0 0/.05),inset 0 4px 0 var(--acc)}
.irow:hover::after{opacity:.35;transform:scale(1.15)}
.irow:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.irow .px{padding:10px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px rgb(0 0 0/.05)}
.irow:hover .px i.on{background:var(--ink)}
.irow .ttl{font-size:1.25rem;font-weight:500;letter-spacing:-.02em;line-height:1.1;margin-top:auto}
.irow .dsc{font-size:14.5px;color:var(--ink-2)}
.irow .go{position:absolute;top:18px;right:18px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--panel);font-size:16px;transition:transform .3s var(--ease),background-color .3s}
.irow:hover .go{transform:translateX(3px) rotate(-45deg);background:var(--acc)}
.irow.tq{background:var(--dark);color:#fff}
.irow.tq .dsc{color:#cfcfcb}
.irow.tq .px{background:var(--dark-2);box-shadow:none}
.irow.tq .px i.on,.irow.tq:hover .px i.on{background:#5ef0cf}
.irow.tq .go{background:var(--dark-3);color:#fff}
.irow.tq:hover{background:#262626}
.next ol li:not(:last-child)::after{background:linear-gradient(var(--lime),var(--lime)) top/2px 0 no-repeat,var(--dark-3);transition:background-size 1.2s var(--ease)}
.next.in ol li:not(:last-child)::after{background-size:2px 100%,auto}
@media (max-width:1100px){ .intent{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:760px){ .intent{grid-template-columns:1fr 1fr} .irow{min-height:200px} }
@media (max-width:460px){ .intent{grid-template-columns:1fr} .irow{min-height:0} }
.intent-note{margin-top:14px;font-size:15px;color:var(--ink-2)}
.intent-note a{text-decoration:underline;text-underline-offset:3px}
@media (max-width:1000px){ .contact-grid{grid-template-columns:1fr} }
@media (max-width:600px){ .c-hero{padding-top:120px} .c-hero h1{font-size:2.05rem} .form{grid-template-columns:1fr} }
/* after you write: step track */
.track5{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;position:relative}
.track5::before{content:"";position:absolute;left:24px;right:24px;top:23px;height:2px;background:linear-gradient(90deg,var(--lime-2),rgb(20 20 20/.12))}
.track5 li{position:relative;display:flex;flex-direction:column;gap:10px}
.track5 .dot{width:48px;height:48px;border-radius:50%;background:#fff;display:grid;place-items:center;font-family:var(--mono);font-size:13px;box-shadow:var(--glass-edge);position:relative;z-index:1}
.track5 li:first-child .dot{background:var(--lime)}
.track5 .body{background:var(--glass-bg);border-radius:var(--r-lg);padding:18px;box-shadow:var(--glass-edge);flex:1;display:flex;flex-direction:column;gap:8px}
.track5 h3{font-size:1.15rem;letter-spacing:-.02em}
.track5 p{font-size:14.5px;color:var(--ink-2)}
.track5 .aim{margin-top:auto;font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.aim-note{display:flex;gap:14px;align-items:flex-start;margin-top:16px;padding:16px 18px;border-radius:var(--r-md);background:var(--dark);color:var(--dark-ink);font-size:15px}
.aim-note b{flex:none;font-family:var(--mono);font-weight:500;font-size:11px;letter-spacing:.05em;text-transform:uppercase;background:var(--lime);color:var(--ink);border-radius:999px;padding:4px 9px;margin-top:1px}
/* prepare: three columns */
.prep{display:grid;grid-template-columns:1.2fr 1fr .8fr;gap:12px}
.prep article{border-radius:var(--r-lg);padding:24px;display:flex;flex-direction:column;gap:12px}
.prep article:nth-child(1){background:var(--lime)}
.prep article:nth-child(2){background:var(--card);box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgb(0 0 0/.03)}
.prep article:nth-child(3){background:transparent;border:2px dashed rgb(20 20 20/.16)}
.prep h3{font-size:1.3rem;letter-spacing:-.02em}
.prep .tag{font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.prep ul{list-style:none;display:grid;gap:10px;font-size:15px}
.prep li{padding-left:18px;position:relative;color:var(--ink-2)}
.prep li::before{content:"";position:absolute;left:0;top:.5em;width:8px;height:8px;border-radius:2px;background:var(--ink)}
.prep article:nth-child(3) li::before{background:none;border:1.5px solid var(--muted);border-radius:50%}
.prep li b{color:var(--ink);font-weight:500}
/* engagement options as glass rows */
.opts{display:grid;gap:10px}
.opt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:center;background:var(--glass-bg);border-radius:var(--r-lg);padding:18px 22px;box-shadow:var(--glass-edge)}
.opt.head{background:none;box-shadow:none;padding:0 22px;font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.opt h3{font-size:1.15rem;letter-spacing:-.02em}
.opt p,.opt span{font-size:14.5px;color:var(--ink-2)}
.opt .k{display:none;font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.opt.dk{background:var(--dark);color:var(--dark-ink)}
.opt.dk p,.opt.dk span{color:var(--dark-muted)}
.opt.dk .k{color:var(--lime)}
/* comms split */
.comms{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,4vw,56px);align-items:center}
.comms .prose{display:grid;gap:14px;color:var(--ink-2);font-size:1.0625rem}
.chan{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.chan div{background:#fff;border-radius:var(--r-md);padding:16px;box-shadow:0 0 0 1px rgb(0 0 0/.04)}
.chan b{display:block;font-weight:500}
.chan span{display:block;margin-top:4px;font-size:14px;color:var(--ink-2)}
@media (max-width:1000px){ .track5{grid-template-columns:1fr} .track5::before{left:23px;right:auto;top:24px;bottom:24px;width:2px;height:auto;background:linear-gradient(180deg,var(--lime-2),rgb(20 20 20/.12))} .track5 li{flex-direction:row;align-items:flex-start} .track5 .dot{flex:none} .prep,.comms{grid-template-columns:1fr} }
@media (max-width:760px){ .opt{grid-template-columns:1fr;gap:8px} .opt.head{display:none} .opt .k{display:block;margin-top:6px} }
@media (max-width:460px){ .chan{grid-template-columns:1fr} }