/* corpolife2.com — public pages (owner: A · public pages). Loaded after site.css on /, /gate, /join, /how, /faq, /terms.
   site.css is generated from the mockups and is never edited; everything page-specific lives here.
   Sections: 1 utilities · 2 phone menu · 3 landing · 4 gate · 5 badge office · 6 info pages (how, faq) · 7 house rules. */

/* ---------- 1 · utilities ---------- */
/* [hidden], the phone menu and the crumb links moved to the shared site.css (core additions). */
.vh{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.nb{white-space:nowrap}

/* ---------- 3 · landing ---------- */
a.badgechip{text-decoration:none;transition:border-color .15s ease,background .15s ease}
a.badgechip:hover{border-color:var(--brass);background:rgba(217,184,116,.08)}
a.lnote{text-decoration:none}
a.lnote:hover{color:var(--ink)}
.lver span{display:block}
@media (max-width:760px){
  /* three badges side by side: the strap line would not fit the badge at this width, so only the price rides on it */
  .lanyards .bdg-meta span{display:none}
  .lanyards .bdg-meta{justify-content:center}
  .lanyards .bdg-title{font-size:8px;letter-spacing:.1em}
  .lanyards .bdg-title .jp{display:block;margin:0 0 1px}
  .hang .price b{font-size:15px;white-space:nowrap}
  .pbtn{padding:0 12px;font-size:13px}
}

/* ---------- 4 · gate ---------- */
.gate{min-height:100vh;min-height:100svh}
.gate-card{margin:0}
.gate-card .fine a{text-decoration:underline;text-underline-offset:2px}

/* ---------- 5 · badge office ---------- */
.join-note{margin-top:16px}
#join .warn{margin-top:16px}
.tier--dim{cursor:not-allowed;border-style:dashed}
.tier--dim:hover{transform:none;border-color:rgba(201,161,90,.22)}
.tier--dim .bdg,
.tier--dim .t-price,
.tier--dim .t-open{opacity:.4;filter:grayscale(.7)}
.t-hr{font-size:12px;line-height:1.45;color:var(--rose);max-width:30ch}
/* before the script runs, or without it: picking 課長 greys the 1-month length (the script then really disables it) */
.fl-main:has(#tier-m:checked) .seg label:has(#mo-1){opacity:.38;pointer-events:none}
.rows .r b .jp{margin-right:2px}
@media (max-width:760px){
  .t-hr{max-width:none}
  .tier--dim .tw{align-items:flex-start}
  /* the mini badge is 84px wide here: the "7F" label gives way so the price fits on one line */
  .tier .bdg-meta span{display:none}
  .tier .bdg-meta{justify-content:center;padding-inline:4px}
  .tier .bdg-meta b{white-space:nowrap;letter-spacing:.04em}
}

/* ---------- 6 · info pages (how, faq) ---------- */
.info .sec-head{max-width:760px}
.diagram-cap{margin-top:10px}
.diagram-hint{display:none;margin-top:8px}
.keyval{margin-top:8px;font-size:13px;word-break:break-all}
.how-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-top:16px;align-items:start}
.how-split .r b{white-space:nowrap}
.hsteps{list-style:none;margin:0;padding:0;counter-reset:h;display:flex;flex-direction:column}
.hsteps li{counter-increment:h;display:grid;grid-template-columns:28px minmax(0,1fr);gap:0 14px;padding:13px 0;border-top:1px solid var(--line)}
.hsteps li:first-child{border-top:0;padding-top:8px}
.hsteps li::before{content:counter(h);width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;border:1.5px solid rgba(201,161,90,.45);color:var(--brass)}
.hsteps b{display:block;font-size:14px;color:var(--ink)}
.hsteps p{font-size:13px;color:var(--mut);margin-top:3px;line-height:1.55}
.hsteps a{color:var(--cyan);text-underline-offset:3px}

.jump{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 6px}
.jump a.chip{text-decoration:none;transition:border-color .15s ease,color .15s ease}
.jump a.chip:hover{border-color:var(--brass);color:#fff}
.fq{margin-top:44px;scroll-margin-top:16px}
.fq-title{font-family:var(--f-display);font-weight:400;font-size:clamp(24px,2.6vw,32px);line-height:1.12;letter-spacing:-.015em;margin:6px 0 16px;font-variation-settings:'opsz' 144}
.fq-card{padding:4px 24px}
.qa{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.7fr);gap:8px 40px;padding:20px 0;border-top:1px solid var(--line)}
.qa:first-child{border-top:0}
.qa h3{font-size:14.5px;font-weight:700;line-height:1.4}
.qa .a{font-size:13.5px;line-height:1.65;color:var(--mut);display:flex;flex-direction:column;gap:10px;min-width:0}
.qa .a b{color:var(--ink);font-weight:700}
.qa .a a{color:var(--cyan);text-underline-offset:3px}
.tcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:2px}
.tcard{padding:14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.tcard .eb{color:var(--faint)}
.tcard .big{font-size:24px;margin:6px 0}
.tcard .big small{font-size:12px;font-weight:600;color:var(--mut);letter-spacing:0}
.tcard p{font-size:12.5px;line-height:1.5;color:var(--mut)}
.faq-end{margin-top:44px;max-width:70ch}
@media (max-width:1000px){
  .how-split{grid-template-columns:minmax(0,1fr)}
  .qa{grid-template-columns:minmax(0,1fr);gap:8px;padding:18px 0}
  .tcards{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:760px){
  .fq-card{padding:2px 16px}
  .fq{margin-top:34px}
  .diagram-hint{display:block}
}

/* ---------- 7 · house rules ---------- */
.paper.terms{max-width:860px;margin:6px 0 0;padding:28px 32px 24px}
.clauses{list-style:none;margin:0;padding:0;counter-reset:cl}
.clauses li{counter-increment:cl;display:grid;grid-template-columns:34px minmax(0,1fr);gap:0 14px;padding:16px 0;border-top:1px solid var(--pline)}
.clauses li:first-child{border-top:0;padding-top:2px}
.clauses li::before{content:counter(cl,decimal-leading-zero);font-family:var(--f-mono);font-size:12px;font-weight:700;color:var(--pmut);padding-top:3px}
.clauses h3{font-size:15px;font-weight:800;margin-bottom:5px}
.clauses p{font-size:13.5px;line-height:1.62;color:var(--pink)}
.clauses p+p{margin-top:8px}
.paper.terms a{color:#0B6B41;text-underline-offset:3px}
@media (max-width:760px){
  .paper.terms{padding:20px 18px}
  .clauses li{grid-template-columns:26px minmax(0,1fr);gap:0 10px}
}