[data-page="faq"] .hero-copy { max-width: min(1180px, 100%); }
[data-page="faq"] .hero .display { font-size: clamp(54px, 7.2vw, 108px); line-height: 1.02; }
[data-page="faq"] .hero .lede { max-width: 30em; }
[data-page="faq"] .fq-list { --col: calc((100vw - 2 * var(--gut) - 11 * var(--gap)) / 12); padding-top: clamp(36px, 5vh, 56px); padding-bottom: 0; }
[data-page="faq"] .fq-list .faq-head { grid-column: 1 / -1; position: static; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: baseline; margin-bottom: 18px; }
[data-page="faq"] .fq-list .faq-head .kick { grid-column: 1 / span 8; display: flex; align-items: center; gap: 18px; margin: 0; }
[data-page="faq"] .fq-list .faq-head .kick::after { content: ''; flex: 1; height: 1px; background: var(--hair); }
[data-page="faq"] .fq-list .faq-head .h2 { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
[data-page="faq"] .fq-list .faq-head .lede { grid-column: 9 / span 4; grid-row: 1; margin: 0; font-size: 15.5px; color: var(--ink-2); max-width: 24em; text-wrap: balance; }
[data-page="faq"] .fq-list .faq-list { grid-column: 1 / -1; counter-reset: fq; border-bottom: 0; }
[data-page="faq"] .fq-list .faq-item { counter-increment: fq; border-top: 1px solid var(--hair); position: relative; }
[data-page="faq"] .fq-list .faq-item:is(:nth-child(1), :nth-child(3), :nth-child(7), :nth-child(11)) { margin-top: clamp(92px, 11vh, 112px); }
[data-page="faq"] .fq-list .faq-item:nth-child(1) { margin-top: clamp(110px, 13vh, 132px); }
[data-page="faq"] .fq-list .faq-item:is(:nth-child(1), :nth-child(3), :nth-child(7), :nth-child(11))::before {
  position: absolute; left: calc(var(--col) + var(--gap)); bottom: calc(100% + 18px);
  font: italic 400 clamp(22px, 1.75vw, 26px)/1.05 var(--serif); letter-spacing: -.004em; color: var(--ink-2);
}
[data-page="faq"] .fq-list .faq-item:nth-child(1)::before { font-size: clamp(40px, 3.9vw, 58px); line-height: 1; letter-spacing: -.02em; color: var(--ink); bottom: calc(100% + 22px); }
[data-page="faq"] .fq-list .faq-item:nth-child(1)::before { content: "If something is wrong" / ""; }
[data-page="faq"] .fq-list .faq-item:nth-child(3)::before { content: "Getting service" / ""; }
[data-page="faq"] .fq-list .faq-item:nth-child(7)::before { content: "The work" / ""; }
[data-page="faq"] .fq-list .faq-item:nth-child(11)::before { content: "Price and home pools" / ""; }
[data-page="faq"] .fq-list .faq-item summary {
  display: grid; grid-template-columns: calc(var(--col) + var(--gap)) minmax(0, 1fr) 44px; align-items: baseline;
  gap: 0; padding: clamp(20px, 2.6vh, 26px) 0;
  font: 400 clamp(25px, 2.08vw, 31px)/1.16 var(--serif); letter-spacing: -.012em; color: var(--ink); text-wrap: balance;
}
[data-page="faq"] .fq-list .faq-item summary::before {
  content: counter(fq, decimal-leading-zero) / ""; font: 400 12px/1 var(--mono); letter-spacing: .14em; color: var(--ink-3);
  transform: translateY(-.3em); transition: color .4s;
}
[data-page="faq"] .fq-list .faq-item summary::after {
  content: ''; justify-self: end; align-self: center; width: 16px; height: 16px; margin: 0; border: 0;
  background: linear-gradient(var(--accent), var(--accent)) center / 16px 1px no-repeat, linear-gradient(var(--accent), var(--accent)) center / 1px 16px no-repeat;
  transform: rotate(0deg); transition: transform .5s var(--ease);
}
[data-page="faq"] .fq-list .faq-item[open] summary::after { transform: rotate(135deg); margin: 0; }
[data-page="faq"] .fq-list .faq-item[open] summary::before { color: var(--accent); }
[data-page="faq"] .fq-list .faq-item summary:hover::after { transform: rotate(90deg); }
[data-page="faq"] .fq-list .faq-item[open] summary:hover::after { transform: rotate(135deg); }
[data-page="faq"] .fq-list .faq-item summary:focus { outline: none; }
[data-page="faq"] .fq-list .faq-item summary:focus-visible { outline: 1px solid var(--accent); outline-offset: 6px; }
[data-page="faq"] .fq-list .faq-a {
  margin-left: calc(5 * (var(--col) + var(--gap))); max-width: 34em; padding: 0 44px clamp(28px, 4vh, 40px) 0;
  font-size: 18px; line-height: 1.6; color: var(--ink-2); text-wrap: pretty;
}
[data-page="faq"] .fq-list .faq-a p { position: relative; padding-top: 18px; }
[data-page="faq"] .fq-list .faq-a p::before { content: ''; position: absolute; left: 0; top: 0; width: 34px; height: 1px; background: var(--accent); }
[data-page="faq"] .fq-list .faq-a a { color: var(--ink); border-bottom: 1px solid var(--accent); padding-bottom: 1px; transition: color .2s; }
[data-page="faq"] .fq-list .faq-a a:hover { color: var(--accent-hi); }
[data-page="faq"] .fq-list .faq-a a:focus-visible { outline: 1px solid var(--accent); outline-offset: 3px; }
[data-page="faq"] .fq-list .faq-item:nth-child(1)::details-content { content-visibility: visible; }
[data-page="faq"] .fq-list .faq-item:nth-child(1) summary { cursor: default; padding-bottom: 6px; }
[data-page="faq"] .fq-list .faq-item:nth-child(1) summary::after { visibility: hidden; }
[data-page="faq"] .fq-list .faq-item:nth-child(1) summary::before { color: var(--accent); }
[data-page="faq"] .fq-list .faq-item:nth-child(1) .faq-a p { padding-top: 12px; }
[data-page="faq"] .fq-list .faq-item:nth-child(1) .faq-a p::before { content: none; }
[data-page="faq"] .fq-list .faq-item:nth-child(1) .faq-a {
  margin-left: calc(var(--col) + var(--gap)); max-width: 36em; padding-bottom: clamp(38px, 5.4vh, 54px);
  font-size: 19px; line-height: 1.58; color: var(--ink); animation: none;
}
@media (prefers-reduced-motion: no-preference) {
  [data-page="faq"] .fq-list .faq-item[open] .faq-a { animation: fqOpen .55s cubic-bezier(.16, 1, .3, 1) both; }
}
@keyframes fqOpen { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
[data-page="faq"] .s-close { padding-top: 0; }
[data-page="faq"] .s-close .call-grid { --col: calc((100vw - 2 * var(--gut) - 11 * var(--gap)) / 12); align-items: start; border-top: 1px solid var(--hair); padding-top: clamp(26px, 3.4vh, 34px); }
[data-page="faq"] .s-close .call-copy { grid-column: 1 / span 8; display: grid; grid-template-columns: calc(var(--col) + var(--gap)) minmax(0, 1fr); align-items: baseline; }
[data-page="faq"] .s-close .call-copy::before { content: "13" / ""; grid-row: 1; font: 400 12px/1 var(--mono); letter-spacing: .14em; color: var(--accent); transform: translateY(-.3em); }
[data-page="faq"] .s-close .call-copy > * { grid-column: 2; }
[data-page="faq"] .s-close .h2.big { font-size: clamp(46px, 4.6vw, 70px); line-height: 1.02; letter-spacing: -.03em; max-width: 11em; }
[data-page="faq"] .s-close .body { margin-top: 22px; font-size: 18px; color: var(--ink-2); max-width: 26em; }
[data-page="faq"] .s-close .call-num { grid-column: 9 / span 4; justify-self: start; padding-top: 6px; }
[data-page="faq"] .s-close .stage-call { height: clamp(130px, 18vh, 190px); }
@media (max-width: 1080px) {
  [data-page="faq"] .fq-list .faq-a { margin-left: calc(4 * (var(--col) + var(--gap))); }
  [data-page="faq"] .s-close .call-copy { grid-column: 1 / span 7; }
  [data-page="faq"] .s-close .call-num { grid-column: 8 / span 5; }
}
@media (max-width: 760px) {
  [data-page="faq"] .hero .display { font-size: clamp(46px, 12.6vw, 56px); line-height: 1.02; }
  [data-page="faq"] .fq-list { padding-top: 16px; }
  [data-page="faq"] .fq-list .faq-head { display: block; margin-bottom: 0; }
  [data-page="faq"] .fq-list .faq-head .lede, [data-page="faq"] .fq-list .faq-head .kick { display: none; }
  [data-page="faq"] .fq-list .faq-item:is(:nth-child(1), :nth-child(3), :nth-child(7), :nth-child(11)) { margin-top: 72px; }
  [data-page="faq"] .fq-list .faq-item:nth-child(1) { margin-top: 58px; }
  [data-page="faq"] .fq-list .faq-item:is(:nth-child(1), :nth-child(3), :nth-child(7), :nth-child(11))::before { left: 0; bottom: calc(100% + 14px); font-size: 22px; }
  [data-page="faq"] .fq-list .faq-item:nth-child(1)::before { font-size: 32px; bottom: calc(100% + 16px); }
  [data-page="faq"] .fq-list .faq-item summary { grid-template-columns: 34px minmax(0, 1fr) 28px; padding: 18px 0 19px; font-size: 22px; line-height: 1.2; letter-spacing: -.006em; }
  [data-page="faq"] .fq-list .faq-item summary::before { font-size: 11px; transform: translateY(-.2em); }
  [data-page="faq"] .fq-list .faq-item summary::after { width: 14px; height: 14px; background-size: 14px 1px, 1px 14px; align-self: start; margin-top: 7px; }
  [data-page="faq"] .fq-list .faq-item[open] summary::after { margin-top: 7px; }
  [data-page="faq"] .fq-list .faq-a { margin-left: 34px; padding: 0 0 26px; font-size: 16.5px; }
  [data-page="faq"] .fq-list .faq-item:nth-child(1) .faq-a { margin-left: 34px; padding-bottom: 32px; font-size: 17px; }
  [data-page="faq"] .fq-list .faq-item:nth-child(1) summary { padding-bottom: 4px; }
  [data-page="faq"] .hero { min-height: 0; padding-bottom: 36px; }
  [data-page="faq"] .s-close .call-grid { padding-top: 22px; }
  [data-page="faq"] .s-close .call-copy { grid-template-columns: 34px minmax(0, 1fr); }
  [data-page="faq"] .s-close .call-copy::before { font-size: 11px; transform: translateY(-.2em); }
  [data-page="faq"] .s-close .h2.big { font-size: clamp(36px, 10vw, 42px); }
  [data-page="faq"] .s-close .body { margin-top: 16px; font-size: 16.5px; }
  [data-page="faq"] .s-close .call-num { grid-column: 1; margin: 26px 0 0 34px; }
  [data-page="faq"] .s-close .call-tel { font-size: 38px; }
  [data-page="faq"] .s-close .stage-call { height: 8vh; height: 8svh; margin-top: 8px; }
  [data-page="faq"] .foot { background: var(--ground); border-top: 1px solid var(--hair-2); padding-bottom: calc(30px + env(safe-area-inset-bottom)); }
}