/* kyleluces.com/free · the free tools section, in the same dark room as the rest of the site.
   Builds on /css/site.css tokens: --bg, --panel, --line, --text, --mute, --acc, --acc-dim, --font-b, --font-m. */
.fr-hero{padding:clamp(2.2rem,6vw,4.5rem) 0 clamp(1.6rem,4vw,2.6rem)}
.fr-hero .lede{margin-bottom:0}
.fr-feature{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(1.5rem,4vw,3rem);align-items:center}
.fr-copy{display:flex;flex-direction:column;gap:1.1rem}
.fr-copy h2{margin:0}
.fr-copy .lede{margin:0}
.fr-btns{display:flex;flex-wrap:wrap;gap:.6rem}
.fr-btns .chip svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fr-note{font-size:.88rem;color:var(--mute);margin:0}
.fr-note a{color:var(--text)}
.fr-phones{display:flex;gap:14px;justify-content:center;align-items:flex-start}
.fr-phone{width:min(240px,48%);border-radius:28px;border:6px solid #1F262E;overflow:hidden;background:#EEF1F3;box-shadow:0 24px 60px -28px rgba(0,0,0,.8)}
.fr-phone:nth-child(2){margin-top:46px}
.fr-phone img{width:100%;height:auto}
.fr-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.fr-steps .panel{display:flex;flex-direction:column;gap:.45rem}
.fr-steps .n{font-family:var(--font-m);font-size:.78rem;color:var(--acc)}
.fr-steps h3{margin:0}
.fr-steps p{margin:0;color:var(--mute);font-size:.95rem;line-height:1.55}

/* guide */
.fr-doc{max-width:46rem;display:flex;flex-direction:column}
.fr-doc section{padding-top:clamp(2.2rem,5vw,3.2rem);display:flex;flex-direction:column;gap:.9rem}
.fr-doc h2{margin:0}
.fr-doc ol{margin:0;padding-left:1.3rem;display:flex;flex-direction:column;gap:.6rem;color:var(--mute)}
.fr-doc ol b{color:var(--text)}
.fr-doc p{margin:0}
.fr-callout{border:1px solid var(--line);border-left:3px solid var(--acc);border-radius:12px;padding:1rem 1.1rem;background:var(--panel);color:var(--mute)}
.fr-callout b{color:var(--text)}
.fr-prompt{border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.7rem}
.fr-prompt .hd{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.fr-prompt .hd b{font-size:1.02rem}
.fr-prompt p{white-space:pre-wrap;font-family:var(--font-m);font-size:.84rem;line-height:1.7;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:.85rem .95rem}
.fr-prompt .chip{padding:.45rem .8rem;font-size:.85rem;cursor:pointer;font-family:inherit;color:var(--text)}
.fr-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fr-two .panel p{color:var(--mute);font-size:.95rem;line-height:1.55}
.fr-toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--acc);color:var(--bg);border-radius:999px;padding:.55rem 1rem;font-weight:700;font-size:.9rem;z-index:20}
.fr-toast[hidden]{display:none}

@media (max-width:900px){
  .fr-feature{grid-template-columns:1fr}
  .fr-phones{order:-1}
  .fr-steps,.fr-two{grid-template-columns:1fr}
}