/* ============================================================
   Develop2Any — Services (page-services)
   Translated from mockup/HTML (services mockup, sv-* system).
   Shared chrome (nav, footer, progress bar, grain) lives in main.css.
   ============================================================ */

.sv-page{display:block}

/* shared bits */
.sv-h2{font-family:'Archivo Black',sans-serif;font-size:32px;text-align:center;letter-spacing:-.5px;margin:14px 0 40px}
.sv-h2.is-left{text-align:left;font-size:30px;margin-bottom:30px}
.sv-anchor{scroll-margin-top:72px}
.sv-chip{display:inline-flex;align-items:center;font-family:'Space Mono',monospace;font-size:10.5px;letter-spacing:.5px;color:var(--text-2);border:1px solid var(--border-divider);border-radius:3px;padding:5px 10px}

/* ---------- SECTION NAV (sticky, slides in) ---------- */
.sv-secnav{position:fixed;top:0;left:0;right:0;z-index:38;background:rgba(244,240,229,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--line-2);transform:translateY(-100%);opacity:0;transition:transform .3s cubic-bezier(.2,.7,.2,1),opacity .3s ease;pointer-events:none}
.sv-secnav.is-on{transform:none;opacity:1;pointer-events:auto}
.sv-secnav-in{display:flex;align-items:center;gap:24px;padding-top:11px;padding-bottom:11px}
.sv-secnav-brand{font-family:'Archivo Black',sans-serif;font-size:15px}
.sv-secnav-links{display:flex;gap:20px;margin-left:6px;overflow:hidden}
.sv-secnav-links a{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.5px;color:#777;padding:6px 0;border-bottom:2px solid transparent;transition:color .2s,border-color .2s;white-space:nowrap}
.sv-secnav-links a:hover{color:var(--ink)}
.sv-secnav-links a.is-active{color:var(--red-2);border-bottom-color:var(--red-2)}
.sv-secnav-cta{margin-left:auto;background:var(--red);color:#fff;font-size:12px;font-weight:600;padding:9px 16px;border-radius:3px;white-space:nowrap}

/* ---------- HERO ---------- */
.sv-hero-sec{padding-top:48px;padding-bottom:40px}
.sv-hero{display:grid;grid-template-columns:1.5fr 1fr;gap:54px;align-items:start;margin-top:18px}
.sv-title{font-family:'Archivo Black',sans-serif;font-size:78px;line-height:.92;letter-spacing:-2px}
.sv-lede{font-size:15px;line-height:1.6;color:var(--muted);margin-top:24px;max-width:430px}
.sv-hero-aside{border-left:1px solid var(--line);padding-left:34px;display:flex;align-items:center}
.sv-hero-statement{font-family:'Source Serif 4',serif;font-size:22px;line-height:1.5;color:var(--text-3)}

/* ---------- PICKS ---------- */
.sv-picks-sec{padding-top:30px;padding-bottom:30px}
.sv-picks-label{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:1.5px;margin-bottom:26px}
.sv-picks{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.sv-pick{display:block;color:inherit;padding:0 30px;border-left:1px solid var(--line);transition:transform .2s ease}
.sv-pick:first-child{padding-left:0;border-left:0}
.sv-pick:last-child{padding-right:0}
.sv-pick:hover{transform:translateY(-4px)}
.sv-pick-ico{display:block}
.sv-pick-title{font-family:'Space Mono',monospace;font-size:12px;letter-spacing:1px;font-weight:700;margin-top:16px}
.sv-pick-body{font-size:13px;color:var(--text-soft);margin-top:8px;line-height:1.5}
.sv-pick-arrow{margin-top:26px;font-size:18px}
.sv-pickarrow{display:inline-block;transition:transform .2s ease}
.sv-pick:hover .sv-pickarrow{transform:translateX(5px)}

/* ---------- ENGAGE ---------- */
.sv-engage-sec{padding-top:44px;padding-bottom:44px}
.sv-engage{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0}
.sv-eng-card{padding:0 40px;border-left:1px solid var(--line-2);transition:transform .2s ease}
.sv-eng-card:first-child{padding-left:0;border-left:0}
.sv-eng-card:last-child{padding-right:0}
.sv-eng-card:hover{transform:translateY(-4px)}
.sv-eng-ico{display:block}
.sv-eng-title{font-weight:700;font-size:15px;margin-top:16px;letter-spacing:.3px}
.sv-eng-body{font-size:13.5px;color:var(--muted);margin-top:10px;line-height:1.55}
.sv-eng-list{margin-top:18px;display:flex;flex-direction:column;gap:12px}
.sv-eng-li{display:flex;align-items:center;gap:10px;font-size:13.5px}
.sv-eng-li svg{flex:none}
.sv-learn{display:inline-block;margin-top:20px;font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.5px;color:var(--red-2);transition:color .2s}
.sv-eng-card:hover .sv-learn{color:#7a1717}

/* ---------- CAPABILITIES ---------- */
.sv-caps-sec{padding-top:44px;padding-bottom:44px}
.sv-caps{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0}
.sv-cap-col{padding:0 36px;border-left:1px solid var(--line-2)}
.sv-cap-col:first-child{padding-left:0;border-left:0}
.sv-cap-col:last-child{padding-right:0}
.sv-cap-head{font-family:'Archivo Black',sans-serif;font-size:18px;letter-spacing:-.5px;color:var(--lime-3);padding-bottom:14px;border-bottom:1px solid var(--line-2)}
.sv-cap-list{margin-top:18px;display:flex;flex-direction:column;gap:16px}
.sv-cap-item{display:flex;align-items:center;gap:12px}
.sv-cap-ico{flex:none;line-height:0;color:var(--ink)}
.sv-cap-name{font-size:14.5px;font-weight:500}
.sv-stag{opacity:0;transform:translateX(-10px);transition:opacity .5s ease,transform .5s ease}
.sv-stag.is-in{opacity:1;transform:none}

/* ---------- SERVICES TABLE ---------- */
.sv-table-sec{padding-top:44px;padding-bottom:44px}
.sv-srow{display:grid;grid-template-columns:40px 1.5fr 2fr 1.5fr 32px;gap:18px;align-items:center}
.sv-shead{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:1px;color:#888;padding-bottom:16px;border-bottom:1px solid var(--border-divider)}
a.sv-srow{color:inherit;padding:22px 8px;border-bottom:1px solid var(--line-2);transition:background .2s ease}
a.sv-srow:hover{background:var(--bg-hover)}
.sv-srow-badge{width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex:none;line-height:0}
.sv-srow-title{font-family:'Source Serif 4',serif;font-size:18px;font-weight:600}
.sv-srow-sub{font-size:12px;color:#777;margin-top:2px}
.sv-srow-what{font-size:13px;color:var(--muted);line-height:1.5}
.sv-srow-tech{display:flex;flex-wrap:wrap;gap:6px}
.sv-srow-arrow{text-align:right;font-size:17px}
.sv-arrow{display:inline-block;transition:transform .2s ease}
a.sv-srow:hover .sv-arrow{transform:translateX(5px)}

/* ---------- WHY US (dark) ---------- */
.sv-why-sec{background:var(--dark);color:#fff;padding:60px 0}
.sv-why-head{text-align:center;max-width:720px;margin:0 auto 44px}
.sv-why-title{font-family:'Archivo Black',sans-serif;font-size:30px;letter-spacing:-.5px;margin-top:14px;line-height:1.1}
.sv-why{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.sv-why-item{padding:0 30px;border-left:1px solid #2e2e2e}
.sv-why-item:first-child{padding-left:0;border-left:0}
.sv-why-item:last-child{padding-right:0}
.sv-why-ico{display:block}
.sv-why-item-title{font-family:'Space Mono',monospace;font-size:12px;font-weight:700;letter-spacing:.5px;margin-top:16px}
.sv-why-item-body{font-size:12.5px;color:#9a9a9a;line-height:1.55;margin-top:10px}

/* ---------- TESTIMONIAL ---------- */
.sv-quote-sec{padding-top:56px;padding-bottom:56px}
.sv-quote{display:grid;grid-template-columns:1.5fr 1fr;gap:48px;align-items:center}
.sv-quote-mark{display:block;margin-bottom:14px}
.sv-quote-text{font-family:'Source Serif 4',serif;font-size:26px;line-height:1.4;font-weight:500}
.sv-quote-sub{font-size:15px;line-height:1.6;color:var(--muted);margin-top:14px;max-width:46em}
.sv-quote-by{display:flex;align-items:center;gap:14px;margin-top:24px}
.sv-quote-avatar{width:46px;height:46px;border-radius:50%;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Archivo Black',sans-serif;font-size:15px;flex:none}
.sv-quote-name{font-weight:700;font-size:15px;display:block}
.sv-quote-role{font-size:13px;color:#777;display:block;margin-top:2px}
.sv-quote-clients{border-left:1px solid var(--line);padding-left:34px;display:flex;flex-direction:column;gap:12px}
.sv-quote-clients-label{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:1.5px;color:#888;margin-bottom:4px}
.sv-quote-client{font-family:'Archivo Black',sans-serif;font-size:17px;letter-spacing:-.3px;color:var(--text-3)}

/* ---------- FIT ---------- */
.sv-fit-sec{padding-top:44px;padding-bottom:44px}
.sv-fit{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:start}
.sv-fit-title{font-family:'Archivo Black',sans-serif;font-size:30px;letter-spacing:-.5px;margin-top:14px;line-height:1.12}
.sv-fit-body{font-size:14.5px;line-height:1.65;color:var(--muted);margin-top:18px}
.sv-fit-stats{display:flex;gap:40px;margin-top:26px}
.sv-fit-stat-label{font-family:'Space Mono',monospace;font-size:10.5px;letter-spacing:1px;color:#888}
.sv-fit-stat-val{font-family:'Archivo Black',sans-serif;font-size:24px;letter-spacing:-.5px;margin-top:6px;color:var(--lime-3)}
.sv-fit-cols{display:flex;flex-direction:column;gap:30px}
.sv-fit-col-head{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:1px;font-weight:700;color:#888;margin-bottom:14px}
.sv-fit-col.is-good .sv-fit-col-head{color:var(--lime-3)}
.sv-fit-col.is-bad .sv-fit-col-head{color:#b06}
.sv-fit-li{display:flex;align-items:center;gap:11px;font-size:14.5px;padding:9px 0}
.sv-fit-li svg{flex:none}

/* ---------- FAQ ---------- */
.sv-faq-sec{padding-top:44px;padding-bottom:44px}
.sv-faq-grid{display:grid;grid-template-columns:.8fr 1.6fr;gap:54px;align-items:start}
.sv-faq-title{font-family:'Archivo Black',sans-serif;font-size:30px;letter-spacing:-.5px;margin-top:14px}
.sv-faq-intro{font-size:14.5px;line-height:1.6;color:var(--muted);margin-top:16px}
.sv-faq{border-bottom:1px solid var(--line)}
.sv-faq-q{width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:20px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;font-family:'Archivo',sans-serif;font-size:17px;font-weight:600;color:var(--ink)}
.sv-faq-icon{flex:none;width:24px;height:24px;transition:transform .3s ease}
.sv-faq.is-open .sv-faq-icon{transform:rotate(45deg)}
.sv-faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease}
.sv-faq.is-open .sv-faq-a{max-height:300px}
.sv-faq-a-inner{padding:0 0 22px;font-size:14.5px;line-height:1.65;color:var(--muted);max-width:760px}

/* ---------- CLOSING CTA ---------- */
.sv-cta-sec{padding-top:48px;padding-bottom:48px}
.sv-cta{display:flex;align-items:center;gap:36px}
.sv-cta-scribblewrap{flex:none;display:flex;align-items:center;gap:20px}
.sv-cta-scribble{position:relative;padding:16px 24px}
.sv-cta-script{font-family:'Caveat',cursive;font-size:27px;font-weight:700;line-height:1.05;display:inline-block;position:relative;z-index:1;white-space:nowrap}
.sv-cta-circle{position:absolute;top:-4px;left:-12px;pointer-events:none}
.sv-cta-arrow{flex:none}
.sv-cta-mid{flex:1}
.sv-cta-heading{font-family:'Source Serif 4',serif;font-size:25px;font-weight:600;line-height:1.3}
.sv-cta-sub{font-size:15px;color:var(--muted);margin-top:8px}
.sv-cta-end{flex:none;text-align:center}
.sv-cta-btn{display:inline-flex;align-items:center;gap:12px;background:var(--red);color:#fff;font-size:15px;font-weight:600;padding:16px 38px;border-radius:3px;white-space:nowrap}
.sv-cta-email{font-family:'Source Serif 4',serif;font-size:14px;color:var(--text-2);margin-top:12px}
.sv-cta-email a{color:var(--red-2);text-decoration:underline}

/* ---------- RESPONSIVE ---------- */
@media (max-width:980px){
	.sv-hero{grid-template-columns:1fr;gap:24px}
	.sv-title{font-size:56px}
	.sv-hero-aside{border-left:0;padding-left:0}
	.sv-picks{grid-template-columns:1fr 1fr;row-gap:30px}
	.sv-pick{padding:0 24px}
	.sv-pick:nth-child(odd){padding-left:0;border-left:0}
	.sv-engage{grid-template-columns:1fr;row-gap:30px}
	.sv-eng-card{padding:0;border-left:0;border-top:1px solid var(--line-2);padding-top:26px}
	.sv-eng-card:first-child{border-top:0;padding-top:0}
	.sv-caps{grid-template-columns:1fr;row-gap:34px}
	.sv-cap-col{padding:0;border-left:0}
	.sv-why{grid-template-columns:1fr 1fr;row-gap:30px}
	.sv-why-item:nth-child(3){padding-left:0;border-left:0}
	.sv-quote{grid-template-columns:1fr;gap:30px}
	.sv-quote-clients{border-left:0;padding-left:0;flex-flow:row wrap;gap:18px}
	.sv-fit{grid-template-columns:1fr;row-gap:30px}
	.sv-faq-grid{grid-template-columns:1fr;row-gap:30px}
	.sv-cta{flex-wrap:wrap}
}
@media (max-width:860px){
	.sv-shead{display:none}
	a.sv-srow{display:block;border:1px solid var(--line-2);border-radius:10px;padding:18px 20px;margin-bottom:14px;background:var(--paper-2)}
	.sv-srow > div{margin-top:12px}
	.sv-srow-ico{display:none}
	.sv-srow-name{margin-top:0}
	.sv-srow-what{display:block}
	.sv-srow-tech{display:flex}
	.sv-srow-arrow{display:none}
}
@media (max-width:600px){
	.sv-title{font-size:44px}
	.sv-picks{grid-template-columns:1fr}
	.sv-pick{padding:0}
	.sv-why{grid-template-columns:1fr}
	.sv-why-item{padding:0;border-left:0}
}

@media (prefers-reduced-motion:reduce){
	.sv-stag{opacity:1 !important;transform:none !important;transition:none}
	.sv-pick,.sv-eng-card,.sv-arrow,.sv-pickarrow{transition:none}
}