/* ══════════════════════════════════════
   Simple Tech — Shared Stylesheet
   Fonts: Fraunces (serif) + DM Sans (sans)
   ══════════════════════════════════════ */

:root{--bg:#f3f3f3;--paper:#ebebeb;--ink:#131313;--ink-soft:#5a5a5a;--rule:#1313131a;--blue:#1d97f1;--blue-display:#1c91e7;--blue-text:#1673b7;--accent:#a8d70a;--accent-soft:#c4f50f;--white:#fff;--dark:#0e0e0e}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.5;overflow-x:hidden}
.container{max-width:1280px;margin:0 auto;padding:0 32px}
img{max-width:100%;height:auto;display:block}

/* ── Utility Strip ── */
.topstrip{background:var(--ink);color:var(--bg);font-size:12px;padding:10px 0;display:flex;justify-content:center;gap:48px;letter-spacing:.02em}
.topstrip a{color:var(--accent);text-decoration:none;font-weight:600;display:inline-flex;align-items:center;min-height:24px}
.topstrip a:hover{text-decoration:underline}

/* ── Nav ── */
nav{border-bottom:1px solid var(--rule);background:var(--bg);position:sticky;top:0;z-index:100}
.nav-inner{display:flex;justify-content:space-between;align-items:center;padding:20px 32px;max-width:1280px;margin:0 auto}
.logo img{height:34px;display:block}
.nav-links{display:flex;gap:36px;list-style:none;align-items:center}
.nav-links a{color:var(--ink);text-decoration:none;font-size:14px;font-weight:600;transition:color .2s;display:inline-flex;align-items:center;min-height:24px}
.nav-links a:hover,.nav-links a.active{color:var(--blue-text)}
.nav-cta{background:var(--ink);color:var(--bg)!important;padding:12px 22px;border-radius:100px;font-size:13px;font-weight:600;transition:background .2s}
.nav-cta:hover{background:var(--blue)!important}
.mobile-toggle{display:none;background:none;border:none;font-size:24px;cursor:pointer;color:var(--ink);min-width:44px;min-height:44px;align-items:center;justify-content:center;padding:0}

/* ── Typography ── */
.eyebrow{font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:var(--blue-text);font-weight:600;margin-bottom:24px}
h1{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(48px,8vw,112px);line-height:.92;letter-spacing:-.025em;color:var(--ink)}
h1 em{font-style:italic;font-weight:400;color:var(--blue-display)}
h1 .heavy{font-weight:800;font-style:normal}
h1 .hl-lime{background:linear-gradient(180deg,transparent 60%,var(--accent-soft) 60%);padding:0 .05em}
h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(36px,5vw,64px);line-height:1.05;letter-spacing:-.02em;margin-bottom:32px}
h2 em{font-style:italic;color:var(--blue-display);font-weight:400}
h3{font-family:'Fraunces',serif;font-weight:400;font-size:28px;line-height:1.1;letter-spacing:-.01em;margin-bottom:16px}

/* ── Buttons ── */
.btn-fill{background:var(--ink);color:var(--bg);padding:16px 28px;border-radius:100px;font-size:14px;font-weight:600;text-decoration:none;transition:background .2s;display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;font-family:'DM Sans',sans-serif}
.btn-fill:hover{background:var(--blue)}
.btn-fill.accent{background:var(--accent);color:var(--ink)}.btn-fill.accent:hover{background:var(--accent-soft)}
.btn-link{color:var(--ink);padding:16px 4px;font-size:14px;font-weight:600;text-decoration:none;border-bottom:1.5px solid var(--ink);transition:color .2s,border-color .2s}
.btn-link:hover{color:var(--blue-text);border-color:var(--blue-text)}

/* ── Hero ── */
.hero{padding:80px 0 100px;position:relative;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.hero-meta .lede{font-family:'Fraunces',serif;font-size:22px;line-height:1.5;color:var(--ink);margin-bottom:24px;font-weight:400}
.hero-meta .lede em{font-style:italic;color:var(--blue-display)}
.hero-meta .body{color:var(--ink-soft);font-size:15px;line-height:1.7;margin-bottom:28px}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:32px}
.hero-inline-review{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--ink-soft)}
.hero-inline-review .stars{color:var(--accent);font-size:16px;letter-spacing:2px}

/* ── Trust Bar ── */
.trust-bar{background:var(--ink);color:var(--bg);padding:0;border-top:1px solid #2a2a2a}
.trust-bar-inner{display:grid;grid-template-columns:repeat(4,1fr);text-align:center}
.trust-stat{padding:40px 24px;border-right:1px solid #2a2a2a}
.trust-stat:last-child{border-right:none}
.trust-stat .num{font-family:'Fraunces',serif;font-weight:800;font-size:clamp(36px,5vw,56px);color:var(--accent);line-height:1;margin-bottom:8px}
.trust-stat .label{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#999}
.trust-stat.is-more{display:flex;align-items:center;justify-content:center}
.trust-stat.is-more .num{font-family:inherit;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#999;margin-bottom:0}

/* ── Marquee ── */
.marquee{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:24px 0;overflow:hidden;white-space:nowrap;background:var(--bg)}
.marquee-track{display:inline-block;animation:scroll 40s linear infinite;font-family:'Fraunces',serif;font-size:48px;font-weight:300;font-style:italic}
.marquee-track span{margin:0 32px;color:var(--ink)}.marquee-track .dot{color:var(--accent);font-style:normal;font-size:32px;vertical-align:middle}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── Day in the Life ── */
.daylife{padding:120px 0;border-bottom:1px solid var(--rule)}
.daylife-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.daylife-visual{background:var(--paper);border:1px solid var(--rule);border-radius:16px;padding:48px;position:relative;min-height:400px;display:flex;flex-direction:column;justify-content:center}
.daylife-visual .placeholder-label{font-size:13px;color:var(--ink-soft);letter-spacing:.1em;text-transform:uppercase;text-align:center;margin-bottom:24px}
.timeline-item{display:flex;gap:20px;margin-bottom:32px}
.timeline-item:last-child{margin-bottom:0}
.timeline-time{font-family:'Fraunces',serif;font-style:italic;font-size:14px;color:var(--blue-text);min-width:60px;padding-top:2px}
.timeline-content h3{font-family:'Fraunces',serif;font-weight:600;font-size:17px;margin-bottom:4px}
.timeline-content p{font-size:14px;color:var(--ink-soft);line-height:1.5}

/* ── About ── */
.about{padding:120px 0;border-bottom:1px solid var(--rule)}
.about-grid{display:grid;grid-template-columns:2fr 1fr;gap:80px}
.about-body{font-family:'Fraunces',serif;font-size:24px;line-height:1.5;color:var(--ink);margin-bottom:24px;font-weight:400}
.about-body em{font-style:italic;color:var(--blue-display)}
.about-foot{font-size:15px;line-height:1.7;color:var(--ink-soft);max-width:560px}

/* ── Services Grid ── */
.services{padding:120px 0;background:var(--paper)}
.services-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:64px;flex-wrap:wrap;gap:24px;border-bottom:1px solid var(--ink);padding-bottom:32px}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ink);border:1px solid var(--ink)}
.article{background:var(--bg);padding:40px 32px;cursor:pointer;transition:background .25s}
.article:hover{background:var(--paper)}
.article-num{font-family:'Fraunces',serif;font-style:italic;font-size:14px;color:var(--blue-text);margin-bottom:24px}
.article h3{margin-bottom:16px}
.article h3 em{font-style:italic;color:var(--blue-text)}
.article p{font-size:14px;line-height:1.6;color:var(--ink-soft);margin-bottom:24px}
.article-link{font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--ink);text-decoration:none;transition:color .2s,gap .2s}
.article:hover .article-link{color:var(--blue-text);border-color:var(--blue-text)}

/* ── Pull Quote ── */
.pull{padding:120px 0;text-align:center;border-bottom:1px solid var(--rule)}
.pull blockquote{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(28px,3.5vw,48px);line-height:1.25;letter-spacing:-.015em;max-width:960px;margin:0 auto 24px}
.pull blockquote em{font-style:italic;color:var(--blue-display);font-weight:400}
.pull cite{font-size:13px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-soft);font-style:normal;font-weight:600}

/* ── Why Us ── */
.why{padding:120px 0;border-bottom:1px solid var(--rule)}
.why-head{margin-bottom:64px;max-width:780px}
.why-list{display:grid;grid-template-columns:repeat(2,1fr);gap:64px 80px}
.why-item{display:grid;grid-template-columns:80px 1fr;gap:24px;align-items:start}
.why-num{font-family:'Fraunces',serif;font-style:italic;font-weight:300;font-size:64px;color:var(--blue-display);line-height:.9}
.why-item h3{font-family:'Fraunces',serif;font-weight:600;font-size:22px;margin-bottom:12px;letter-spacing:-.01em}
.why-item p{font-size:15px;line-height:1.7;color:var(--ink-soft)}

/* ── Community ── */
.community{padding:120px 0;background:var(--paper);border-top:1px solid var(--rule)}
.community-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.town-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.town-tag{font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;background:var(--bg);border:1px solid var(--rule);padding:8px 16px;border-radius:100px}

/* ── Reviews ── */
.reviews{padding:120px 0;border-bottom:1px solid var(--rule)}
.reviews-head{margin-bottom:64px;display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:24px}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.review{background:var(--bg);padding:40px 32px;border:1px solid var(--rule);display:flex;flex-direction:column}
.review-quote{font-family:'Fraunces',serif;font-weight:400;font-size:18px;line-height:1.55;margin-bottom:32px;flex:1}
.review-quote::before{content:'\201C';font-family:'Fraunces',serif;font-size:64px;color:var(--blue);line-height:0;vertical-align:-20px;margin-right:4px}
.review-meta{border-top:1px solid var(--rule);padding-top:20px;display:flex;justify-content:space-between;align-items:center}
.review-author{font-weight:600;font-size:14px}.review-author span{display:block;color:var(--ink-soft);font-weight:400;font-size:12px;margin-top:2px}
.review-stars{color:var(--blue-text);font-size:14px;letter-spacing:2px}

/* ── Comparison Table ── */
.comparison{padding:120px 0;background:var(--paper);border-top:1px solid var(--rule)}
.comparison-head{margin-bottom:64px;max-width:700px}
.comp-table{width:100%;border-collapse:collapse;font-size:14px}
.comp-table thead th{font-size:11px;letter-spacing:.15em;text-transform:uppercase;text-align:left;padding:16px 20px;border-bottom:2px solid var(--ink);font-weight:600}
.comp-table thead th:first-child{width:40%}
.comp-table thead th.highlight{background:var(--ink);color:var(--accent);border-radius:8px 8px 0 0;text-align:center}
.comp-table tbody td{padding:16px 20px;border-bottom:1px solid var(--rule);vertical-align:middle}
.comp-table tbody td.highlight{background:var(--ink);color:var(--bg);text-align:center;font-weight:600}
.comp-table tbody tr:last-child td{border-bottom:none}
.comp-table tbody tr:last-child td.highlight{border-radius:0 0 8px 8px}
.check{color:var(--accent);font-size:18px}.cross{color:#c44;font-size:18px}

/* ── Pricing ── */
.pricing-preview{padding:120px 0;border-bottom:1px solid var(--rule)}
.pricing-preview-head{margin-bottom:64px;max-width:700px}
.pricing-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pricing-card{background:var(--bg);border:1px solid var(--rule);padding:40px 32px;position:relative}
.pricing-card.featured{border:2px solid var(--blue);background:var(--white)}
.pricing-card.featured::after{content:'Most Popular';position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--blue);color:var(--white);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:6px 16px;border-radius:100px}
.pricing-card h3{font-family:'Fraunces',serif;font-weight:600;font-size:24px;margin-bottom:8px}
.pricing-card .price{font-family:'Fraunces',serif;font-weight:800;font-size:48px;color:var(--ink);line-height:1;margin-bottom:4px}
.pricing-card .price span{font-size:16px;font-weight:400;color:var(--ink-soft)}
.pricing-card .price-note{font-size:13px;color:var(--ink-soft);margin-bottom:24px}
.pricing-card ul{list-style:none;margin-bottom:32px}
.pricing-card ul li{font-size:14px;padding:8px 0;border-bottom:1px solid var(--rule);color:var(--ink-soft);display:flex;align-items:center;gap:8px}
.pricing-card ul li::before{content:'✓';color:var(--accent);font-weight:700}
.pricing-card .btn-fill{width:100%;text-align:center;justify-content:center}

/* ── Industries ── */
.industries{padding:120px 0;background:var(--paper);border-top:1px solid var(--rule)}
.industries-head{margin-bottom:64px;max-width:780px}
.industries-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ink);border:1px solid var(--ink)}
.industry-card{background:var(--bg);padding:48px 32px}
.industry-card h3{font-family:"Fraunces",serif;font-weight:600;font-size:28px;margin-bottom:16px;line-height:1.1}
.industry-card h3 em{font-style:italic;color:var(--blue-text)}
.industry-card p{font-size:14px;line-height:1.6;color:var(--ink-soft);margin-bottom:20px}
.industry-card ul{list-style:none;margin-bottom:24px}
.industry-card ul li{font-size:13px;padding:6px 0;color:var(--ink-soft);display:flex;align-items:center;gap:8px}
.industry-card ul li::before{content:"✓";color:var(--accent);font-weight:700}

/* ── FAQ ── */
.faq{padding:120px 0;border-bottom:1px solid var(--rule)}
.faq-head{margin-bottom:64px;max-width:700px}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.faq-item{border:1px solid var(--rule);background:var(--bg)}
.faq-q{width:100%;background:none;border:none;color:inherit;text-align:left;font-family:'Fraunces',serif;font-weight:600;font-size:18px;padding:24px 32px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq-q::after{content:'+';font-family:'DM Sans',sans-serif;font-size:24px;color:var(--blue-text);transition:transform .3s}
.faq-item.open .faq-q::after{transform:rotate(45deg)}
.faq-a{padding:0 32px;max-height:0;overflow:hidden;transition:max-height .4s ease,padding .3s ease}
.faq-item.open .faq-a{max-height:300px;padding:0 32px 24px}
.faq-a p{font-size:15px;line-height:1.7;color:var(--ink-soft)}

/* ── How It Works ── */
.how{padding:120px 0;border-bottom:1px solid var(--rule)}
.how-head{margin-bottom:40px}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.step{padding:28px 24px;border:1px solid var(--rule);background:var(--bg)}
.step-num{font-family:'Fraunces',serif;font-style:italic;font-size:40px;color:var(--accent);line-height:1;margin-bottom:12px}
.step h3{font-family:'Fraunces',serif;font-weight:600;font-size:20px;margin-bottom:10px}
.step p{font-size:14px;line-height:1.6;color:var(--ink-soft)}
/* Our Approach only: number + title share one baseline row, tighter card */
.how .step{padding:24px 22px}
.how .step-head{display:flex;align-items:baseline;gap:10px;margin-bottom:12px}
.how .step-num{font-size:26px;margin-bottom:0;flex:0 0 auto}
.how .step h3{margin-bottom:0;line-height:1.2}

/* ── Closing CTA ── */
.closing{padding:140px 0;text-align:center;background:var(--ink);color:var(--bg)}
.closing .eyebrow{color:var(--blue)}.closing h2{color:var(--bg);margin-bottom:24px}.closing h2 em{color:var(--blue)}
.closing p{color:#aaa;font-size:18px;max-width:560px;margin:0 auto 40px;line-height:1.7}
.closing .btn-fill{background:var(--accent);color:var(--ink)}.closing .btn-fill:hover{background:var(--bg)}

/* ── Footer ── */
footer{background:var(--ink);color:var(--bg);padding:60px 0 24px;border-top:1px solid #2a2a2a}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px}
.foot-brand img{height:32px;margin-bottom:20px}
.foot-brand p{color:#888;font-size:14px;line-height:1.6;max-width:280px;font-family:'DM Sans',sans-serif;font-weight:400;margin-top:16px}
.foot-col h4,.foot-col .foot-h{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--blue);margin-bottom:18px;font-weight:600}
.foot-col a{display:flex;align-items:center;min-height:24px;color:#aaa;text-decoration:none;font-size:14px;margin-bottom:5px;transition:color .2s}
.foot-col a:hover{color:var(--bg)}
.foot-bottom{border-top:1px solid #2a2a2a;padding-top:24px;display:flex;justify-content:space-between;font-size:12px;color:#666}
.foot-bottom a{color:#7d7d7d;text-decoration:none;display:inline-flex;align-items:center;min-height:24px}
.foot-bottom a:hover{color:var(--bg)}

/* ── Page Headers ── */
.page-header{padding:80px 0;border-bottom:1px solid var(--rule)}
.page-header h1{font-size:clamp(40px,6vw,80px)}

/* ── Service Detail ── */
.service-detail{padding:80px 0;border-bottom:1px solid var(--rule)}
.service-detail:nth-child(even){background:var(--paper)}
.service-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.service-detail h2{font-family:'Fraunces',serif;font-weight:400;line-height:1.1;letter-spacing:-.01em;font-size:clamp(28px,3vw,40px);margin-bottom:16px}
.service-detail h2 em{font-style:italic;color:var(--blue-display)}
.service-detail p{font-size:15px;line-height:1.7;color:var(--ink-soft);margin-bottom:16px}
.service-features{list-style:none}
.service-features li{font-size:14px;padding:10px 0;border-bottom:1px solid var(--rule);color:var(--ink-soft);display:flex;align-items:center;gap:10px}
.service-features li::before{content:'✓';color:var(--accent);font-weight:700;font-size:16px}

/* ── Team Cards ── */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.team-card{border:1px solid var(--rule);background:var(--bg);overflow:hidden}
.team-photo{aspect-ratio:1/1;background:var(--paper);display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--ink-soft);letter-spacing:.1em;text-transform:uppercase;overflow:hidden}.team-photo img{width:100%;height:100%;object-fit:cover;object-position:center top}
.team-info{padding:32px}
.team-info h3{font-family:'Fraunces',serif;font-weight:600;font-size:24px;margin-bottom:4px}
.team-info .role{font-size:13px;color:var(--blue-text);font-weight:600;letter-spacing:.05em;text-transform:uppercase;margin-bottom:16px}
.team-info p{font-size:14px;line-height:1.6;color:var(--ink-soft)}

/* ── Values ── */
.values{padding:120px 0;background:var(--paper)}
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.value-card{padding:40px 32px;border:1px solid var(--rule);background:var(--bg)}
.value-card h3{font-family:'Fraunces',serif;font-weight:600;font-size:22px;margin-bottom:12px}
.value-card p{font-size:14px;line-height:1.6;color:var(--ink-soft)}

/* ── Contact Form ── */
.contact-section{padding:120px 0}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}
.contact-form label{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--ink);margin-bottom:8px}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;padding:14px 16px;border:1px solid var(--rule);background:var(--bg);font-family:'DM Sans',sans-serif;font-size:14px;margin-bottom:24px;border-radius:0;transition:border-color .2s;color:var(--ink)}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:none;border-color:var(--blue)}
.contact-form textarea{min-height:140px;resize:vertical}
.contact-info-card{background:var(--paper);border:1px solid var(--rule);padding:48px;border-radius:16px}
.contact-info-card h3{font-family:'Fraunces',serif;font-weight:600;font-size:28px;margin-bottom:32px}
.contact-info-item{display:flex;gap:16px;margin-bottom:28px}
.contact-info-item .ci-label{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--blue-text);font-weight:600;margin-bottom:4px}
.contact-info-item .ci-value{font-size:16px;color:var(--ink)}
.contact-info-item .ci-value a{color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;min-height:24px}
.contact-info-item .ci-value a:hover{color:var(--blue-text)}

/* ── Pricing Page Specific ── */
.pricing-section{padding:120px 0}
.pricing-section .pricing-cards{margin-bottom:80px}
.pricing-addons{padding:80px 0;background:var(--paper);border-top:1px solid var(--rule)}
.addons-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:48px}
.addon-card{background:var(--bg);border:1px solid var(--rule);padding:32px;display:flex;justify-content:space-between;align-items:center;gap:24px}
.addon-card h3{font-family:'Fraunces',serif;font-weight:600;font-size:20px;margin-bottom:4px}
.addon-card p{font-size:14px;color:var(--ink-soft)}
.addon-price{font-family:'Fraunces',serif;font-weight:800;font-size:24px;color:var(--ink);white-space:nowrap}

/* ── Animations ── */
.fade{opacity:0;transform:translateY(20px);transition:all .8s ease}.fade.in{opacity:1;transform:none}

/* ── Responsive ── */
@media(max-width:1024px){
.hero-grid,.about-grid,.service-detail-grid,.contact-grid,.community-grid,.daylife-grid{grid-template-columns:1fr;gap:48px}
.services-grid,.reviews-grid{grid-template-columns:repeat(2,1fr)}
.why-list{grid-template-columns:1fr;gap:40px}
.steps{grid-template-columns:repeat(2,1fr)}
.pricing-cards{grid-template-columns:1fr}
.faq-grid{grid-template-columns:1fr}
.trust-bar-inner{grid-template-columns:repeat(2,1fr)}
.trust-stat{border-bottom:1px solid #2a2a2a}
.team-grid{grid-template-columns:1fr}
.values-grid{grid-template-columns:1fr}
.addons-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
.nav-links{display:none}
.mobile-toggle{display:inline-flex}
.nav-links.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--bg);padding:24px 32px;border-bottom:1px solid var(--rule);gap:16px;z-index:99}
.topstrip{flex-direction:column;gap:4px;text-align:center}
.topstrip a.topstrip-remote{display:none}
.foot-grid{grid-template-columns:1fr 1fr}
.foot-bottom{flex-direction:column;gap:8px;text-align:center}
.services-grid{grid-template-columns:1fr}
.reviews-grid{grid-template-columns:1fr}
.steps{grid-template-columns:1fr}
h1{font-size:clamp(40px,10vw,72px)}
.container{padding:0 20px}
.comp-table{font-size:12px}
.comp-table thead th,.comp-table tbody td{padding:10px 12px}
}

@media(max-width:480px){
.trust-stat{padding:32px 16px}
.trust-stat .num{font-size:clamp(22px,7vw,36px)}
}

.tech-strip{padding:44px 0;border-bottom:1px solid var(--rule);background:var(--paper)}
.tech-strip-eyebrow{text-align:center}
.tech-list{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}
.tech-tag{font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;background:var(--bg);border:1px solid var(--rule);padding:9px 18px;border-radius:100px;color:var(--ink)}

.features-label{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin:24px 0 10px 0}

.tech-more{font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);padding:9px 4px;align-self:center}

/* Lucide inline icons: scale and colour from surrounding text */
.icon{width:1em!important;height:1em!important;max-width:1em;max-height:1em;flex:0 0 auto;vertical-align:-0.125em}
svg.icon{display:inline-block}
.btn-link{display:inline-flex;align-items:center;gap:8px}
.article-link{display:inline-flex;align-items:center;gap:8px;min-height:24px}
.article:hover .article-link,.card:hover .article-link{gap:12px}

/* ── Value band (icon + heading + line, on the dark strip) ── */
.trust-bar.is-value .trust-stat{padding:36px 24px}
.trust-bar.is-value .trust-icon{color:var(--accent);margin-bottom:14px;line-height:0}
.trust-bar.is-value .trust-icon .icon{width:30px!important;height:30px!important;max-width:30px;max-height:30px;stroke-width:1.5}
.trust-bar.is-value .num{font-size:clamp(19px,2vw,24px);margin-bottom:8px;letter-spacing:-.01em}
.trust-bar.is-value .label{font-size:13px;line-height:1.5;color:#cfcfcf;text-transform:none;letter-spacing:0}
@media(max-width:900px){.trust-bar.is-value .trust-bar-inner{grid-template-columns:repeat(2,1fr)}
 .trust-bar.is-value .trust-stat:nth-child(2){border-right:none}}
@media(max-width:480px){.trust-bar.is-value .trust-stat{padding:28px 14px}
 .trust-bar.is-value .num{font-size:17px}.trust-bar.is-value .label{font-size:12px}}

/* ── Phone CTA: blue chip + number ── */
/* Phone: quiet secondary to the black CTA. No chip, no icon, thin divider before it. */
.btn-phone{display:inline-flex;align-items:center;min-height:24px;color:var(--ink);
 font-size:16px;font-weight:600;padding:10px 0 10px 28px;position:relative;transition:color .2s;
 text-decoration:underline;text-decoration-color:var(--blue-text);
 text-decoration-thickness:1.5px;text-underline-offset:5px}
.btn-phone::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);
 width:1px;height:28px;background:var(--rule)}
.btn-phone:hover,.btn-phone:focus-visible{color:var(--blue-text)}
.btn-phone.on-dark{color:var(--bg);text-decoration-color:#7fbdf0}
.btn-phone.on-dark::before{background:#3a3a3a}
.btn-phone.on-dark:hover,.btn-phone.on-dark:focus-visible{color:#fff;text-decoration-color:#fff}
/* stacked layout: divider off, sits under the button */
@media(max-width:560px){.btn-phone{padding:10px 0;font-size:15px}.btn-phone::before{display:none}}

/* ── Accessibility: keyboard focus and skip navigation ── */
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink);color:var(--bg);
 padding:12px 20px;border-radius:0 0 8px 0;font-size:14px;font-weight:600;text-decoration:none}
.skip-link:focus{left:0}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.btn-fill:focus-visible,.nav-cta:focus-visible,footer a:focus-visible,.topstrip a:focus-visible,
.trust-bar a:focus-visible,.closing a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
main:focus{outline:none}

/* ── Top utility strip, mobile only (2026-09-05) ───────────────────────
   Two fixes, nothing else. Both live inside the existing 768px mobile
   breakpoint, so desktop is untouched.
   1. "2015" was falling onto a line of its own on larger phones.
      text-wrap:balance evens the two lines instead. Presentation only,
      the sentence itself is unchanged.
   2. The phone link sat hard against the left edge while the sentence
      above it was centred, because the <a> is inline-flex and so aligns
      to flex-start in the column. Centre it under the sentence. */
@media(max-width:768px){
  .topstrip{align-items:center}
  .topstrip > span{text-wrap:balance}
  .topstrip a{align-self:center}
}