/* timcanfixit - page-specific CSS for 'sell-your-device'. Generated. */

h1,h2,h3,h4{font-family:var(--font-display); line-height:1.15; margin:0; text-wrap:balance; letter-spacing:-.01em}
h2.section-title{font-size:clamp(1.6rem,3vw,2.3rem); font-weight:800}
.section-lede{color:var(--ink-soft); font-size:1.05rem; max-width:62ch}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.55em; font-weight:700; font-size:.98rem; padding:.9em 1.5em; border-radius:999px; border:1px solid transparent; text-decoration:none; cursor:pointer; transition:transform .18s var(--ease); white-space:nowrap}
.btn-secondary{background:transparent; color:var(--ink); border-color:var(--line)}
.btn-secondary:hover{border-color:var(--solder); color:var(--solder-text)}
.on-dark .btn-secondary{color:var(--hero-ink); border-color:var(--hero-line)}
.btn-block{width:100%}
.brand-mark{width:38px; height:38px; flex:none; object-fit:contain}
@media (max-width:640px){.btn-header-book{display:none}}
@media (max-width:640px){.section{ padding-block:var(--space-5); }}
.hero{position:relative; background:var(--hero-bg); color:var(--hero-ink); padding-block:var(--space-6) var(--space-5); overflow:hidden}
.hero-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:var(--space-5); align-items:center; position:relative; z-index:2}
@media (max-width:960px){.hero-grid{ grid-template-columns:1fr; }}
.breadcrumb{font-family:var(--font-mono); font-size:.75rem; color:var(--breadcrumb-ink); display:flex; gap:.5em; margin-bottom:var(--space-2)}
.hero h1{font-size:clamp(2.1rem,4.4vw,3.2rem); font-weight:800; margin-block:.6rem .9rem; max-width:18ch}
.hero-lede{font-size:1.1rem; color:var(--hero-lede-ink); max-width:56ch; margin-bottom:var(--space-3)}
.hero-ctas{display:flex; flex-wrap:wrap; gap:1rem}
.quote-preview{background:linear-gradient(160deg,#0D1530,#0A0F24 60%); border:1px solid var(--hero-line); border-radius:var(--radius-l); padding:var(--space-3); box-shadow:0 24px 60px -20px rgba(4,8,24,.55)}
.qp-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem}
.qp-head span{font-family:var(--font-mono); font-size:.7rem; color:var(--breadcrumb-ink); text-transform:uppercase; letter-spacing:.08em}
.qp-steps{display:flex; gap:.3rem; margin-bottom:1.2rem}
.qp-steps i{flex:1; height:4px; border-radius:2px; background:var(--hero-line)}
.qp-steps i.done{background:var(--solder-2)}
.qp-cats{display:grid; grid-template-columns:repeat(2,1fr); gap:.6rem}
.qp-cat{background:rgba(255,255,255,.06); border:1px solid var(--hero-line); border-radius:10px; padding:.9rem; text-align:center; font-size:.85rem; color:var(--hero-lede-ink)}
.qp-cat.active{border-color:var(--solder-2); background:rgba(242,121,61,.15); color:#fff}
.qp-foot{margin-top:1rem; font-family:var(--font-mono); font-size:.72rem; color:#7C8AC0; display:flex; justify-content:space-between}
.cat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-3)}
@media (max-width:960px){.cat-grid{ grid-template-columns:repeat(2,1fr); }}
@media (max-width:560px){.cat-grid{ grid-template-columns:1fr; }}
.cat-card{background:var(--paper-raised); border:1px solid var(--line); border-top:4px solid var(--solder); border-radius:var(--radius-m); padding:var(--space-3); display:flex; flex-direction:column; gap:.6rem}
.cat-card .icon{width:44px; height:44px; border-radius:12px; background:var(--circuit-bg); color:var(--circuit); display:flex; align-items:center; justify-content:center}
.cat-card .icon svg{width:24px; height:24px}
.cat-card h3{font-size:1.02rem; font-weight:700}
.cat-card ul{display:flex; flex-direction:column; gap:.3rem}
.cat-card li{font-size:.85rem; color:var(--ink-soft)}
.process-rail{display:grid; grid-template-columns:repeat(5,1fr); gap:var(--space-2); counter-reset:step; position:relative}
@media (max-width:960px){.process-rail{ grid-template-columns:repeat(2,1fr); }}
@media (max-width:560px){.process-rail{ grid-template-columns:1fr; }}
.process-step{position:relative; padding-top:2.6rem}
.process-step::before{counter-increment:step; content:counter(step,decimal-leading-zero); font-family:var(--font-mono); font-weight:700; font-size:.85rem; color:var(--solder-text); background:var(--circuit-bg); width:2.4rem; height:2.4rem; border-radius:50%; display:flex; align-items:center; justify-content:center; position:absolute; top:0; left:0}
.process-rail .process-step:not(:last-child)::after{content:""; position:absolute; top:1.2rem; left:2.4rem; right:-.8rem; height:2px; background:var(--line)}
@media (max-width:960px){.process-rail .process-step::after{ display:none; }}
.process-step h3{font-size:1rem; font-weight:700; margin-bottom:.4rem}
.process-step p{color:var(--ink-soft); font-size:.9rem}
.trust-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-3)}
@media (max-width:800px){.trust-grid{ grid-template-columns:1fr; }}
.trust-card{background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-m); padding:var(--space-3)}
.trust-card h3{font-size:1rem; font-weight:700; margin-bottom:.5rem}
.trust-card p{color:var(--ink-soft); font-size:.92rem}
.faq-list{display:flex; flex-direction:column; gap:.75rem; max-width:820px; margin-inline:auto}
details.faq-item{background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-s); overflow:hidden}
details.faq-item[open]{border-color:var(--solder)}
details.faq-item summary{list-style:none; cursor:pointer; padding:1.05rem 1.2rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; font-weight:700; font-size:.98rem}
details.faq-item summary::-webkit-details-marker{display:none}
.faq-icon{flex:none; width:22px; height:22px; border-radius:50%; border:1.5px solid var(--line); display:flex; align-items:center; justify-content:center; position:relative}
.faq-icon::before,.faq-icon::after{content:""; position:absolute; background:var(--ink-soft)}
.faq-icon::before{width:10px; height:2px}
.faq-icon::after{width:2px; height:10px}
details.faq-item[open] .faq-icon::after{transform:rotate(90deg); opacity:0}
details.faq-item[open] .faq-icon{border-color:var(--solder)}
.faq-answer{padding:0 1.2rem 1.15rem; color:var(--ink-soft); font-size:.95rem; line-height:1.65}
.cta-band{background:linear-gradient(120deg,var(--navy) 0%, #1B1030 60%, #2A1408 130%); color:#fff; border-radius:var(--radius-l); padding:var(--space-5) var(--space-4); display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--space-4)}
.cta-band h2{font-size:clamp(1.5rem,3vw,2.1rem); max-width:20ch}
.cta-band p{color:var(--hero-lede-ink); margin-top:.6rem; max-width:44ch}
@media (max-width:900px){.footer-grid{ grid-template-columns:1fr 1fr; }}
.footer-brand p{color:var(--footer-ink-soft) !important}
.footer-col a{color:var(--footer-ink) !important}